improve html api;

fix thumbnails loading api;
add favoriteId api

lib/pages/comic_page.dart

@@ -840,43 +840,38 @@ class _ComicThumbnailsState extends State<_ComicThumbnails> {
 
   late List<String> thumbnails;
 
-  bool isInitialLoading = false;
+  bool isInitialLoading = true;
 
   String? next;
 
+  String? error;
+
   @override
   void didChangeDependencies() {
     state = context.findAncestorStateOfType<_ComicPageState>()!;
+    loadNext();
     thumbnails = List.from(state.comic.thumbnails ?? []);
     super.didChangeDependencies();
   }
 
-  bool isLoading = false;
-
   void loadNext() async {
-    if (state.comicSource.loadComicThumbnail == null || isLoading) return;
+    if (state.comicSource.loadComicThumbnail == null) return;
     if (!isInitialLoading && next == null) {
       return;
     }
-    setState(() {
-      isLoading = true;
-    });
     var res = await state.comicSource.loadComicThumbnail!(state.comic.id, next);
     if (res.success) {
       thumbnails.addAll(res.data);
       next = res.subData;
       isInitialLoading = false;
+    } else {
+      error = res.errorMessage;
     }
-    setState(() {
-      isLoading = false;
-    });
+    setState(() {});
   }
 
   @override
   Widget build(BuildContext context) {
-    if (thumbnails.isEmpty) {
-      Future.microtask(loadNext);
-    }
     return SliverMainAxisGroup(
       slivers: [
         SliverToBoxAdapter(
@@ -887,7 +882,7 @@ class _ComicThumbnailsState extends State<_ComicThumbnails> {
         SliverGrid(
           delegate: SliverChildBuilderDelegate(childCount: thumbnails.length,
               (context, index) {
-            if (index == thumbnails.length - 1) {
+            if (index == thumbnails.length - 1 && error == null) {
               loadNext();
             }
             return Padding(
@@ -940,7 +935,19 @@ class _ComicThumbnailsState extends State<_ComicThumbnails> {
             childAspectRatio: 0.65,
           ),
         ),
-        if (isLoading)
+        if(error != null)
+          SliverToBoxAdapter(
+            child: Column(
+              children: [
+                Text(error!),
+                Button.outlined(
+                  onPressed: loadNext,
+                  child: Text("Retry".tl),
+                )
+              ],
+            ),
+          )
+        else if (next != null || isInitialLoading)
           const SliverToBoxAdapter(
             child: ListLoadingIndicator(),
           ),
@@ -1185,7 +1192,7 @@ class _NetworkFavoritesState extends State<_NetworkFavorites> {
                 isLoading = true;
               });
               var res = await widget.comicSource.favoriteData!
-                  .addOrDelFavorite!(widget.cid, '', !isFavorite);
+                  .addOrDelFavorite!(widget.cid, '', !isFavorite, null);
               if (res.success) {
                 widget.onFavorite(!isFavorite);
                 context.pop();
@@ -1272,16 +1279,32 @@ class _NetworkFavoritesState extends State<_NetworkFavorites> {
             ),
           ),
           Center(
-            child: FilledButton(
-              onPressed: () {
+            child: Button.filled(
+              isLoading: isLoading,
+              onPressed: () async {
                 if (selected == null) {
                   return;
                 }
-                widget.comicSource.favoriteData!.addOrDelFavorite!(
-                    widget.cid, selected!, !addedFolders.contains(selected!));
-                context.pop();
+                setState(() {
+                  isLoading = true;
+                });
+                var res = await widget.comicSource.favoriteData!.addOrDelFavorite!(
+                  widget.cid,
+                  selected!,
+                  !addedFolders.contains(selected!),
+                  null,
+                );
+                if (res.success) {
+                  context.showMessage(message: "Success".tl);
+                  context.pop();
+                } else {
+                  context.showMessage(message: res.errorMessage!);
+                  setState(() {
+                    isLoading = false;
+                  });
+                }
               },
-              child: addedFolders.contains(selected!)
+              child: selected != null && addedFolders.contains(selected!)
                   ? Text("Remove".tl)
                   : Text("Add".tl),
             ).paddingVertical(8),

lib/pages/favorites/network_favorites_page.dart

@@ -1,8 +1,11 @@
 part of 'favorites_page.dart';
 
-// TODO: Add a menu option to delete a comic from favorites
-
-Future<bool> _deleteComic(String cid, String? fid, String sourceKey) async {
+Future<bool> _deleteComic(
+  String cid,
+  String? fid,
+  String sourceKey,
+  String? favId,
+) async {
   var source = ComicSource.find(sourceKey);
   if (source == null) {
     return false;
@@ -31,6 +34,7 @@ Future<bool> _deleteComic(String cid, String? fid, String sourceKey) async {
                   cid,
                   fid ?? '',
                   false,
+                  favId,
                 );
                 if (res.success) {
                   context.showMessage(message: "Deleted".tl);
@@ -115,7 +119,12 @@ class _NormalFavoritePage extends StatelessWidget {
             icon: Icons.delete_outline,
             text: "Remove".tl,
             onClick: () async {
-              var res = await _deleteComic(comic.id, null, comic.sourceKey);
+              var res = await _deleteComic(
+                comic.id,
+                null,
+                comic.sourceKey,
+                comic.favoriteId,
+              );
               if (res) {
                 comicListKey.currentState!.remove(comic);
               }
@@ -291,14 +300,16 @@ class _MultiFolderFavoritesPageState extends State<_MultiFolderFavoritesPage> {
                     ),
                     onPressed: () {
                       showDialog(
-                          context: context,
-                          builder: (context) {
-                            return _CreateFolderDialog(
-                                widget.data,
-                                () => setState(() {
-                                      _loading = true;
-                                    }));
-                          });
+                        context: context,
+                        builder: (context) {
+                          return _CreateFolderDialog(
+                            widget.data,
+                            () => setState(() {
+                              _loading = true;
+                            }),
+                          );
+                        },
+                      );
                     },
                   ),
                 ),
@@ -382,7 +393,7 @@ class _FolderTile extends StatelessWidget {
         return StatefulBuilder(builder: (context, setState) {
           return ContentDialog(
             title: "Delete".tl,
-            content: Text("Are you sure you want to delete this folder?".tl),
+            content: Text("Are you sure you want to delete this folder?".tl).paddingHorizontal(16),
             actions: [
               Button.filled(
                 isLoading: loading,
@@ -448,36 +459,37 @@ class _CreateFolderDialogState extends State<_CreateFolderDialog> {
           height: 10,
         ),
         if (loading)
-          const SizedBox(
-            child: Center(
-              child: CircularProgressIndicator(),
-            ),
+          Center(
+            child: const CircularProgressIndicator(
+              strokeWidth: 2,
+            ).fixWidth(24).fixHeight(24),
           )
         else
           SizedBox(
-              height: 35,
-              child: Center(
-                child: TextButton(
-                    onPressed: () {
+            height: 35,
+            child: Center(
+              child: TextButton(
+                onPressed: () {
+                  setState(() {
+                    loading = true;
+                  });
+                  widget.data.addFolder!(controller.text).then((b) {
+                    if (b.error) {
+                      context.showMessage(message: b.errorMessage!);
                       setState(() {
-                        loading = true;
+                        loading = false;
                       });
-                      widget.data.addFolder!(controller.text).then((b) {
-                        if (b.error) {
-                          context.showMessage(message: b.errorMessage!);
-                          setState(() {
-                            loading = false;
-                          });
-                        } else {
-                          context.pop();
-                          context.showMessage(
-                              message: "Created successfully".tl);
-                          widget.updateState();
-                        }
-                      });
-                    },
-                    child: Text("Submit".tl)),
-              ))
+                    } else {
+                      context.pop();
+                      context.showMessage(message: "Created successfully".tl);
+                      widget.updateState();
+                    }
+                  });
+                },
+                child: Text("Submit".tl),
+              ),
+            ),
+          )
       ],
     );
   }
@@ -501,6 +513,9 @@ class _FavoriteFolder extends StatelessWidget {
       leadingSliver: SliverAppbar(
         title: Text(title),
       ),
+      errorLeading: Appbar(
+        title: Text(title),
+      ),
       loadPage: (i) => data.loadComic(i, folderID),
       menuBuilder: (comic) {
         return [
@@ -508,7 +523,12 @@ class _FavoriteFolder extends StatelessWidget {
             icon: Icons.delete_outline,
             text: "Remove".tl,
             onClick: () async {
-              var res = await _deleteComic(comic.id, null, comic.sourceKey);
+              var res = await _deleteComic(
+                comic.id,
+                null,
+                comic.sourceKey,
+                comic.favoriteId,
+              );
               if (res) {
                 comicListKey.currentState!.remove(comic);
               }