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,11 +31,9 @@ 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(),
-        SegmentedButton(
         options: [
           SegmentedButtonOption("public", "Public".tl),
           SegmentedButtonOption("private", "Private".tl),
@@ -48,9 +46,8 @@ class _BookMarkedArtworkPageState extends State<BookMarkedArtworkPage>{
           }
         },
         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,12 +31,9 @@ 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),),
-        const Spacer(),
-        SegmentedButton(
         options: [
           SegmentedButtonOption("all", "All".tl),
           SegmentedButtonOption("public", "Public".tl),
@@ -50,9 +47,8 @@ class _FollowingArtworksPageState extends State<FollowingArtworksPage> {
           }
         },
         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,13 +36,9 @@ class _RecommendationPageState extends State<RecommendationPage> {
   }
 
   Widget buildTab() {
-    return SizedBox(
+    return TitleBar(
-      child: Row(
+      title: "Explore".tl,
-        children: [
+      action: SegmentedButton<int>(
-          Text("Explore".tl,
-            style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold),),
-          const Spacer(),
-          SegmentedButton<int>(
         options: [
           SegmentedButtonOption(0, "Artworks".tl),
           SegmentedButtonOption(1, "Users".tl),
@@ -54,9 +51,7 @@ class _RecommendationPageState extends State<RecommendationPage> {
           }
         },
         value: type,
-          )
+      ),
-        ],
-      ).paddingHorizontal(16).paddingBottom(4),
     );
   }
 }

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(),