From c7ceb3035dba03e58a28f56b4c8aa940551b31f5 Mon Sep 17 00:00:00 2001
From: Jake Jia <87770044+Phoen1xCode@users.noreply.github.com>
Date: Tue, 28 Oct 2025 13:26:53 +0800
Subject: [PATCH] fix: align and unify LocalBackupManager footer layout
 (#10985)

* fix: align and unify LocalBackupManager footer layout

- Use Space component to wrap footer buttons, consistent with S3BackupManager
- Optimize delete button i18n text by using count parameter instead of hardcoded concatenation

* fix: fix the i18n issue in the  delete button text
---
 .../src/components/LocalBackupManager.tsx     | 40 ++++++++++---------
 1 file changed, 22 insertions(+), 18 deletions(-)

diff --git a/src/renderer/src/components/LocalBackupManager.tsx b/src/renderer/src/components/LocalBackupManager.tsx
index fdc64222db..7e05efcb77 100644
--- a/src/renderer/src/components/LocalBackupManager.tsx
+++ b/src/renderer/src/components/LocalBackupManager.tsx
@@ -1,7 +1,7 @@
 import { DeleteOutlined, ExclamationCircleOutlined, ReloadOutlined } from '@ant-design/icons'
 import { restoreFromLocal } from '@renderer/services/BackupService'
 import { formatFileSize } from '@renderer/utils'
-import { Button, message, Modal, Table, Tooltip } from 'antd'
+import { Button, message, Modal, Space, Table, Tooltip } from 'antd'
 import dayjs from 'dayjs'
 import { useCallback, useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
@@ -214,6 +214,26 @@ export function LocalBackupManager({ visible, onClose, localBackupDir, restoreMe
     }
   }
 
+  const footerContent = (
+    <Space align="center">
+      <Button key="refresh" icon={<ReloadOutlined />} onClick={fetchBackupFiles} disabled={loading}>
+        {t('settings.data.local.backup.manager.refresh')}
+      </Button>
+      <Button
+        key="delete"
+        danger
+        icon={<DeleteOutlined />}
+        onClick={handleDeleteSelected}
+        disabled={selectedRowKeys.length === 0 || deleting}
+        loading={deleting}>
+        {t('settings.data.local.backup.manager.delete.selected')} ({selectedRowKeys.length})
+      </Button>
+      <Button key="close" onClick={onClose}>
+        {t('common.close')}
+      </Button>
+    </Space>
+  )
+
   return (
     <Modal
       title={t('settings.data.local.backup.manager.title')}
@@ -222,23 +242,7 @@ export function LocalBackupManager({ visible, onClose, localBackupDir, restoreMe
       width={800}
       centered
       transitionName="animation-move-down"
-      footer={[
-        <Button key="refresh" icon={<ReloadOutlined />} onClick={fetchBackupFiles} disabled={loading}>
-          {t('settings.data.local.backup.manager.refresh')}
-        </Button>,
-        <Button
-          key="delete"
-          danger
-          icon={<DeleteOutlined />}
-          onClick={handleDeleteSelected}
-          disabled={selectedRowKeys.length === 0 || deleting}
-          loading={deleting}>
-          {t('settings.data.local.backup.manager.delete.selected')} ({selectedRowKeys.length})
-        </Button>,
-        <Button key="close" onClick={onClose}>
-          {t('common.close')}
-        </Button>
-      ]}>
+      footer={footerContent}>
       <Table
         rowKey="fileName"
         columns={columns}