アカウントを並び替えられるように

shiosyakeyakini-info · Oct 19, 2023 · bc9e303 · bc9e303
1 parent 26ffb8c
commit bc9e303
Show file tree

Hide file tree

Showing 2 changed files with 81 additions and 51 deletions.
diff --git a/lib/repository/account_repository.dart b/lib/repository/account_repository.dart
@@ -179,6 +179,18 @@ class AccountRepository extends Notifier<List<Account>> {
     await _addIfTabSettingNothing();
   }
 
+  Future<void> reorder(int oldIndex, int newIndex) async {
+    if (oldIndex < newIndex) {
+      newIndex -= 1;
+    }
+    final newState = state.toList();
+    final item = newState.removeAt(oldIndex);
+    newState.insert(newIndex, item);
+    state = newState;
+
+    await _save();
+  }
+
   Future<void> _save() async {
     const prefs = FlutterSecureStorage();
     await prefs.write(

diff --git a/lib/view/settings_page/account_settings_page/account_list.dart b/lib/view/settings_page/account_settings_page/account_list.dart
@@ -6,16 +6,11 @@ import 'package:miria/view/common/avatar_icon.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 
 @RoutePage()
-class AccountListPage extends ConsumerStatefulWidget {
+class AccountListPage extends ConsumerWidget {
   const AccountListPage({super.key});
 
   @override
-  ConsumerState<ConsumerStatefulWidget> createState() => AccountListPageState();
-}
-
-class AccountListPageState extends ConsumerState<AccountListPage> {
-  @override
-  Widget build(BuildContext context) {
+  Widget build(BuildContext context, WidgetRef ref) {
     final accounts = ref.watch(accountRepositoryProvider);
     return Scaffold(
       appBar: AppBar(
@@ -31,61 +26,84 @@ class AccountListPageState extends ConsumerState<AccountListPage> {
         ],
       ),
       body: Column(
+        mainAxisSize: MainAxisSize.max,
         children: [
           Expanded(
-            child: ListView.builder(
+            child: ReorderableListView.builder(
+              buildDefaultDragHandles: false,
               itemCount: accounts.length,
-              itemBuilder: (context, index) => ListTile(
-                leading: AvatarIcon.fromIResponse(accounts[index].i),
-                onLongPress: () {
-                  showDialog(
-                      context: context,
-                      builder: (context) => AlertDialog(
-                            content: const Text("ほんまに削除してええな？"),
-                            actions: [
-                              OutlinedButton(
-                                  onPressed: () {
-                                    Navigator.of(context).pop();
-                                  },
-                                  child: const Text("やっぱりせえへん")),
-                              ElevatedButton(
-                                  onPressed: () async {
-                                    await ref
-                                        .read(
-                                          accountRepositoryProvider.notifier,
-                                        )
-                                        .remove(accounts[index]);
-                                    if (!mounted) return;
-                                    setState(() {});
-                                    Navigator.of(context).pop();
-                                  },
-                                  child: const Text("ええで"))
-                            ],
-                          ));
-                },
-                title: Text(
-                    accounts[index].i.name ?? accounts[index].i.username,
-                    style: Theme.of(context).textTheme.titleMedium),
-                subtitle: Text(
-                  "@${accounts[index].userId}@${accounts[index].host}",
-                  style: Theme.of(context).textTheme.bodySmall,
-                ),
-              ),
+              itemBuilder: (context, index) {
+                final account = accounts[index];
+                return ReorderableDragStartListener(
+                  key: Key("$index"),
+                  index: index,
+                  child: ListTile(
+                    leading: AvatarIcon.fromIResponse(account.i),
+                    title: Text(
+                      account.i.name ?? account.i.username,
+                      style: Theme.of(context).textTheme.titleMedium,
+                    ),
+                    subtitle: Text(
+                      account.acct,
+                      style: Theme.of(context).textTheme.bodySmall,
+                    ),
+                    trailing: Row(
+                      mainAxisSize: MainAxisSize.min,
+                      children: [
+                        IconButton(
+                          icon: const Icon(Icons.delete),
+                          onPressed: () {
+                            showDialog(
+                              context: context,
+                              builder: (context) => AlertDialog(
+                                content: const Text("ほんまに削除してええな？"),
+                                actions: [
+                                  OutlinedButton(
+                                    onPressed: () {
+                                      Navigator.of(context).pop();
+                                    },
+                                    child: const Text("やっぱりせえへん"),
+                                  ),
+                                  ElevatedButton(
+                                    onPressed: () async {
+                                      await ref
+                                          .read(
+                                            accountRepositoryProvider.notifier,
+                                          )
+                                          .remove(account);
+                                      if (!context.mounted) return;
+                                      Navigator.of(context).pop();
+                                    },
+                                    child: const Text("ええで"),
+                                  ),
+                                ],
+                              ),
+                            );
+                          },
+                        ),
+                        const Icon(Icons.drag_handle),
+                      ],
+                    ),
+                  ),
+                );
+              },
+              onReorder: ref.read(accountRepositoryProvider.notifier).reorder,
             ),
           ),
           Align(
             alignment: Alignment.center,
             child: Padding(
               padding: const EdgeInsets.all(10),
               child: ElevatedButton(
-                  onPressed: () {
-                    context.router
-                      ..removeWhere((route) => true)
-                      ..push(const SplashRoute());
-                  },
-                  child: const Text("アカウント設定をおわる")),
+                onPressed: () {
+                  context.router
+                    ..removeWhere((route) => true)
+                    ..push(const SplashRoute());
+                },
+                child: const Text("アカウント設定をおわる"),
+              ),
             ),
-          )
+          ),
         ],
       ),
     );