update ui

lib/components/loading.dart

@@ -13,6 +13,40 @@ abstract class LoadingState<T extends StatefulWidget, S extends Object> extends
 
   Widget buildContent(BuildContext context, S data);
 
+  Widget buildError() {
+    return Center(
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          Text(error!),
+          const SizedBox(height: 12),
+          Button(
+            onPressed: () {
+              setState(() {
+                isLoading = true;
+                error = null;
+              });
+              loadData().then((value) {
+                if(value.success) {
+                  setState(() {
+                    isLoading = false;
+                    data = value.data;
+                  });
+                } else {
+                  setState(() {
+                    isLoading = false;
+                    error = value.errorMessage!;
+                  });
+                }
+              });
+            },
+            child: const Text("Retry"),
+          )
+        ],
+      ),
+    ).paddingHorizontal(16);
+  }
+
   @override
   @mustCallSuper
   void initState() {
@@ -40,9 +74,7 @@ abstract class LoadingState<T extends StatefulWidget, S extends Object> extends
         child: ProgressRing(),
       );
     } else if (error != null){
-      return Center(
+      return buildError();
-        child: Text(error!),
-      );
     } else {
       return buildContent(context, data!);
     }
@@ -131,8 +163,20 @@ abstract class MultiPageLoadingState<T extends StatefulWidget, S extends Object>
 
   Widget buildError(BuildContext context, String error) {
     return Center(
-      child: Text(error),
+      child: Column(
-    );
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          Text(error),
+          const SizedBox(height: 12),
+          Button(
+            onPressed: () {
+              reset();
+            },
+            child: const Text("Retry"),
+          )
+        ],
+      ),
+    ).paddingHorizontal(16);
   }
 
   @override

lib/components/title_bar.dart

@@ -0,0 +1,25 @@
+import 'package:fluent_ui/fluent_ui.dart';
+import 'package:pixes/foundation/app.dart';
+
+class TitleBar extends StatelessWidget {
+  const TitleBar({required this.title, this.action, super.key});
+
+  final String title;
+
+  final Widget? action;
+
+  @override
+  Widget build(BuildContext context) {
+    return SizedBox(
+      child: Row(
+        children: [
+          Text(title,
+            style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold),),
+          const Spacer(),
+          if(action != null)
+            action!
+        ],
+      ).paddingHorizontal(16).paddingVertical(8),
+    );
+  }
+}

lib/pages/bookmarks.dart

@@ -1,7 +1,7 @@
 import 'package:fluent_ui/fluent_ui.dart';
 import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
 import 'package:pixes/components/segmented_button.dart';
-import 'package:pixes/foundation/app.dart';
+import 'package:pixes/components/title_bar.dart';
 import 'package:pixes/network/network.dart';
 import 'package:pixes/utils/translation.dart';
 
@@ -31,26 +31,23 @@ class _BookMarkedArtworkPageState extends State<BookMarkedArtworkPage>{
   }
 
   Widget buildTab() {
-    return Row(
+    return TitleBar(
-      children: [
+      title: "Bookmarks".tl,
-        Text("Following".tl, style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
+      action: SegmentedButton(
-        const Spacer(),
+        options: [
-        SegmentedButton(
+          SegmentedButtonOption("public", "Public".tl),
-          options: [
+          SegmentedButtonOption("private", "Private".tl),
-            SegmentedButtonOption("public", "Public".tl),
+        ],
-            SegmentedButtonOption("private", "Private".tl),
+        onPressed: (key) {
-          ],
+          if(key != restrict) {
-          onPressed: (key) {
+            setState(() {
-            if(key != restrict) {
+              restrict = key;
-              setState(() {
+            });
-                restrict = key;
+          }
-              });
+        },
-            }
+        value: restrict,
-          },
+      ),
-          value: restrict,
+    );
-        )
-      ],
-    ).paddingHorizontal(16).paddingVertical(4);
   }
 }
 

lib/pages/following_artworks.dart

@@ -1,6 +1,6 @@
 import 'package:fluent_ui/fluent_ui.dart';
 import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
-import 'package:pixes/foundation/app.dart';
+import 'package:pixes/components/title_bar.dart';
 import 'package:pixes/utils/translation.dart';
 
 import '../components/illust_widget.dart';
@@ -31,28 +31,24 @@ class _FollowingArtworksPageState extends State<FollowingArtworksPage> {
   }
 
   Widget buildTab() {
-    return Row(
+    return TitleBar(
-      children: [
+      title: "Following".tl,
-        Text("Following".tl,
+      action: SegmentedButton(
-          style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold),),
+        options: [
-        const Spacer(),
+          SegmentedButtonOption("all", "All".tl),
-        SegmentedButton(
+          SegmentedButtonOption("public", "Public".tl),
-          options: [
+          SegmentedButtonOption("private", "Private".tl),
-            SegmentedButtonOption("all", "All".tl),
+        ],
-            SegmentedButtonOption("public", "Public".tl),
+        onPressed: (key) {
-            SegmentedButtonOption("private", "Private".tl),
+          if(key != restrict) {
-          ],
+            setState(() {
-          onPressed: (key) {
+              restrict = key;
-            if(key != restrict) {
+            });
-              setState(() {
+          }
-                restrict = key;
+        },
-              });
+        value: restrict,
-            }
+      ),
-          },
+    );
-          value: restrict,
-        )
-      ],
-    ).paddingHorizontal(16).paddingBottom(4);
   }
 }
 

lib/pages/recommendation_page.dart

@@ -2,6 +2,7 @@ import 'package:flutter/widgets.dart';
 import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
 import 'package:pixes/components/illust_widget.dart';
 import 'package:pixes/components/loading.dart';
+import 'package:pixes/components/title_bar.dart';
 import 'package:pixes/foundation/app.dart';
 import 'package:pixes/network/network.dart';
 import 'package:pixes/utils/translation.dart';
@@ -35,28 +36,22 @@ class _RecommendationPageState extends State<RecommendationPage> {
   }
 
   Widget buildTab() {
-    return SizedBox(
+    return TitleBar(
-      child: Row(
+      title: "Explore".tl,
-        children: [
+      action: SegmentedButton<int>(
-          Text("Explore".tl,
+        options: [
-            style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold),),
+          SegmentedButtonOption(0, "Artworks".tl),
-          const Spacer(),
+          SegmentedButtonOption(1, "Users".tl),
-          SegmentedButton<int>(
-            options: [
-              SegmentedButtonOption(0, "Artworks".tl),
-              SegmentedButtonOption(1, "Users".tl),
-            ],
-            onPressed: (key) {
-              if(key != type) {
-                setState(() {
-                  type = key;
-                });
-              }
-            },
-            value: type,
-          )
         ],
-      ).paddingHorizontal(16).paddingBottom(4),
+        onPressed: (key) {
+          if(key != type) {
+            setState(() {
+              type = key;
+            });
+          }
+        },
+        value: type,
+      ),
     );
   }
 }

lib/pages/search_page.dart

@@ -58,7 +58,7 @@ class _SearchPageState extends State<SearchPage> {
   @override
   Widget build(BuildContext context) {
     return ScaffoldPage(
-      padding: EdgeInsets.zero,
+      padding: const EdgeInsets.only(top: 8),
       content: Column(
         children: [
           buildSearchBar(),