Feat: Novel Ratings

src/database/queries/NovelQueries.ts

@@ -20,7 +20,7 @@ export const insertNovelAndChapters = async (
   sourceNovel: SourceNovel,
 ): Promise<number | undefined> => {
   const insertNovelQuery =
-    'INSERT INTO Novel (path, pluginId, name, cover, summary, author, artist, status, genres, totalPages) VALUES(?, ?, ?, ?, ?, ?, ?, ?, ?, ?)';
+    'INSERT INTO Novel (path, pluginId, name, cover, summary, author, artist, status, genres, rating, totalPages) VALUES(?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)';
   const novelId: number | undefined = await new Promise(resolve => {
     db.transaction(tx => {
       tx.executeSql(
@@ -35,6 +35,7 @@ export const insertNovelAndChapters = async (
           sourceNovel.artist || null,
           sourceNovel.status || null,
           sourceNovel.genres || null,
+          sourceNovel.rating || 0,
           sourceNovel.totalPages || 0,
         ],
         async (txObj, resultSet) => resolve(resultSet.insertId),
@@ -205,7 +206,7 @@ export const deleteCachedNovels = async () => {
 };
 
 const restoreFromBackupQuery =
-  'INSERT OR REPLACE INTO Novel (path, name, pluginId, cover, summary, author, artist, status, genres, totalPages) VALUES(?, ?, ?, ?, ?, ?, ?, ?, ?, ?)';
+  'INSERT OR REPLACE INTO Novel (path, name, pluginId, cover, summary, author, artist, status, genres, rating, totalPages) VALUES(?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)';
 
 export const restoreLibrary = async (novel: NovelInfo) => {
   const sourceNovel = await fetchNovel(novel.pluginId, novel.path).catch(e => {
@@ -225,6 +226,7 @@ export const restoreLibrary = async (novel: NovelInfo) => {
           novel.artist || '',
           novel.status || '',
           novel.genres || '',
+          novel.rating || 0,
           sourceNovel.totalPages || 0,
         ],
         async (txObj, { insertId }) => resolve(insertId),
@@ -261,7 +263,7 @@ export const restoreLibrary = async (novel: NovelInfo) => {
 export const updateNovelInfo = async (info: NovelInfo) => {
   db.transaction(tx => {
     tx.executeSql(
-      'UPDATE Novel SET name = ?, cover = ?, path = ?, summary = ?, author = ?, artist = ?, genres = ?, status = ?, isLocal = ? WHERE id = ?',
+      'UPDATE Novel SET name = ?, cover = ?, path = ?, summary = ?, author = ?, artist = ?, genres = ?, status = ?, rating = ?, isLocal = ? WHERE id = ?',
       [
         info.name,
         info.cover || '',
@@ -271,6 +273,7 @@ export const updateNovelInfo = async (info: NovelInfo) => {
         info.artist || '',
         info.genres || '',
         info.status || '',
+        info.rating || 0,
         Number(info.isLocal),
         info.id,
       ],

src/database/tables/NovelTable.ts

@@ -10,6 +10,7 @@ export const createNovelTableQuery = `
     artist TEXT, 
     status TEXT Default 'Unknown', 
     genres TEXT,
+    rating REAL,
     inLibrary INTEGER DEFAULT 0,
     isLocal INTEGER DEFAULT 0,
     totalPages INTEGER DEFAULT 0,

src/database/types/index.ts

@@ -10,6 +10,7 @@ export interface NovelInfo {
   artist?: string;
   status?: NovelStatus | string;
   genres?: string;
+  rating?: number;
   inLibrary: boolean;
   isLocal: boolean;
   totalPages: number;

src/plugins/types/index.ts

@@ -31,6 +31,7 @@ export interface SourceNovel extends NovelItem {
   author?: string;
   artist?: string;
   status?: NovelStatus;
+  rating?: number;
   chapters: ChapterItem[];
   totalPages?: number;
 }

src/screens/novel/components/Info/NovelInfoComponents.tsx

@@ -263,6 +263,41 @@ const NovelGenres = ({
   );
 };
 
+const NovelRating = ({
+  theme,
+  rating,
+}: {
+  theme: ThemeColors;
+  rating: number;
+}) => {
+  const totalStars = 5;
+  const starSize = 18;
+
+  const getStarIcon = (index: number) => {
+    if (rating >= index + 1) {
+      return 'star';
+    }
+    if (rating >= index + 0.5) {
+      return 'star-half-full';
+    }
+    return 'star-outline';
+  };
+
+  return (
+    <View style={styles.starsContainer}>
+      {Array.from({ length: totalStars }, (_, index) => (
+        <IconButton
+          key={index}
+          icon={getStarIcon(index)}
+          size={starSize}
+          iconColor={theme.primary}
+          style={styles.star}
+        />
+      ))}
+    </View>
+  );
+};
+
 export {
   NovelInfoContainer,
   CoverImage,
@@ -272,6 +307,7 @@ export {
   FollowButton,
   TrackerButton,
   NovelGenres,
+  NovelRating,
 };
 
 const styles = StyleSheet.create({
@@ -295,6 +331,7 @@ const styles = StyleSheet.create({
   },
   novelTitle: {
     fontSize: 20,
+    marginBottom: 4,
   },
   novelInfo: {
     fontSize: 14,
@@ -323,4 +360,13 @@ const styles = StyleSheet.create({
     borderRadius: 50,
     textTransform: 'capitalize',
   },
+  starsContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginBottom: 4,
+  },
+  star: {
+    margin: -8,
+    marginRight: -7,
+  },
 });

src/screens/novel/components/Info/NovelInfoHeader.tsx

@@ -16,6 +16,7 @@ import {
   NovelThumbnail,
   NovelTitle,
   NovelGenres,
+  NovelRating,
 } from './NovelInfoComponents';
 import { Row } from '@components/Common';
 import ReadButton from './ReadButton';
@@ -86,7 +87,7 @@ const NovelInfoHeader = ({
       (getMMKVObject<PluginItem[]>(AVAILABLE_PLUGINS) || []).find(
         plugin => plugin.id === novel.pluginId,
       )?.name || novel.pluginId,
-    [],
+    [novel.pluginId],
   );
 
   return (
@@ -130,7 +131,7 @@ const NovelInfoHeader = ({
                   name="fountain-pen-tip"
                   size={14}
                   color={theme.onSurfaceVariant}
-                  style={{ marginRight: 4 }}
+                  style={styles.icon}
                 />
                 <NovelInfo theme={theme}>{novel.author}</NovelInfo>
               </Row>
@@ -141,7 +142,7 @@ const NovelInfoHeader = ({
                   name="palette-outline"
                   size={14}
                   color={theme.onSurfaceVariant}
-                  style={{ marginRight: 4 }}
+                  style={styles.icon}
                 />
                 <NovelInfo theme={theme}>{novel.artist}</NovelInfo>
               </Row>
@@ -151,7 +152,7 @@ const NovelInfoHeader = ({
                 name={getStatusIcon(novel.status)}
                 size={14}
                 color={theme.onSurfaceVariant}
-                style={{ marginRight: 4 }}
+                style={styles.icon}
               />
               <NovelInfo theme={theme}>
                 {(translateNovelStatus(novel.status) ||
@@ -160,6 +161,12 @@ const NovelInfoHeader = ({
                   pluginName}
               </NovelInfo>
             </Row>
+            {novel.rating ? (
+              <Row>
+                <NovelRating theme={theme} rating={novel.rating} />
+                <NovelInfo theme={theme}>({novel.rating.toFixed(1)})</NovelInfo>
+              </Row>
+            ) : null}
           </View>
         </NovelInfoContainer>
       </CoverImage>
@@ -261,4 +268,8 @@ const styles = StyleSheet.create({
   infoItem: {
     marginVertical: 2,
   },
+  icon: {
+    marginRight: 4,
+    marginBottom: 4,
+  },
 });