💫 Optimize transition of pages

lib/router.dart

@@ -48,7 +48,8 @@ final _appRoutes = [
           GoRoute(
             path: '/post/write/:mode',
             name: 'postEditor',
-            pageBuilder: (context, state) => CustomTransitionPage(
+            builder: (context, state) => AppBackground(
+              isLessOptimization: true,
               child: PostEditorScreen(
                 mode: state.pathParameters['mode']!,
                 postEditId: int.tryParse(
@@ -61,34 +62,17 @@ final _appRoutes = [
                   state.uri.queryParameters['reposting'] ?? '',
                 ),
               ),
-              transitionsBuilder:
-                  (context, animation, secondaryAnimation, child) {
-                return FadeThroughTransition(
-                  animation: animation,
-                  secondaryAnimation: secondaryAnimation,
-                  fillColor: Colors.transparent,
-                  child: AppBackground(isLessOptimization: true, child: child),
-                );
-              },
             ),
           ),
           GoRoute(
             path: '/post/:slug',
             name: 'postDetail',
-            pageBuilder: (context, state) => CustomTransitionPage(
+            builder: (context, state) => AppBackground(
+              isLessOptimization: true,
               child: PostDetailScreen(
                 slug: state.pathParameters['slug']!,
                 preload: state.extra as SnPost?,
               ),
-              transitionsBuilder:
-                  (context, animation, secondaryAnimation, child) {
-                return FadeThroughTransition(
-                  animation: animation,
-                  secondaryAnimation: secondaryAnimation,
-                  fillColor: Colors.transparent,
-                  child: AppBackground(isLessOptimization: true, child: child),
-                );
-              },
             ),
           ),
         ],

lib/screens/post/post_editor.dart

@@ -354,7 +354,25 @@ class _PostEditorScreenState extends State<PostEditorScreen> {
               ),
               if (_writeController.attachments.isNotEmpty)
                 PostMediaPendingList(
-                  controller: _writeController,
+                  attachments: _writeController.attachments,
+                  isBusy: _writeController.isBusy,
+                  onUpdate: (int idx, PostWriteMedia updatedMedia) async {
+                    _writeController.setIsBusy(true);
+                    try {
+                      _writeController.setAttachmentAt(idx, updatedMedia);
+                    } finally {
+                      _writeController.setIsBusy(false);
+                    }
+                  },
+                  onRemove: (int idx) async {
+                    _writeController.setIsBusy(true);
+                    try {
+                      _writeController.removeAttachmentAt(idx);
+                    } finally {
+                      _writeController.setIsBusy(false);
+                    }
+                  },
+                  onUpdateBusy: (state) => _writeController.setIsBusy(state),
                 ).padding(bottom: 8),
               Material(
                 elevation: 2,

lib/widgets/chat/chat_message_input.dart

@@ -175,7 +175,7 @@ class ChatMessageInputState extends State<ChatMessageInput> {
           padding: _attachments.isNotEmpty
               ? const EdgeInsets.only(top: 8)
               : EdgeInsets.zero,
-          child: PostMediaPendingListRaw(
+          child: PostMediaPendingList(
             attachments: _attachments,
             isBusy: _isBusy,
             onUpdate: (idx, updatedMedia) async {

lib/widgets/post/post_media_pending_list.dart

@@ -17,53 +17,13 @@ import 'package:surface/widgets/attachment/attachment_detail.dart';
 import 'package:surface/widgets/dialog.dart';
 
 class PostMediaPendingList extends StatelessWidget {
-  final PostWriteController controller;
-
-  const PostMediaPendingList({super.key, required this.controller});
-
-  Future<void> _handleUpdate(int idx, PostWriteMedia updatedMedia) async {
-    controller.setIsBusy(true);
-    try {
-      controller.setAttachmentAt(idx, updatedMedia);
-    } finally {
-      controller.setIsBusy(false);
-    }
-  }
-
-  Future<void> _handleRemove(int idx) async {
-    controller.setIsBusy(true);
-    try {
-      controller.removeAttachmentAt(idx);
-    } finally {
-      controller.setIsBusy(false);
-    }
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return ListenableBuilder(
-      listenable: controller,
-      builder: (context, _) {
-        return PostMediaPendingListRaw(
-          attachments: controller.attachments,
-          isBusy: controller.isBusy,
-          onUpdate: (idx, updatedMedia) => _handleUpdate(idx, updatedMedia),
-          onRemove: (idx) => _handleRemove(idx),
-          onUpdateBusy: (state) => controller.setIsBusy(state),
-        );
-      },
-    );
-  }
-}
-
-class PostMediaPendingListRaw extends StatelessWidget {
   final List<PostWriteMedia> attachments;
   final bool isBusy;
   final Future<void> Function(int idx, PostWriteMedia updatedMedia)? onUpdate;
   final Future<void> Function(int idx)? onRemove;
   final void Function(bool state)? onUpdateBusy;
 
-  const PostMediaPendingListRaw({
+  const PostMediaPendingList({
     super.key,
     required this.attachments,
     required this.isBusy,
@@ -122,24 +82,11 @@ class PostMediaPendingListRaw extends StatelessWidget {
     }
   }
 
-  @override
+  ContextMenu _buildContextMenu(
-  Widget build(BuildContext context) {
+      BuildContext context, int idx, PostWriteMedia media) {
-    final devicePixelRatio = MediaQuery.of(context).devicePixelRatio;
+    return ContextMenu(
-
-    return Container(
-      constraints: const BoxConstraints(maxHeight: 120),
-      child: ListView.separated(
-        scrollDirection: Axis.horizontal,
-        padding: const EdgeInsets.symmetric(horizontal: 8),
-        separatorBuilder: (context, index) => const Gap(8),
-        itemCount: attachments.length,
-        itemBuilder: (context, idx) {
-          final media = attachments[idx];
-          return ContextMenuRegion(
-            contextMenu: ContextMenu(
       entries: [
-                if (media.type == PostWriteMediaType.image &&
+        if (media.type == PostWriteMediaType.image && media.attachment != null)
-                    media.attachment != null)
           MenuItem(
             label: 'preview'.tr(),
             icon: Symbols.preview,
@@ -150,8 +97,7 @@ class PostMediaPendingListRaw extends StatelessWidget {
               );
             },
           ),
-                if (media.type == PostWriteMediaType.image &&
+        if (media.type == PostWriteMediaType.image && media.attachment == null)
-                    media.attachment == null)
           MenuItem(
             label: 'crop'.tr(),
             icon: Symbols.crop,
@@ -161,8 +107,7 @@ class PostMediaPendingListRaw extends StatelessWidget {
           MenuItem(
             label: 'delete'.tr(),
             icon: Symbols.delete,
-                    onSelected:
+            onSelected: isBusy ? null : () => _deleteAttachment(context, idx),
-                        isBusy ? null : () => _deleteAttachment(context, idx),
           ),
         if (media.attachment == null && onRemove != null)
           MenuItem(
@@ -181,7 +126,24 @@ class PostMediaPendingListRaw extends StatelessWidget {
             },
           ),
       ],
-            ),
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final devicePixelRatio = MediaQuery.of(context).devicePixelRatio;
+
+    return Container(
+      constraints: const BoxConstraints(maxHeight: 120),
+      child: ListView.separated(
+        scrollDirection: Axis.horizontal,
+        padding: const EdgeInsets.symmetric(horizontal: 8),
+        separatorBuilder: (context, index) => const Gap(8),
+        itemCount: attachments.length,
+        itemBuilder: (context, idx) {
+          final media = attachments[idx];
+          return ContextMenuRegion(
+            contextMenu: _buildContextMenu(context, idx, media),
             child: Container(
               decoration: BoxDecoration(
                 border: Border.all(