#94 new: option of moving out server func btns

.dart_tool/flutter_gen/gen_l10n/l10n.dart

@@ -776,6 +776,18 @@ abstract class S {
   /// **'Mission'**
   String get mission;
 
+  /// No description provided for @moveOutServerFuncBtns.
+  ///
+  /// In en, this message translates to:
+  /// **'Server function button location'**
+  String get moveOutServerFuncBtns;
+
+  /// No description provided for @moveOutServerFuncBtnsHelp.
+  ///
+  /// In en, this message translates to:
+  /// **'On: can be displayed below each card on the Server Tab page.\nOff: can be displayed at the top of the Server Details page.'**
+  String get moveOutServerFuncBtnsHelp;
+
   /// No description provided for @ms.
   ///
   /// In en, this message translates to:

.dart_tool/flutter_gen/gen_l10n/l10n_de.dart

@@ -365,6 +365,12 @@ class SDe extends S {
   @override
   String get mission => 'Mission';
 
+  @override
+  String get moveOutServerFuncBtns => 'Position der Server-Funktionsschaltfläche';
+
+  @override
+  String get moveOutServerFuncBtnsHelp => 'Ein: kann unter jeder Karte auf der Registerkarte \"Server\" angezeigt werden.\nAus: kann oben auf der Seite \"Serverdetails\" angezeigt werden.';
+
   @override
   String get ms => 'ms';
 

.dart_tool/flutter_gen/gen_l10n/l10n_en.dart

@@ -365,6 +365,12 @@ class SEn extends S {
   @override
   String get mission => 'Mission';
 
+  @override
+  String get moveOutServerFuncBtns => 'Server function button location';
+
+  @override
+  String get moveOutServerFuncBtnsHelp => 'On: can be displayed below each card on the Server Tab page.\nOff: can be displayed at the top of the Server Details page.';
+
   @override
   String get ms => 'ms';
 

.dart_tool/flutter_gen/gen_l10n/l10n_id.dart

@@ -365,6 +365,12 @@ class SId extends S {
   @override
   String get mission => 'Misi';
 
+  @override
+  String get moveOutServerFuncBtns => 'Lokasi tombol fungsi server';
+
+  @override
+  String get moveOutServerFuncBtnsHelp => 'Aktif: dapat ditampilkan di bawah setiap kartu pada halaman Tab Server.\nNonaktif: dapat ditampilkan di bagian atas halaman Rincian Server.';
+
   @override
   String get ms => 'MS';
 

.dart_tool/flutter_gen/gen_l10n/l10n_zh.dart

@@ -365,6 +365,12 @@ class SZh extends S {
   @override
   String get mission => '任务';
 
+  @override
+  String get moveOutServerFuncBtns => '服务器功能按钮位置';
+
+  @override
+  String get moveOutServerFuncBtnsHelp => '开启：可以在服务器 Tab 页的每个卡片下方显示。\n关闭：在服务器详情页顶部显示。';
+
   @override
   String get ms => '毫秒';
 
@@ -1067,6 +1073,12 @@ class SZhTw extends SZh {
   @override
   String get mission => '任務';
 
+  @override
+  String get moveOutServerFuncBtns => '服務器功能按鈕位置';
+
+  @override
+  String get moveOutServerFuncBtnsHelp => '開啟：可以在服務器 Tab 頁的每個卡片下方顯示。\n關閉：在服務器詳情頁頂部顯示。';
+
   @override
   String get ms => '毫秒';
 

lib/data/res/ui.dart

@@ -4,7 +4,7 @@ import 'package:flutter/material.dart';
 
 const textSize9Grey = TextStyle(color: Colors.grey, fontSize: 9);
 const textSize11 = TextStyle(fontSize: 11);
-const textSize12Grey = TextStyle(color: Colors.grey, fontSize: 11);
+const textSize11Grey = TextStyle(color: Colors.grey, fontSize: 11);
 const textSize13 = TextStyle(fontSize: 13);
 const textSize13Bold = TextStyle(fontSize: 13, fontWeight: FontWeight.bold);
 const textSize13Grey = TextStyle(color: Colors.grey, fontSize: 13);

lib/data/store/setting.dart

@@ -102,4 +102,10 @@ class SettingStore extends PersistentStore {
 
   StoreProperty<bool> get autoCheckAppUpdate =>
       property('autoCheckAppUpdate', defaultValue: true);
+
+  /// Display server tab function buttons on the bottom of each server card if [true]
+  ///
+  /// Otherwise, display them on the top of server detail page
+  StoreProperty<bool> get moveOutServerTabFuncBtns =>
+      property('moveOutServerTabFuncBtns', defaultValue: true);
 }

lib/l10n/app_de.arb

@@ -113,6 +113,8 @@
   "maxRetryCountEqual0": "Unbegrenzte Verbindungsversuche zum Server",
   "min": "min",
   "mission": "Mission",
+  "moveOutServerFuncBtns": "Position der Server-Funktionsschaltfläche",
+  "moveOutServerFuncBtnsHelp": "Ein: kann unter jeder Karte auf der Registerkarte \"Server\" angezeigt werden.\nAus: kann oben auf der Seite \"Serverdetails\" angezeigt werden.",
   "ms": "ms",
   "name": "Name",
   "needRestart": "App muss neugestartet werden",

lib/l10n/app_en.arb

@@ -113,6 +113,8 @@
   "maxRetryCountEqual0": "Will retry again and again.",
   "min": "min",
   "mission": "Mission",
+  "moveOutServerFuncBtns": "Server function button location",
+  "moveOutServerFuncBtnsHelp": "On: can be displayed below each card on the Server Tab page.\nOff: can be displayed at the top of the Server Details page.",
   "ms": "ms",
   "name": "Name",
   "needRestart": "Need to restart app",

lib/l10n/app_id.arb

@@ -113,6 +113,8 @@
   "maxRetryCountEqual0": "Akan mencoba lagi lagi dan lagi.",
   "min": "Min",
   "mission": "Misi",
+  "moveOutServerFuncBtns": "Lokasi tombol fungsi server",
+  "moveOutServerFuncBtnsHelp": "Aktif: dapat ditampilkan di bawah setiap kartu pada halaman Tab Server.\nNonaktif: dapat ditampilkan di bagian atas halaman Rincian Server.",
   "ms": "MS",
   "name": "Nama",
   "needRestart": "Perlu memulai ulang aplikasi",

lib/l10n/app_zh.arb

@@ -113,6 +113,8 @@
   "maxRetryCountEqual0": "会无限重试",
   "min": "最小",
   "mission": "任务",
+  "moveOutServerFuncBtns": "服务器功能按钮位置",
+  "moveOutServerFuncBtnsHelp": "开启：可以在服务器 Tab 页的每个卡片下方显示。\n关闭：在服务器详情页顶部显示。",
   "ms": "毫秒",
   "name": "名称",
   "needRestart": "需要重启 App",

lib/l10n/app_zh_tw.arb

@@ -113,6 +113,8 @@
   "maxRetryCountEqual0": "會無限重試",
   "min": "最小",
   "mission": "任務",
+  "moveOutServerFuncBtns": "服務器功能按鈕位置",
+  "moveOutServerFuncBtnsHelp": "開啟：可以在服務器 Tab 頁的每個卡片下方顯示。\n關閉：在服務器詳情頁頂部顯示。",
   "ms": "毫秒",
   "name": "名稱",
   "needRestart": "需要重啓 App",

lib/view/page/full_screen.dart

@@ -250,7 +250,7 @@ class _FullScreenPageState extends State<FullScreenPage> with AfterLayoutMixin {
     );
     return Text(
       topRightStr,
-      style: textSize12Grey,
+      style: textSize11Grey,
       textScaleFactor: 1.0,
     );
   }

lib/view/page/server/detail.dart

@@ -5,6 +5,7 @@ import 'package:toolbox/core/extension/navigator.dart';
 import 'package:toolbox/core/extension/order.dart';
 import 'package:toolbox/data/model/server/cpu.dart';
 import 'package:toolbox/data/model/server/server_private_info.dart';
+import 'package:toolbox/view/widget/server_func_btns.dart';
 
 import '../../../core/extension/numx.dart';
 import '../../../core/route.dart';
@@ -95,7 +96,11 @@ class _ServerDetailPageState extends State<ServerDetailPage>
       ),
       body: ReorderableListView.builder(
         padding: EdgeInsets.only(
-            left: 13, right: 13, top: 13, bottom: _media.padding.bottom),
+          left: 13,
+          right: 13,
+          top: 13,
+          bottom: _media.padding.bottom,
+        ),
         onReorder: (int oldIndex, int newIndex) {
           setState(() {
             _cardsOrder.move(
@@ -106,6 +111,9 @@ class _ServerDetailPageState extends State<ServerDetailPage>
           });
         },
         footer: height13,
+        header: _setting.moveOutServerTabFuncBtns.fetch()!
+            ? null
+            : RoundRectCard(ServerFuncBtns(spi: widget.spi, s: _s)),
         itemCount: _cardsOrder.length,
         buildDefaultDragHandles: false,
         itemBuilder: (context, index) => ReorderableDelayedDragStartListener(

lib/view/page/server/tab.dart

@@ -1,5 +1,3 @@
-import 'dart:io' show Directory, File, Platform, Process;
-
 import 'package:after_layout/after_layout.dart';
 import 'package:circle_chart/circle_chart.dart';
 import 'package:flutter/material.dart';
@@ -9,16 +7,12 @@ import 'package:provider/provider.dart';
 import 'package:toolbox/core/extension/media_queryx.dart';
 import 'package:toolbox/core/extension/order.dart';
 import 'package:toolbox/data/model/app/net_view.dart';
-import 'package:toolbox/data/model/server/snippet.dart';
+import 'package:toolbox/view/widget/server_func_btns.dart';
-import 'package:toolbox/data/provider/snippet.dart';
-import 'package:toolbox/view/page/process.dart';
-import 'package:toolbox/view/widget/tag/picker.dart';
 import 'package:toolbox/view/widget/tag/switcher.dart';
 
 import '../../../core/route.dart';
 import '../../../core/utils/misc.dart' hide pathJoin;
 import '../../../core/utils/platform.dart';
-import '../../../core/utils/server.dart';
 import '../../../core/utils/ui.dart';
 import '../../../data/model/server/disk.dart';
 import '../../../data/model/server/server.dart';
@@ -26,12 +20,10 @@ import '../../../data/model/server/server_private_info.dart';
 import '../../../data/model/server/server_status.dart';
 import '../../../data/provider/server.dart';
 import '../../../data/res/color.dart';
-import '../../../data/model/app/menu.dart';
 import '../../../data/res/ui.dart';
 import '../../../data/store/setting.dart';
 import '../../../locator.dart';
 import '../../widget/round_rect_card.dart';
-import '../ssh/term.dart';
 import 'edit.dart';
 
 class ServerPage extends StatefulWidget {
@@ -235,10 +227,11 @@ class _ServerPageState extends State<ServerPage>
           ),
         ),
         height13,
-        SizedBox(
+        if (_settingStore.moveOutServerTabFuncBtns.fetch()!)
-          height: 29,
+          SizedBox(
-          child: _buildMoreBtn(spi),
+            height: 27,
-        ),
+            child: ServerFuncBtns(spi: spi, s: _s),
+          ),
       ];
     }
 
@@ -297,14 +290,14 @@ class _ServerPageState extends State<ServerPage>
         onTap: () => _showFailReason(ss),
         child: Text(
           _s.viewErr,
-          style: textSize12Grey,
+          style: textSize11Grey,
           textScaleFactor: 1.0,
         ),
       );
     }
     return Text(
       topRightStr,
-      style: textSize12Grey,
+      style: textSize11Grey,
       textScaleFactor: 1.0,
     );
   }
@@ -325,84 +318,6 @@ class _ServerPageState extends State<ServerPage>
     );
   }
 
-  void _onTapMoreBtns(ServerTabMenuType value, ServerPrivateInfo spi) async {
-    switch (value) {
-      case ServerTabMenuType.pkg:
-        AppRoute.pkg(spi: spi).checkClientAndGo(
-          context: context,
-          s: _s,
-          id: spi.id,
-        );
-        break;
-      case ServerTabMenuType.sftp:
-        AppRoute.sftp(spi: spi).checkClientAndGo(
-          context: context,
-          s: _s,
-          id: spi.id,
-        );
-        break;
-      case ServerTabMenuType.snippet:
-        final provider = locator<SnippetProvider>();
-        final snippets = await showDialog<List<Snippet>>(
-          context: context,
-          builder: (_) => TagPicker<Snippet>(
-            items: provider.snippets,
-            containsTag: (t, tag) => t.tags?.contains(tag) ?? false,
-            tags: provider.tags.toSet(),
-            name: (t) => t.name,
-          ),
-        );
-        if (snippets == null) {
-          return;
-        }
-        final result = await _serverProvider.runSnippets(spi.id, snippets);
-        if (result != null && result.isNotEmpty) {
-          showRoundDialog(
-            context: context,
-            title: Text(_s.result),
-            child: Text(result),
-            actions: [
-              TextButton(
-                onPressed: () => copy2Clipboard(result),
-                child: Text(_s.copy),
-              )
-            ],
-          );
-        }
-        break;
-      case ServerTabMenuType.docker:
-        AppRoute.docker(spi: spi).checkClientAndGo(
-          context: context,
-          s: _s,
-          id: spi.id,
-        );
-        break;
-      case ServerTabMenuType.process:
-        AppRoute(ProcessPage(spi: spi), 'process page').checkClientAndGo(
-          context: context,
-          s: _s,
-          id: spi.id,
-        );
-        break;
-      case ServerTabMenuType.terminal:
-        gotoSSH(spi);
-        break;
-    }
-  }
-
-  Widget _buildMoreBtn(ServerPrivateInfo spi) {
-    return Row(
-      mainAxisAlignment: MainAxisAlignment.spaceAround,
-      children: ServerTabMenuType.values
-          .map((e) => IconButton(
-                onPressed: () => _onTapMoreBtns(e, spi),
-                padding: EdgeInsets.zero,
-                icon: Icon(e.icon, size: 15),
-              ))
-          .toList(),
-    );
-  }
-
   Widget _buildNet(ServerStatus ss) {
     return ValueListenableBuilder<NetViewType>(
       valueListenable: _settingStore.netViewType.listenable(),
@@ -488,7 +403,7 @@ class _ServerPageState extends State<ServerPage>
             child: Text(
               '${percent.toStringAsFixed(1)}%',
               textAlign: TextAlign.center,
-              style: const TextStyle(fontSize: 11),
+              style: textSize11Grey,
               textScaleFactor: 1.0,
             ),
           ),
@@ -497,52 +412,6 @@ class _ServerPageState extends State<ServerPage>
     );
   }
 
-  Future<void> gotoSSH(ServerPrivateInfo spi) async {
-    // as a `Mobile first` app -> handle mobile first
-    //
-    // run built-in ssh on macOS due to incompatibility
-    if (!isDesktop || isMacOS) {
-      AppRoute(SSHPage(spi: spi), 'ssh page').go(context);
-      return;
-    }
-    final extraArgs = <String>[];
-    if (spi.port != 22) {
-      extraArgs.addAll(['-p', '${spi.port}']);
-    }
-
-    final path = () {
-      final tempKeyFileName = 'srvbox_pk_${spi.pubKeyId}';
-      return pathJoin(Directory.systemTemp.path, tempKeyFileName);
-    }();
-    final file = File(path);
-    final shouldGenKey = spi.pubKeyId != null;
-    if (shouldGenKey) {
-      if (await file.exists()) {
-        await file.delete();
-      }
-      await file.writeAsString(getPrivateKey(spi.pubKeyId!));
-      extraArgs.addAll(["-i", path]);
-    }
-
-    List<String> sshCommand = ["ssh", "${spi.user}@${spi.ip}"] + extraArgs;
-    final system = Platform.operatingSystem;
-    switch (system) {
-      case "windows":
-        await Process.start("cmd", ["/c", "start"] + sshCommand);
-        break;
-      case "linux":
-        await Process.start("x-terminal-emulator", ["-e"] + sshCommand);
-        break;
-      default:
-        showSnackBar(context, Text('Mismatch system: $system'));
-    }
-    // For security reason, delete the private key file after use
-    if (shouldGenKey) {
-      if (!await file.exists()) return;
-      await Future.delayed(const Duration(seconds: 2), file.delete);
-    }
-  }
-
   @override
   bool get wantKeepAlive => true;
 

lib/view/page/setting.dart

@@ -169,6 +169,7 @@ class _SettingPageState extends State<SettingPage> {
   Widget _buildServer() {
     return Column(
       children: [
+        _buildMoveOutServerFuncBtns(),
         _buildNetViewType(),
         _buildUpdateInterval(),
         _buildMaxRetry(),
@@ -969,4 +970,12 @@ class _SettingPageState extends State<SettingPage> {
       },
     );
   }
+
+  Widget _buildMoveOutServerFuncBtns() {
+    return ListTile(
+      title: Text(_s.moveOutServerFuncBtns),
+      subtitle: Text(_s.moveOutServerFuncBtnsHelp, style: textSize13Grey),
+      trailing: buildSwitch(context, _setting.moveOutServerTabFuncBtns),
+    );
+  }
 }

lib/view/widget/server_func_btns.dart

@@ -0,0 +1,158 @@
+import 'dart:io';
+
+import 'package:flutter/material.dart';
+import 'package:flutter_gen/gen_l10n/l10n.dart';
+import 'package:toolbox/data/provider/server.dart';
+
+import '../../core/route.dart';
+import '../../core/utils/misc.dart' hide pathJoin;
+import '../../core/utils/platform.dart';
+import '../../core/utils/server.dart';
+import '../../core/utils/ui.dart';
+import '../../data/model/app/menu.dart';
+import '../../data/model/server/server_private_info.dart';
+import '../../data/model/server/snippet.dart';
+import '../../data/provider/snippet.dart';
+import '../../locator.dart';
+import '../page/process.dart';
+import 'tag/picker.dart';
+
+class ServerFuncBtns extends StatelessWidget {
+  const ServerFuncBtns({super.key, required this.spi, required this.s});
+
+  final ServerPrivateInfo spi;
+  final S s;
+
+  void _onTapMoreBtns(
+    ServerTabMenuType value,
+    ServerPrivateInfo spi,
+    BuildContext context,
+  ) async {
+    switch (value) {
+      case ServerTabMenuType.pkg:
+        AppRoute.pkg(spi: spi).checkClientAndGo(
+          context: context,
+          s: s,
+          id: spi.id,
+        );
+        break;
+      case ServerTabMenuType.sftp:
+        AppRoute.sftp(spi: spi).checkClientAndGo(
+          context: context,
+          s: s,
+          id: spi.id,
+        );
+        break;
+      case ServerTabMenuType.snippet:
+        final provider = locator<SnippetProvider>();
+        final snippets = await showDialog<List<Snippet>>(
+          context: context,
+          builder: (_) => TagPicker<Snippet>(
+            items: provider.snippets,
+            containsTag: (t, tag) => t.tags?.contains(tag) ?? false,
+            tags: provider.tags.toSet(),
+            name: (t) => t.name,
+          ),
+        );
+        if (snippets == null) {
+          return;
+        }
+        final result =
+            await locator<ServerProvider>().runSnippets(spi.id, snippets);
+        if (result != null && result.isNotEmpty) {
+          showRoundDialog(
+            context: context,
+            title: Text(s.result),
+            child: Text(result),
+            actions: [
+              TextButton(
+                onPressed: () => copy2Clipboard(result),
+                child: Text(s.copy),
+              )
+            ],
+          );
+        }
+        break;
+      case ServerTabMenuType.docker:
+        AppRoute.docker(spi: spi).checkClientAndGo(
+          context: context,
+          s: s,
+          id: spi.id,
+        );
+        break;
+      case ServerTabMenuType.process:
+        AppRoute(ProcessPage(spi: spi), 'process page').checkClientAndGo(
+          context: context,
+          s: s,
+          id: spi.id,
+        );
+        break;
+      case ServerTabMenuType.terminal:
+        _gotoSSH(spi, context);
+        break;
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Row(
+      mainAxisAlignment: MainAxisAlignment.spaceAround,
+      children: ServerTabMenuType.values
+          .map((e) => IconButton(
+                onPressed: () => _onTapMoreBtns(e, spi, context),
+                padding: EdgeInsets.zero,
+                icon: Icon(e.icon, size: 15),
+              ))
+          .toList(),
+    );
+  }
+
+  Future<void> _gotoSSH(
+    ServerPrivateInfo spi,
+    BuildContext context,
+  ) async {
+    // as a `Mobile first` app -> handle mobile first
+    //
+    // run built-in ssh on macOS due to incompatibility
+    if (!isDesktop || isMacOS) {
+      AppRoute.ssh(spi: spi).go(context);
+      return;
+    }
+    final extraArgs = <String>[];
+    if (spi.port != 22) {
+      extraArgs.addAll(['-p', '${spi.port}']);
+    }
+
+    final path = () {
+      final tempKeyFileName = 'srvbox_pk_${spi.pubKeyId}';
+      return pathJoin(Directory.systemTemp.path, tempKeyFileName);
+    }();
+    final file = File(path);
+    final shouldGenKey = spi.pubKeyId != null;
+    if (shouldGenKey) {
+      if (await file.exists()) {
+        await file.delete();
+      }
+      await file.writeAsString(getPrivateKey(spi.pubKeyId!));
+      extraArgs.addAll(["-i", path]);
+    }
+
+    List<String> sshCommand = ["ssh", "${spi.user}@${spi.ip}"] + extraArgs;
+    final system = Platform.operatingSystem;
+    switch (system) {
+      case "windows":
+        await Process.start("cmd", ["/c", "start"] + sshCommand);
+        break;
+      case "linux":
+        await Process.start("x-terminal-emulator", ["-e"] + sshCommand);
+        break;
+      default:
+        showSnackBar(context, Text('Mismatch system: $system'));
+    }
+    // For security reason, delete the private key file after use
+    if (shouldGenKey) {
+      if (!await file.exists()) return;
+      await Future.delayed(const Duration(seconds: 2), file.delete);
+    }
+  }
+}