dark mode style fix

v0.1.16
multiple domain support
2024-10-09 09:26:39 +08:00 · 2024-10-09 09:04:23 +08:00 · 2024-10-08 22:02:00 +08:00 · 2024-10-04 08:19:46 +08:00 · 2024-10-03 07:55:09 +08:00 · 2024-10-02 12:55:24 +08:00
73 changed files with 3938 additions and 996 deletions
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -14,18 +14,18 @@ jobs:
        with:
          fetch-depth: 0

-      - name: Set up Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: 20.11.0
+      # - name: Set up Node.js
+      #   uses: actions/setup-node@v4
+      #   with:
+      #     node-version: 20.11.0

      - name: Set up Go
        uses: actions/setup-go@v5
        with:
          go-version: ">=1.22.5"

-      - name: Build Admin dashboard UI
-        run: npm --prefix=./ui ci && npm --prefix=./ui run build
+      # - name: Build Admin dashboard UI
+      #   run: npm --prefix=./ui ci && npm --prefix=./ui run build

      - name: Run GoReleaser
        uses: goreleaser/goreleaser-action@v3
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -0,0 +1,72 @@
+# 向 Certimate 贡献代码
+
+感谢你抽出时间来改进 Certimate！以下是向 Certimate 主仓库提交 PR（Pull Request）时的操作指南。
+
+- [向 Certimate 贡献代码](#向-certimate-贡献代码)
+  - [前提条件](#前提条件)
+  - [修改 Go 代码](#修改-go-代码)
+  - [修改管理页面 (Admin UI)](#修改管理页面-admin-ui)
+
+## 前提条件
+
+- Go 1.22+ (用于修改 Go 代码)
+- Node 20+ (用于修改 UI)
+
+如果还没有这样做，你可以 fork Certimate 的主仓库，并克隆到本地以便进行修改：
+
+```bash
+git clone https://github.com/your_username/certimate.git
+```
+
+> **重要提示：**
+> 建议为每个 bug 修复或新功能创建一个从 `main` 分支派生的新分支。如果你计划提交多个 PR，请保持不同的改动在独立分支中，以便更容易进行代码审查并最终合并。
+> 保持一个 pr 只实现一个功能。
+
+## 修改 Go 代码
+
+假设你已经对 Certimate 的 Go 代码做了一些修改，现在你想要运行它：
+
+1. 进入根目录
+2. 运行以下命令启动服务：
+   ```bash
+   go run main.go serve
+   ```
+
+这将启动一个 Web 服务器，默认运行在 `http://localhost:8090`，并使用来自 `ui/dist` 的预构建管理页面。
+
+**在向主仓库提交 PR 之前，建议你：**
+
+- 为你的改动添加单元测试或集成测试（Certimate 使用 Go 的标准 `testing` 包）。你可以通过以下命令运行测试（在项目根目录下）：
+
+  ```bash
+  go test ./...
+
+  ```
+
+## 修改管理页面 (Admin UI)
+
+Certimate 的管理页面是一个基于 React 和 Vite 构建的单页应用（SPA）。
+
+要启动 Admin UI：
+
+1. 进入 `ui` 项目目录
+2. 运行 `npm install` 安装依赖
+3. 启动 Vite 开发服务器：
+   ```bash
+   npm run dev
+   ```
+
+你可以通过浏览器访问 `http://localhost:5173` 来查看运行中的管理页面。
+
+由于 Admin UI 只是一个客户端应用，运行时需要 Certimate 的后端服务作为支撑。你可以手动运行Certimate，或者使用预构建的可执行文件。
+
+
+所有对 Admin UI 的修改将会自动反映在浏览器中，无需手动刷新页面。
+
+完成修改后，运行以下命令来构建 Admin UI，以便它能被嵌入到 Go 包中：
+
+```bash
+npm run build
+```
+
+完成所有步骤后，你可以将改动提交 PR 到 Certimate 主仓库。
--- a/CONTRIBUTING_EN.md
+++ b/CONTRIBUTING_EN.md
@@ -0,0 +1,73 @@
+# Contributing to Certimate
+
+Thank you for taking the time to improve Certimate! Below is a guide for submitting a PR (Pull Request) to the main Certimate repository.
+
+- [Contributing to Certimate](#contributing-to-certimate)
+  - [Prerequisites](#prerequisites)
+  - [Making Changes in the Go Code](#making-changes-in-the-go-code)
+  - [Making Changes in the Admin UI](#making-changes-in-the-admin-ui)
+
+## Prerequisites
+
+- Go 1.22+ (for Go code changes)
+- Node 20+ (for Admin UI changes)
+
+If you haven't done so already, you can fork the Certimate repository and clone your fork to work locally:
+
+```bash
+git clone https://github.com/your_username/certimate.git
+```
+
+> **Important:**
+> It is recommended to create a new branch from `main` for each bug fix or feature. If you plan to submit multiple PRs, ensure the changes are in separate branches for easier review and eventual merge.
+> Keep each PR focused on a single feature or fix.
+
+## Making Changes in the Go Code
+
+Once you have made changes to the Go code in Certimate, follow these steps to run the project:
+
+1. Navigate to the root directory.
+2. Start the service by running:
+   ```bash
+   go run main.go serve
+   ```
+
+This will start a web server at `http://localhost:8090` using the prebuilt Admin UI located in `ui/dist`.
+
+**Before submitting a PR to the main repository, consider:**
+
+- Adding unit or integration tests for your changes. Certimate uses Go’s standard `testing` package. You can run tests using the following command (while in the root project directory):
+
+  ```bash
+  go test ./...
+  ```
+
+## Making Changes in the Admin UI
+
+Certimate’s Admin UI is a single-page application (SPA) built using React and Vite.
+
+To start the Admin UI:
+
+1. Navigate to the `ui` project directory.
+2. Install the necessary dependencies by running:
+   ```bash
+   npm install
+   ```
+3. Start the Vite development server:
+   ```bash
+   npm run dev
+   ```
+
+You can now access the running Admin UI at `http://localhost:5173` in your browser.
+
+Since the Admin UI is a client-side application, you will also need to have the Certimate backend running. You can either manually run Certimate or use a prebuilt executable.
+
+Any changes you make in the Admin UI will be automatically reflected in the browser without requiring a page reload.
+
+After completing your changes, build the Admin UI so it can be embedded into the Go package:
+
+```bash
+npm run build
+```
+
+Once all steps are completed, you are ready to submit a PR to the main Certimate repository.
--- a/README.md
+++ b/README.md
@@ -1,4 +1,4 @@
-
+[中文](README.md) | [English](README_EN.md)

 # 🔒Certimate

@@ -18,27 +18,8 @@ Certimate 就是为了解决上述问题而产生的，它具有以下特点：
 * [Why Certimate?](https://docs.certimate.me/blog/why-certimate)
 * [域名变量及部署授权组介绍](https://docs.certimate.me/blog/multi-deployer)

-
 Certimate 旨在为用户提供一个安全、简便的 SSL 证书管理解决方案。使用文档请访问[https://docs.certimate.me](https://docs.certimate.me)

- [🔒Certimate](#certimate)
-  - [一、安装](#一安装)
-    - [1. 二进制文件](#1-二进制文件)
-    - [2. Docker 安装](#2-docker-安装)
-    - [3. 源代码安装](#3-源代码安装)
-  - [二、使用](#二使用)
-  - [三、支持的服务商列表](#三支持的服务商列表)
-  - [四、系统截图](#四系统截图)
-  - [五、概念](#五概念)
-    - [1. 域名](#1-域名)
-    - [2. dns 服务商授权信息](#2-dns-服务商授权信息)
-    - [3. 部署服务商授权信息](#3-部署服务商授权信息)
-  - [六、常见问题](#六常见问题)
-  - [七、贡献](#七贡献)
-  - [八、加入社区](#八加入社区)
-
-
-
 ## 一、安装

 安装 Certimate 非常简单，你可以选择以下方式之一进行安装：
@@ -54,12 +35,11 @@ Certimate 旨在为用户提供一个安全、简便的 SSL 证书管理解决
 > [!NOTE]
 > MacOS 在执行二进制文件时会提示：无法打开“certimate”，因为Apple无法检查其是否包含恶意软件。可在系统设置> 隐私与安全性> 安全性 中点击 "仍然允许"，然后再次尝试执行二进制文件。

-
 ### 2. Docker 安装

 ```bash

-git clone git@github.com:usual2970/certimate.git && cd certimate/docker && docker compose up -d
+mkdir -p ~/.certimate && cd ~/.certimate && curl -O https://raw.githubusercontent.com/usual2970/certimate/refs/heads/main/docker/docker-compose.yml && docker compose up -d

 ```

@@ -68,10 +48,10 @@ git clone git@github.com:usual2970/certimate.git && cd certimate/docker && docke
 ```bash
 git clone EMAIL:usual2970/certimate.git
 cd certimate
+go mod vendor
 go run main.go serve
 ```

-
 ## 二、使用

 执行完上述安装操作后，在浏览器中访问 `http://127.0.0.1:8090` 即可访问 Certimate 管理页面。
@@ -85,17 +65,14 @@ go run main.go serve

 ## 三、支持的服务商列表

-| 服务商 | 是否域名服务商 | 是否部署服务 | 备注 |
-|------|------|-----|------|
-| 阿里云| 是 | 是 | 支持阿里云注册的域名，支持部署到阿里云 CDN,OSS |
-| 腾讯云| 是 | 是 | 支持腾讯云注册的域名，支持部署到腾讯云 CDN |
-| 七牛云| 否 | 是 | 七牛云没有注册域名服务，支持部署到七牛云 CDN |
-|CloudFlare| 是 | 否 | 支持 CloudFlare 注册的域名，CloudFlare 服务自带SSL证书 |
-|SSH| 否 | 是 | 支持部署到 SSH 服务器 |
-|WEBHOOK| 否 | 是 | 支持回调到 WEBHOOK |
-
-
-
+| 服务商     | 是否域名服务商 | 是否部署服务 | 备注                                                   |
+| ---------- | -------------- | ------------ | ------------------------------------------------------ |
+| 阿里云     | 是             | 是           | 支持阿里云注册的域名，支持部署到阿里云 CDN,OSS         |
+| 腾讯云     | 是             | 是           | 支持腾讯云注册的域名，支持部署到腾讯云 CDN             |
+| 七牛云     | 否             | 是           | 七牛云没有注册域名服务，支持部署到七牛云 CDN           |
+| CloudFlare | 是             | 否           | 支持 CloudFlare 注册的域名，CloudFlare 服务自带SSL证书 |
+| SSH        | 否             | 是           | 支持部署到 SSH 服务器                                  |
+| WEBHOOK    | 否             | 是           | 支持回调到 WEBHOOK                                     |

 ## 四、系统截图

@@ -109,7 +86,6 @@ go run main.go serve

 ![history](https://i.imgur.com/aaPtSW7.jpeg)

-
 ## 五、概念

 Certimate 的工作流程如下：
@@ -153,7 +129,6 @@ Certimate 申请证书后，会自动将证书部署到你指定的目标上，

 ## 六、常见问题

-
 Q: 提供saas服务吗？

 > A: 不提供，目前仅支持self-hosted（私有部署）。
@@ -166,23 +141,23 @@ Q: 自动续期证书？

 > A: 已经申请的证书会在过期前10天自动续期。每天会检查一次证书是否快要过期，快要过期时会自动重新申请证书并部署到目标服务上。

-
-
 ## 七、贡献

 Certimate 是一个免费且开源的项目，采用 [MIT 开源协议](LICENSE.md)。你可以使用它做任何你想做的事，甚至把它当作一个付费服务提供给用户。

 你可以通过以下方式来支持 Certimate 的开发：

-* 提交代码：如果你发现了 bug 或有新的功能需求，而你又有相关经验，可以提交代码给我们。
+* [提交代码：如果你发现了 bug 或有新的功能需求，而你又有相关经验，可以提交代码给我们](CONTRIBUTING.md)。
 * 提交 issue：功能建议或者 bug 可以[提交 issue](https://github.com/usual2970/certimate/issues) 给我们。

 支持更多服务商、UI 的优化改进、BUG 修复、文档完善等，欢迎大家提交 PR。

 ## 八、加入社区

-* [Telegram-a new era of messaging](https://t.me/+ZXphsppxUg41YmVl) 
+* [Telegram-a new era of messaging](https://t.me/+ZXphsppxUg41YmVl)
+* 微信群聊(超200人需邀请入群，可先加作者好友)

-* 微信群聊
+<img src="https://i.imgur.com/8xwsLTA.png" width="400"/>

-<img src="https://i.imgur.com/lJUfTeD.png" width="400"/>
+## 九、Star History
+[![Stargazers over time](https://starchart.cc/usual2970/certimate.svg?variant=adaptive)](https://starchart.cc/usual2970/certimate)
--- a/README_EN.md
+++ b/README_EN.md
@@ -0,0 +1,160 @@
+[中文](README.md) | [English](README_EN.md)
+
+# 🔒Certimate
+
+For individuals managing personal projects or those responsible for IT operations in small businesses who need to manage multiple domain names, applying for certificates manually comes with several drawbacks:
+
+1. 😱Troublesome: Applying for and deploying certificates isn’t difficult, but it can be quite a hassle, especially when managing multiple domains.
+2. 😭Easily forgotten: The current free certificate has a validity period of only 90 days, requiring regular renewal operations. This increases the workload and makes it easy to forget, which can result in the website becoming inaccessible.
+
+Certimate was created to solve the above-mentioned issues and has the following features:
+
+1. Simple operation: Automatically apply, deploy, and renew SSL certificates without any manual intervention.
+2. Support for self-hosted deployment: The deployment method is simple; you only need to download the binary file and execute it. Both the binary files and Docker images are generated using GitHub Actions, ensuring a transparent process that can be audited independently.
+3. Data security: Since it is a self-hosted deployment, all data is stored locally and will not be saved on the service provider’s servers, ensuring the security of the data.
+
+Related articles:
+
+* [Why Certimate?](https://docs.certimate.me/blog/why-certimate)
+* [Introduction to Domain Variables and Deployment Authorization Groups](https://docs.certimate.me/blog/multi-deployer)
+
+Certimate aims to provide users with a secure and user-friendly SSL certificate management solution. For usage documentation, please visit.[https://docs.certimate.me](https://docs.certimate.me)
+
+## Installation
+
+Installing Certimate is very simple, you can choose one of the following methods for installation:
+
+### 1. Binary File
+
+You can download the precompiled binary files directly from the [Releases page](https://github.com/usual2970/certimate/releases), and after extracting them, execute:
+
+```bash
+./certimate serve
+```
+
+> [!NOTE]
+> When executing the binary file on macOS, you may see a prompt saying: “Cannot open ‘certimate’ because Apple cannot check it for malicious software.” You can go to System Preferences > Security & Privacy > General, then click “Allow Anyway,” and try executing the binary file again.
+
+### 2. Docker Installation
+
+```bash
+
+mkdir -p ~/.certimate && cd ~/.certimate && curl -O https://raw.githubusercontent.com/usual2970/certimate/refs/heads/main/docker/docker-compose.yml && docker compose up -d
+
+```
+
+### 3. Source Code Installation
+
+```bash
+git clone EMAIL:usual2970/certimate.git
+cd certimate
+go mod vendor
+go run main.go serve
+```
+
+## Usage
+
+After completing the installation steps above, you can access the Certimate management page by visiting http://127.0.0.1:8090 in your browser.
+
+```bash
+username：admin@certimate.fun
+password：1234567890
+```
+
+![usage.gif](https://i.imgur.com/zpCoLVM.gif)
+
+## List of Supported Providers
+
+| Provider      | Domain Registrar | Deployment Service | Remarks                                                                                           |
+| ------------- | ---------------- | ------------------ | ------------------------------------------------------------------------------------------------- |
+| Alibaba Cloud | Yes              | Yes                | Supports domains registered with Alibaba Cloud; supports deployment to Alibaba Cloud CDN and OSS. |
+| Tencent Cloud | Yes              | Yes                | Supports domains registered with Tencent Cloud; supports deployment to Tencent Cloud CDN.         |
+| Qiniu Cloud   | No               | Yes                | Qiniu Cloud does not offer domain registration services; supports deployment to Qiniu Cloud CDN.  |
+| Cloudflare    | Yes              | No                 | Supports domains registered with Cloudflare; Cloudflare services come with SSL certificates.      |
+| SSH           | No               | Yes                | Supports deployment to SSH servers.                                                               |
+| WEBHOOK       | No               | Yes                | Supports callbacks to WEBHOOK.                                                                    |
+
+## Screenshots
+
+![login](https://i.imgur.com/SYjjbql.jpeg)
+
+![dashboard](https://i.imgur.com/WMVbBId.jpeg)
+
+![domains](https://i.imgur.com/8wit3ZA.jpeg)
+
+![accesses](https://i.imgur.com/EWtOoJ0.jpeg)
+
+![history](https://i.imgur.com/aaPtSW7.jpeg)
+
+## Concepts
+
+The workflow of Certimate is as follows:
+
+* Users fill in the certificate application information on the Certimate management page, including domain name, authorization information for the DNS provider, and authorization information for the service provider to deploy to.
+* Certimate sends a request to the certificate vendor's API to apply for an SSL certificate.
+* Certimate stores the certificate information, including the certificate content, private key, validity period, etc., and automatically renews the certificate when it is about to expire.
+* Certimate sends a deployment request to the service provider's API to deploy the certificate to the service provider's servers.
+
+This involves authorization information for the domain, DNS provider, and deployment service provider.
+
+### 1. Domain
+
+It involves the domain name for which the certificate is being requested.
+
+### 2. Authorization Information for the DNS Provider
+
+To apply for a certificate for a domain, you need to prove that the domain belongs to you. Therefore, when manually applying for a certificate, you typically need to add a TXT record to the DNS records in the domain provider's control panel.
+
+Certimate will automatically add a TXT record for you; you only need to fill in the authorization information for your DNS provider in the Certimate backend.
+
+For example, if you purchased the domain from Alibaba Cloud, the authorization information would be as follows:
+
+```bash
+accessKeyId: xxx
+accessKeySecret: TOKEN
+```
+
+If you purchased the domain from Tencent Cloud, the authorization information would be as follows:
+
+```bash
+secretId: xxx
+secretKey: TOKEN
+```
+
+### 3. Authorization Information for the Deployment Service Provider
+
+After Certimate applies for the certificate, it will automatically deploy the certificate to your specified target, such as Alibaba Cloud CDN. At this point, you need to fill in the authorization information for Alibaba Cloud. Certimate will use the authorization information and domain name you provided to locate the corresponding CDN service and deploy the certificate to that service.
+
+The authorization information for the deployment service provider is the same as that for the DNS provider, with the distinction that the DNS provider's authorization information is used to prove that the domain belongs to you, while the deployment service provider's authorization information is used to provide authorization for the certificate deployment.
+
+## FAQ
+
+Q: Do you provide SaaS services?
+
+> A: No, we do not provide that. Currently, we only support self-hosted.
+
+Q: Data Security?
+
+> A: Since only self-hosted is supported, all data is stored on the user’s server. Additionally, the source code of Certimate is open-source, and the packaging process for binary files and Docker images is entirely done using GitHub Actions. This process is transparent and visible, allowing for independent auditing.
+
+Q: Automatic Certificate Renewal?
+
+> A: Certificates that have already been issued will be automatically renewed 10 days before expiration. The system checks once a day to see if any certificates are nearing expiration, and if so, it will automatically reapply for the certificate and deploy it to the target service.
+
+## Contributing
+
+Certimate is a free and open-source project, licensed under the [MIT License](LICENSE.md). You can use it for anything you want, even offering it as a paid service to users.
+
+You can support the development of Certimate in the following ways:
+
+* **Submit Code**: If you find a bug or have new feature requests, and you have relevant experience, [you can submit code to us](CONTRIBUTING_EN.md).
+* **Submit an Issue**: For feature suggestions or bugs, you can [submit an issue](https://github.com/usual2970/certimate/issues) to us.
+
+Support for more service providers, UI enhancements, bug fixes, and documentation improvements are all welcome. We encourage everyone to submit pull requests (PRs).
+
+## Join the Community
+
+* [Telegram-a new era of messaging](https://t.me/+ZXphsppxUg41YmVl)
+* Wechat Group
+
+<img src="https://i.imgur.com/zSHEoIm.png" width="400"/>
--- a/go.mod
+++ b/go.mod
@@ -20,7 +20,6 @@ require (
 	github.com/qiniu/go-sdk/v7 v7.22.0
 	github.com/tencentcloud/tencentcloud-sdk-go/tencentcloud/common v1.0.992
 	github.com/tencentcloud/tencentcloud-sdk-go/tencentcloud/ssl v1.0.992
-	github.com/tencentcloud/tencentcloud-sdk-go/tencentcloud/tag v1.0.992
 	golang.org/x/crypto v0.26.0
 )

--- a/go.sum
+++ b/go.sum
@@ -388,8 +388,6 @@ github.com/tencentcloud/tencentcloud-sdk-go/tencentcloud/dnspod v1.0.898 h1:LoYv
 github.com/tencentcloud/tencentcloud-sdk-go/tencentcloud/dnspod v1.0.898/go.mod h1:c1j6YQ+vCbeA8kJ59Im4UnMd1GxovlpPBDhGZoewfn8=
 github.com/tencentcloud/tencentcloud-sdk-go/tencentcloud/ssl v1.0.992 h1:A6O89OlCJQUpNxGqC/E5By04UNKBryIt5olQIGOx8mg=
 github.com/tencentcloud/tencentcloud-sdk-go/tencentcloud/ssl v1.0.992/go.mod h1:BcvC7ZPdSlhRggVq4J1ToJlgv8bmODIAuSo0naFZOLo=
-github.com/tencentcloud/tencentcloud-sdk-go/tencentcloud/tag v1.0.992 h1:ttCM2rrkGipHMFTavrPExKCWcfNjT7AMQ5ERrPExdI4=
-github.com/tencentcloud/tencentcloud-sdk-go/tencentcloud/tag v1.0.992/go.mod h1:WtzarrflM+eoyD8vcRuIPd8fT5UXD4IhUry6iSAUnxc=
 github.com/tjfoc/gmsm v1.3.2 h1:7JVkAn5bvUJ7HtU08iW6UiD+UTmJTIToHCfeFzkcCxM=
 github.com/tjfoc/gmsm v1.3.2/go.mod h1:HaUcFuY0auTiaHB9MHFGCPx5IaLhTUd2atbCFBQXn9w=
 github.com/uber/jaeger-client-go v2.30.0+incompatible h1:D6wyKGCecFaSRUpo8lCVbaOOb6ThwMmTEbhRwtKR97o=
--- a/internal/applicant/applicant.go
+++ b/internal/applicant/applicant.go
@@ -1,11 +1,13 @@
 package applicant

 import (
+	"certimate/internal/utils/app"
 	"crypto"
 	"crypto/ecdsa"
 	"crypto/elliptic"
 	"crypto/rand"
 	"errors"
+	"fmt"
 	"strings"

 	"github.com/go-acme/lego/v4/certcrypto"
@@ -25,6 +27,22 @@ const (
 	configTypeGodaddy    = "godaddy"
 )

+const defaultSSLProvider = "letsencrypt"
+const (
+	sslProviderLetsencrypt = "letsencrypt"
+	sslProviderZeroSSL     = "zerossl"
+)
+
+const (
+	zerosslUrl     = "https://acme.zerossl.com/v2/DV90"
+	letsencryptUrl = "https://acme-v02.api.letsencrypt.org/directory"
+)
+
+var sslProviderUrls = map[string]string{
+	sslProviderLetsencrypt: letsencryptUrl,
+	sslProviderZeroSSL:     zerosslUrl,
+}
+
 const defaultEmail = "536464346@qq.com"

 type Certificate struct {
@@ -92,7 +110,31 @@ func Get(record *models.Record) (Applicant, error) {

 }

+type SSLProviderConfig struct {
+	Config   SSLProviderConfigContent `json:"config"`
+	Provider string                   `json:"provider"`
+}
+
+type SSLProviderConfigContent struct {
+	Zerossl struct {
+		EabHmacKey string `json:"eabHmacKey"`
+		EabKid     string `json:"eabKid"`
+	}
+}
+
 func apply(option *ApplyOption, provider challenge.Provider) (*Certificate, error) {
+	record, _ := app.GetApp().Dao().FindFirstRecordByFilter("settings", "name='ssl-provider'")
+
+	sslProvider := &SSLProviderConfig{
+		Config:   SSLProviderConfigContent{},
+		Provider: defaultSSLProvider,
+	}
+	if record != nil {
+		if err := record.UnmarshalJSONField("content", sslProvider); err != nil {
+			return nil, err
+		}
+	}
+
 	privateKey, err := ecdsa.GenerateKey(elliptic.P256(), rand.Reader)
 	if err != nil {
 		return nil, err
@@ -106,7 +148,7 @@ func apply(option *ApplyOption, provider challenge.Provider) (*Certificate, erro
 	config := lego.NewConfig(&myUser)

 	// This CA URL is configured for a local dev instance of Boulder running in Docker in a VM.
-	config.CADirURL = "https://acme-v02.api.letsencrypt.org/directory"
+	config.CADirURL = sslProviderUrls[sslProvider.Provider]
 	config.Certificate.KeyType = certcrypto.RSA2048

 	// A client facilitates communication with the CA server.
@@ -124,19 +166,13 @@ func apply(option *ApplyOption, provider challenge.Provider) (*Certificate, erro
 	client.Challenge.SetDNS01Provider(provider, challengeOptions...)

 	// New users will need to register
-	reg, err := client.Registration.Register(registration.RegisterOptions{TermsOfServiceAgreed: true})
+	reg, err := getReg(client, sslProvider)
 	if err != nil {
-		return nil, err
+		return nil, fmt.Errorf("failed to register: %w", err)
 	}
 	myUser.Registration = reg

-	domains := []string{option.Domain}
-
-	// 如果是通配置符域名，把根域名也加入
-	if strings.HasPrefix(option.Domain, "*.") && len(strings.Split(option.Domain, ".")) == 3 {
-		rootDomain := strings.TrimPrefix(option.Domain, "*.")
-		domains = append(domains, rootDomain)
-	}
+	domains := strings.Split(option.Domain, ";")

 	request := certificate.ObtainRequest{
 		Domains: domains,
@@ -155,6 +191,33 @@ func apply(option *ApplyOption, provider challenge.Provider) (*Certificate, erro
 		IssuerCertificate: string(certificates.IssuerCertificate),
 		Csr:               string(certificates.CSR),
 	}, nil
+
+}
+
+func getReg(client *lego.Client, sslProvider *SSLProviderConfig) (*registration.Resource, error) {
+	var reg *registration.Resource
+	var err error
+	switch sslProvider.Provider {
+	case sslProviderZeroSSL:
+		reg, err = client.Registration.RegisterWithExternalAccountBinding(registration.RegisterEABOptions{
+			TermsOfServiceAgreed: true,
+			Kid:                  sslProvider.Config.Zerossl.EabKid,
+			HmacEncoded:          sslProvider.Config.Zerossl.EabHmacKey,
+		})
+
+	case sslProviderLetsencrypt:
+		reg, err = client.Registration.Register(registration.RegisterOptions{TermsOfServiceAgreed: true})
+
+	default:
+		err = errors.New("unknown ssl provider")
+
+	}
+
+	if err != nil {
+		return nil, err
+	}
+
+	return reg, nil
 }

 func ParseNameservers(ns string) []string {
--- a/internal/deployer/deployer.go
+++ b/internal/deployer/deployer.go
@@ -21,6 +21,7 @@ const (
 	targetWebhook    = "webhook"
 	targetTencentCdn = "tencent-cdn"
 	targetQiniuCdn   = "qiniu-cdn"
+	targetLocal      = "local"
 )

 type DeployerOption struct {
@@ -127,7 +128,10 @@ func getWithAccess(record *models.Record, cert *applicant.Certificate, access *m
 	case targetTencentCdn:
 		return NewTencentCdn(option)
 	case targetQiniuCdn:
+
 		return NewQiNiu(option)
+	case targetLocal:
+		return NewLocal(option), nil
 	}
 	return nil, errors.New("not implemented")
 }
--- a/internal/deployer/local.go
+++ b/internal/deployer/local.go
@@ -0,0 +1,106 @@
+package deployer
+
+import (
+	"context"
+	"encoding/json"
+	"fmt"
+	"os"
+	"os/exec"
+	"path/filepath"
+	"runtime"
+)
+
+type localAccess struct {
+	Command  string `json:"command"`
+	CertPath string `json:"certPath"`
+	KeyPath  string `json:"keyPath"`
+}
+
+type local struct {
+	option *DeployerOption
+	infos  []string
+}
+
+func NewLocal(option *DeployerOption) *local {
+	return &local{
+		option: option,
+		infos:  make([]string, 0),
+	}
+}
+
+func (l *local) GetID() string {
+	return fmt.Sprintf("%s-%s", l.option.AceessRecord.GetString("name"), l.option.AceessRecord.Id)
+}
+
+func (l *local) GetInfo() []string {
+	return []string{}
+}
+
+func (l *local) Deploy(ctx context.Context) error {
+	access := &localAccess{}
+	if err := json.Unmarshal([]byte(l.option.Access), access); err != nil {
+		return err
+	}
+	// 复制文件
+	if err := copyFile(l.option.Certificate.Certificate, access.CertPath); err != nil {
+		return fmt.Errorf("复制证书失败: %w", err)
+	}
+
+	if err := copyFile(l.option.Certificate.PrivateKey, access.KeyPath); err != nil {
+		return fmt.Errorf("复制私钥失败: %w", err)
+	}
+
+	// 执行命令
+
+	if err := execCmd(access.Command); err != nil {
+		return fmt.Errorf("执行命令失败: %w", err)
+	}
+
+	return nil
+}
+
+func execCmd(command string) error {
+	// 执行命令
+	var cmd *exec.Cmd
+
+	if runtime.GOOS == "windows" {
+		cmd = exec.Command("cmd", "/C", command)
+	} else {
+		cmd = exec.Command("sh", "-c", command)
+	}
+
+	cmd.Stdout = os.Stdout
+	cmd.Stderr = os.Stderr
+
+	err := cmd.Run()
+	if err != nil {
+		return fmt.Errorf("执行命令失败: %w", err)
+	}
+
+	return nil
+}
+
+func copyFile(content string, path string) error {
+	dir := filepath.Dir(path)
+
+	// 如果目录不存在，创建目录
+	err := os.MkdirAll(dir, os.ModePerm)
+	if err != nil {
+		return fmt.Errorf("创建目录失败: %w", err)
+	}
+
+	// 创建或打开文件
+	file, err := os.Create(path)
+	if err != nil {
+		return fmt.Errorf("创建文件失败: %w", err)
+	}
+	defer file.Close()
+
+	// 写入内容到文件
+	_, err = file.Write([]byte(content))
+	if err != nil {
+		return fmt.Errorf("写入文件失败: %w", err)
+	}
+
+	return nil
+}
--- a/internal/deployer/ssh.go
+++ b/internal/deployer/ssh.go
@@ -19,14 +19,15 @@ type ssh struct {
 }

 type sshAccess struct {
-	Host     string `json:"host"`
-	Username string `json:"username"`
-	Password string `json:"password"`
-	Key      string `json:"key"`
-	Port     string `json:"port"`
-	Command  string `json:"command"`
-	CertPath string `json:"certPath"`
-	KeyPath  string `json:"keyPath"`
+	Host       string `json:"host"`
+	Username   string `json:"username"`
+	Password   string `json:"password"`
+	Key        string `json:"key"`
+	Port       string `json:"port"`
+	PreCommand string `json:"preCommand"`
+	Command    string `json:"command"`
+	CertPath   string `json:"certPath"`
+	KeyPath    string `json:"keyPath"`
 }

 func NewSSH(option *DeployerOption) (Deployer, error) {
@@ -56,6 +57,7 @@ func (s *ssh) Deploy(ctx context.Context) error {
 		access.CertPath = strings.ReplaceAll(access.CertPath, key, v)
 		access.KeyPath = strings.ReplaceAll(access.KeyPath, key, v)
 		access.Command = strings.ReplaceAll(access.Command, key, v)
+		access.PreCommand = strings.ReplaceAll(access.PreCommand, key, v)
 	}

 	// 连接
@@ -67,14 +69,13 @@ func (s *ssh) Deploy(ctx context.Context) error {

 	s.infos = append(s.infos, toStr("ssh连接成功", nil))

-	// 上传
-	session, err := client.NewSession()
-	if err != nil {
-		return fmt.Errorf("failed to create session: %w", err)
+	// 执行前置命令
+	if access.PreCommand != "" {
+		err, stdout, stderr := s.sshExecCommand(client, access.PreCommand)
+		if err != nil {
+			return fmt.Errorf("failed to run pre-command: %w, stdout: %s, stderr: %s", err, stdout, stderr)
+		}
 	}
-	defer session.Close()
-
-	s.infos = append(s.infos, toStr("ssh创建session成功", nil))

 	// 上传证书
 	if err := s.upload(client, s.option.Certificate.Certificate, access.CertPath); err != nil {
@@ -91,18 +92,28 @@ func (s *ssh) Deploy(ctx context.Context) error {
 	s.infos = append(s.infos, toStr("ssh上传私钥成功", nil))

 	// 执行命令
+	err, stdout, stderr := s.sshExecCommand(client, access.Command)
+	if err != nil {
+		return fmt.Errorf("failed to run command: %w, stdout: %s, stderr: %s", err, stdout, stderr)
+	}
+
+	s.infos = append(s.infos, toStr("ssh执行命令成功", stdout))
+
+	return nil
+}
+
+func (s *ssh) sshExecCommand(client *sshPkg.Client, command string) (error, string, string) {
+	session, err := client.NewSession()
+	if err != nil {
+		return fmt.Errorf("failed to create ssh session: %w", err), "", ""
+	}
+	defer session.Close()
 	var stdoutBuf bytes.Buffer
 	session.Stdout = &stdoutBuf
 	var stderrBuf bytes.Buffer
 	session.Stderr = &stderrBuf
-
-	if err := session.Run(access.Command); err != nil {
-		return fmt.Errorf("failed to run command: %w, stdout: %s, stderr: %s", err, stdoutBuf.String(), stderrBuf.String())
-	}
-
-	s.infos = append(s.infos, toStr("ssh执行命令成功", []string{stdoutBuf.String()}))
-
-	return nil
+	err = session.Run(command)
+	return err, stdoutBuf.String(), stderrBuf.String()
 }

 func (s *ssh) upload(client *sshPkg.Client, content, path string) error {
--- a/internal/domain/access.go
+++ b/internal/domain/access.go
@@ -27,3 +27,4 @@ type GodaddyAccess struct {
 	ApiKey    string `json:"apiKey"`
 	ApiSecret string `json:"apiSecret"`
 }
+
--- a/internal/notify/notify.go
+++ b/internal/notify/notify.go
@@ -31,11 +31,12 @@ func Send(title, content string) error {
 		return nil
 	}

+	n := notifyPackage.New()
 	// 添加推送渠道
-	notifyPackage.UseServices(notifiers...)
+	n.UseServices(notifiers...)

 	// 发送消息
-	return notifyPackage.Send(context.Background(), title, content)
+	return n.Send(context.Background(), title, content)
 }

 func getNotifiers() ([]notifyPackage.Notifier, error) {
--- a/migrations/1727341442_collections_snapshot.go
+++ b/migrations/1727341442_collections_snapshot.go
@@ -0,0 +1,706 @@
+package migrations
+
+import (
+	"encoding/json"
+
+	"github.com/pocketbase/dbx"
+	"github.com/pocketbase/pocketbase/daos"
+	m "github.com/pocketbase/pocketbase/migrations"
+	"github.com/pocketbase/pocketbase/models"
+)
+
+func init() {
+	m.Register(func(db dbx.Builder) error {
+		jsonData := `[
+			{
+				"id": "z3p974ainxjqlvs",
+				"created": "2024-07-29 10:02:48.334Z",
+				"updated": "2024-09-26 08:20:28.305Z",
+				"name": "domains",
+				"type": "base",
+				"system": false,
+				"schema": [
+					{
+						"system": false,
+						"id": "iuaerpl2",
+						"name": "domain",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "ukkhuw85",
+						"name": "email",
+						"type": "email",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"exceptDomains": null,
+							"onlyDomains": null
+						}
+					},
+					{
+						"system": false,
+						"id": "v98eebqq",
+						"name": "crontab",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "alc8e9ow",
+						"name": "access",
+						"type": "relation",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"collectionId": "4yzbv8urny5ja1e",
+							"cascadeDelete": false,
+							"minSelect": null,
+							"maxSelect": 1,
+							"displayFields": null
+						}
+					},
+					{
+						"system": false,
+						"id": "topsc9bj",
+						"name": "certUrl",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "vixgq072",
+						"name": "certStableUrl",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "g3a3sza5",
+						"name": "privateKey",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "gr6iouny",
+						"name": "certificate",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "tk6vnrmn",
+						"name": "issuerCertificate",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "sjo6ibse",
+						"name": "csr",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "x03n1bkj",
+						"name": "expiredAt",
+						"type": "date",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": "",
+							"max": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "srybpixz",
+						"name": "targetType",
+						"type": "select",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"maxSelect": 1,
+							"values": [
+								"aliyun-oss",
+								"aliyun-cdn",
+								"aliyun-dcdn",
+								"ssh",
+								"webhook",
+								"tencent-cdn",
+								"qiniu-cdn",
+								"local"
+							]
+						}
+					},
+					{
+						"system": false,
+						"id": "xy7yk0mb",
+						"name": "targetAccess",
+						"type": "relation",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"collectionId": "4yzbv8urny5ja1e",
+							"cascadeDelete": false,
+							"minSelect": null,
+							"maxSelect": 1,
+							"displayFields": null
+						}
+					},
+					{
+						"system": false,
+						"id": "6jqeyggw",
+						"name": "enabled",
+						"type": "bool",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {}
+					},
+					{
+						"system": false,
+						"id": "hdsjcchf",
+						"name": "deployed",
+						"type": "bool",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {}
+					},
+					{
+						"system": false,
+						"id": "aiya3rev",
+						"name": "rightnow",
+						"type": "bool",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {}
+					},
+					{
+						"system": false,
+						"id": "ixznmhzc",
+						"name": "lastDeployedAt",
+						"type": "date",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": "",
+							"max": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "ghtlkn5j",
+						"name": "lastDeployment",
+						"type": "relation",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"collectionId": "0a1o4e6sstp694f",
+							"cascadeDelete": false,
+							"minSelect": null,
+							"maxSelect": 1,
+							"displayFields": null
+						}
+					},
+					{
+						"system": false,
+						"id": "zfnyj9he",
+						"name": "variables",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "1bspzuku",
+						"name": "group",
+						"type": "relation",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"collectionId": "teolp9pl72dxlxq",
+							"cascadeDelete": false,
+							"minSelect": null,
+							"maxSelect": 1,
+							"displayFields": null
+						}
+					},
+					{
+						"system": false,
+						"id": "g65gfh7a",
+						"name": "nameservers",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					}
+				],
+				"indexes": [
+					"CREATE UNIQUE INDEX ` + "`" + `idx_4ABO6EQ` + "`" + ` ON ` + "`" + `domains` + "`" + ` (` + "`" + `domain` + "`" + `)"
+				],
+				"listRule": null,
+				"viewRule": null,
+				"createRule": null,
+				"updateRule": null,
+				"deleteRule": null,
+				"options": {}
+			},
+			{
+				"id": "4yzbv8urny5ja1e",
+				"created": "2024-07-29 10:04:39.685Z",
+				"updated": "2024-09-26 08:36:59.632Z",
+				"name": "access",
+				"type": "base",
+				"system": false,
+				"schema": [
+					{
+						"system": false,
+						"id": "geeur58v",
+						"name": "name",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "iql7jpwx",
+						"name": "config",
+						"type": "json",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"maxSize": 2000000
+						}
+					},
+					{
+						"system": false,
+						"id": "hwy7m03o",
+						"name": "configType",
+						"type": "select",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"maxSelect": 1,
+							"values": [
+								"aliyun",
+								"tencent",
+								"ssh",
+								"webhook",
+								"cloudflare",
+								"qiniu",
+								"namesilo",
+								"godaddy",
+								"local"
+							]
+						}
+					},
+					{
+						"system": false,
+						"id": "lr33hiwg",
+						"name": "deleted",
+						"type": "date",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": "",
+							"max": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "hsxcnlvd",
+						"name": "usage",
+						"type": "select",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"maxSelect": 1,
+							"values": [
+								"apply",
+								"deploy",
+								"all"
+							]
+						}
+					},
+					{
+						"system": false,
+						"id": "c8egzzwj",
+						"name": "group",
+						"type": "relation",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"collectionId": "teolp9pl72dxlxq",
+							"cascadeDelete": false,
+							"minSelect": null,
+							"maxSelect": 1,
+							"displayFields": null
+						}
+					}
+				],
+				"indexes": [
+					"CREATE UNIQUE INDEX ` + "`" + `idx_wkoST0j` + "`" + ` ON ` + "`" + `access` + "`" + ` (` + "`" + `name` + "`" + `)"
+				],
+				"listRule": null,
+				"viewRule": null,
+				"createRule": null,
+				"updateRule": null,
+				"deleteRule": null,
+				"options": {}
+			},
+			{
+				"id": "0a1o4e6sstp694f",
+				"created": "2024-07-30 06:30:27.801Z",
+				"updated": "2024-09-24 14:44:48.041Z",
+				"name": "deployments",
+				"type": "base",
+				"system": false,
+				"schema": [
+					{
+						"system": false,
+						"id": "farvlzk7",
+						"name": "domain",
+						"type": "relation",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"collectionId": "z3p974ainxjqlvs",
+							"cascadeDelete": false,
+							"minSelect": null,
+							"maxSelect": 1,
+							"displayFields": null
+						}
+					},
+					{
+						"system": false,
+						"id": "jx5f69i3",
+						"name": "log",
+						"type": "json",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"maxSize": 2000000
+						}
+					},
+					{
+						"system": false,
+						"id": "qbxdtg9q",
+						"name": "phase",
+						"type": "select",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"maxSelect": 1,
+							"values": [
+								"check",
+								"apply",
+								"deploy"
+							]
+						}
+					},
+					{
+						"system": false,
+						"id": "rglrp1hz",
+						"name": "phaseSuccess",
+						"type": "bool",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {}
+					},
+					{
+						"system": false,
+						"id": "lt1g1blu",
+						"name": "deployedAt",
+						"type": "date",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": "",
+							"max": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "wledpzgb",
+						"name": "wholeSuccess",
+						"type": "bool",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {}
+					}
+				],
+				"indexes": [],
+				"listRule": null,
+				"viewRule": null,
+				"createRule": null,
+				"updateRule": null,
+				"deleteRule": null,
+				"options": {}
+			},
+			{
+				"id": "_pb_users_auth_",
+				"created": "2024-09-12 13:09:54.234Z",
+				"updated": "2024-09-24 14:44:48.041Z",
+				"name": "users",
+				"type": "auth",
+				"system": false,
+				"schema": [
+					{
+						"system": false,
+						"id": "users_name",
+						"name": "name",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "users_avatar",
+						"name": "avatar",
+						"type": "file",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"mimeTypes": [
+								"image/jpeg",
+								"image/png",
+								"image/svg+xml",
+								"image/gif",
+								"image/webp"
+							],
+							"thumbs": null,
+							"maxSelect": 1,
+							"maxSize": 5242880,
+							"protected": false
+						}
+					}
+				],
+				"indexes": [],
+				"listRule": "id = @request.auth.id",
+				"viewRule": "id = @request.auth.id",
+				"createRule": "",
+				"updateRule": "id = @request.auth.id",
+				"deleteRule": "id = @request.auth.id",
+				"options": {
+					"allowEmailAuth": true,
+					"allowOAuth2Auth": true,
+					"allowUsernameAuth": true,
+					"exceptEmailDomains": null,
+					"manageRule": null,
+					"minPasswordLength": 8,
+					"onlyEmailDomains": null,
+					"onlyVerified": false,
+					"requireEmail": false
+				}
+			},
+			{
+				"id": "dy6ccjb60spfy6p",
+				"created": "2024-09-12 23:12:21.677Z",
+				"updated": "2024-09-24 14:44:48.041Z",
+				"name": "settings",
+				"type": "base",
+				"system": false,
+				"schema": [
+					{
+						"system": false,
+						"id": "1tcmdsdf",
+						"name": "name",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "f9wyhypi",
+						"name": "content",
+						"type": "json",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"maxSize": 2000000
+						}
+					}
+				],
+				"indexes": [
+					"CREATE UNIQUE INDEX ` + "`" + `idx_RO7X9Vw` + "`" + ` ON ` + "`" + `settings` + "`" + ` (` + "`" + `name` + "`" + `)"
+				],
+				"listRule": null,
+				"viewRule": null,
+				"createRule": null,
+				"updateRule": null,
+				"deleteRule": null,
+				"options": {}
+			},
+			{
+				"id": "teolp9pl72dxlxq",
+				"created": "2024-09-13 12:51:05.611Z",
+				"updated": "2024-09-24 14:44:48.041Z",
+				"name": "access_groups",
+				"type": "base",
+				"system": false,
+				"schema": [
+					{
+						"system": false,
+						"id": "7sajiv6i",
+						"name": "name",
+						"type": "text",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"min": null,
+							"max": null,
+							"pattern": ""
+						}
+					},
+					{
+						"system": false,
+						"id": "xp8admif",
+						"name": "access",
+						"type": "relation",
+						"required": false,
+						"presentable": false,
+						"unique": false,
+						"options": {
+							"collectionId": "4yzbv8urny5ja1e",
+							"cascadeDelete": false,
+							"minSelect": null,
+							"maxSelect": null,
+							"displayFields": null
+						}
+					}
+				],
+				"indexes": [
+					"CREATE UNIQUE INDEX ` + "`" + `idx_RgRXp0R` + "`" + ` ON ` + "`" + `access_groups` + "`" + ` (` + "`" + `name` + "`" + `)"
+				],
+				"listRule": null,
+				"viewRule": null,
+				"createRule": null,
+				"updateRule": null,
+				"deleteRule": null,
+				"options": {}
+			}
+		]`
+
+		collections := []*models.Collection{}
+		if err := json.Unmarshal([]byte(jsonData), &collections); err != nil {
+			return err
+		}
+
+		return daos.New(db).ImportCollections(collections, true, nil)
+	}, func(db dbx.Builder) error {
+		return nil
+	})
+}
--- a/ui/dist/assets/index-8E76olt7.js
+++ b/ui/dist/assets/index-8E76olt7.js
--- a/ui/dist/assets/index-B-WSkv0U.js
+++ b/ui/dist/assets/index-B-WSkv0U.js
--- a/ui/dist/assets/index-BLt37AhW.css
+++ b/ui/dist/assets/index-BLt37AhW.css
--- a/ui/dist/assets/index-DOft-CKV.css
+++ b/ui/dist/assets/index-DOft-CKV.css
--- a/ui/dist/imgs/providers/letsencrypt.svg
+++ b/ui/dist/imgs/providers/letsencrypt.svg
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="96" height="96">
+<path d="M0 0 C3.96616708 2.87966696 6.94216973 6.71174376 8.75390625 11.2734375 C8.94921875 14.2890625 8.94921875 14.2890625 8.87890625 17.5234375 C8.86085937 18.60109375 8.8428125 19.67875 8.82421875 20.7890625 C8.80101562 21.60890625 8.7778125 22.42875 8.75390625 23.2734375 C9.86765625 23.2321875 10.98140625 23.1909375 12.12890625 23.1484375 C15.75390625 23.2734375 15.75390625 23.2734375 17.75390625 25.2734375 C17.94178314 28.33535881 18.00936994 31.30529877 17.984375 34.3671875 C17.98391678 35.2696521 17.98345856 36.1721167 17.98298645 37.10192871 C17.97996265 39.01181349 17.97207256 40.92169577 17.9597168 42.83154297 C17.94148066 45.76148172 17.93920695 48.69110422 17.93945312 51.62109375 C17.93453722 53.47396108 17.92870858 55.32682625 17.921875 57.1796875 C17.92076218 58.05991577 17.91964935 58.94014404 17.91850281 59.8470459 C17.86996885 66.04131231 17.86996885 66.04131231 16.75390625 68.2734375 C-1.72609375 68.2734375 -20.20609375 68.2734375 -39.24609375 68.2734375 C-40.95558713 64.85445075 -40.40930624 60.94182137 -40.4140625 57.1796875 C-40.4173909 56.2772229 -40.4207193 55.3747583 -40.42414856 54.44494629 C-40.42921569 52.53508006 -40.43155695 50.62520497 -40.43139648 48.71533203 C-40.43358486 45.78533449 -40.45174793 42.85571222 -40.47070312 39.92578125 C-40.47363664 38.07291796 -40.47562172 36.22005287 -40.4765625 34.3671875 C-40.48374802 33.48695923 -40.49093353 32.60673096 -40.49833679 31.6998291 C-40.47491923 25.50226298 -40.47491923 25.50226298 -38.24609375 23.2734375 C-34.62109375 23.1484375 -34.62109375 23.1484375 -31.24609375 23.2734375 C-31.30410156 22.5 -31.36210937 21.7265625 -31.421875 20.9296875 C-31.73940921 13.59918343 -31.17057807 8.85901698 -26.24609375 3.2734375 C-18.78730361 -3.81241313 -9.01893001 -5.1380571 0 0 Z M-19.24609375 15.2734375 C-19.24609375 17.9134375 -19.24609375 20.5534375 -19.24609375 23.2734375 C-13.96609375 23.2734375 -8.68609375 23.2734375 -3.24609375 23.2734375 C-2.47540396 15.74874343 -2.47540396 15.74874343 -5.37109375 12.2734375 C-8.09392313 10.10082379 -8.09392313 10.10082379 -11.24609375 9.6484375 C-15.38792256 10.5113185 -16.80835846 11.83192885 -19.24609375 15.2734375 Z M-11.24609375 39.2734375 C-11.24609375 44.5534375 -11.24609375 49.8334375 -11.24609375 55.2734375 C-10.58609375 54.9434375 -9.92609375 54.6134375 -9.24609375 54.2734375 C-8.89430178 51.9428157 -8.56279196 49.60908683 -8.24609375 47.2734375 C-7.18359375 44.8359375 -7.18359375 44.8359375 -6.24609375 43.2734375 C-7.60933118 41.2334656 -7.60933118 41.2334656 -9.24609375 39.2734375 C-9.90609375 39.2734375 -10.56609375 39.2734375 -11.24609375 39.2734375 Z " fill="#10376E" transform="translate(59.24609375,27.7265625)"/>
+<path d="M0 0 C1.12067871 0.01047363 2.24135742 0.02094727 3.39599609 0.03173828 C5.21357422 0.04140625 5.21357422 0.04140625 7.06787109 0.05126953 C8.33888672 0.06802734 9.60990234 0.08478516 10.91943359 0.10205078 C12.19818359 0.11107422 13.47693359 0.12009766 14.79443359 0.12939453 C17.96128526 0.15302775 21.12776783 0.18597449 24.29443359 0.22705078 C24.4024195 2.66573246 24.48169949 5.09964212 24.54443359 7.53955078 C24.59470703 8.57499023 24.59470703 8.57499023 24.64599609 9.63134766 C24.68505859 11.65283203 24.68505859 11.65283203 24.29443359 15.22705078 C22.27880859 17.20751953 22.27880859 17.20751953 20.29443359 18.22705078 C20.7362031 21.76120687 21.41676358 24.50596315 22.85693359 27.78955078 C24.29443359 32.22705078 24.29443359 32.22705078 24.29443359 45.22705078 C15.05443359 45.22705078 5.81443359 45.22705078 -3.70556641 45.22705078 C-5.41505978 41.80806403 -4.8687789 37.89543466 -4.87353516 34.13330078 C-4.87686356 33.23083618 -4.88019196 32.32837158 -4.88362122 31.39855957 C-4.88868835 29.48869334 -4.89102961 27.57881825 -4.89086914 25.66894531 C-4.89305752 22.73894777 -4.91122059 19.8093255 -4.93017578 16.87939453 C-4.9331093 15.02653124 -4.93509437 13.17366616 -4.93603516 11.32080078 C-4.94322067 10.44057251 -4.95040619 9.56034424 -4.95780945 8.65344238 C-4.92667455 0.41344589 -4.92667455 0.41344589 0 0 Z " fill="#0F3161" transform="translate(23.70556640625,50.77294921875)"/>
+<path d="M0 0 C3.95863415 2.87419762 6.96698604 6.71040909 8.75390625 11.2734375 C8.94921875 14.5078125 8.94921875 14.5078125 8.87890625 18.0234375 C8.86085937 19.19390625 8.8428125 20.364375 8.82421875 21.5703125 C8.80101562 22.46234375 8.7778125 23.354375 8.75390625 24.2734375 C4.79390625 24.2734375 0.83390625 24.2734375 -3.24609375 24.2734375 C-3.32859375 22.8709375 -3.41109375 21.4684375 -3.49609375 20.0234375 C-3.85974947 16.86013089 -4.14926646 15.42047154 -5.93359375 12.7109375 C-8.99476118 10.80804964 -10.701589 10.68268671 -14.24609375 11.2734375 C-16.74330199 12.6018971 -16.74330199 12.6018971 -18.24609375 15.2734375 C-18.86751236 18.3074225 -19.06322936 21.16474289 -19.24609375 24.2734375 C-23.20609375 24.2734375 -27.16609375 24.2734375 -31.24609375 24.2734375 C-32.16565531 10.86827339 -32.16565531 10.86827339 -27.671875 4.85546875 C-20.21832025 -3.41491392 -9.84160472 -5.60673239 0 0 Z " fill="#F3A006" transform="translate(59.24609375,27.7265625)"/>
+<path d="M0 0 C0 3.96 0 7.92 0 12 C-1.4540625 12.680625 -1.4540625 12.680625 -2.9375 13.375 C-6.07079582 14.65786221 -6.07079582 14.65786221 -7 17 C-7.22467831 18.53668865 -7.40796805 20.07968054 -7.5625 21.625 C-7.706875 23.06875 -7.85125 24.5125 -8 26 C-11.96 26 -15.92 26 -20 26 C-20.91789085 12.61919109 -20.91789085 12.61919109 -16.4375 6.5859375 C-11.06401953 0.65758677 -7.616909 -0.12285337 0 0 Z " fill="#D58C05" transform="translate(48,26)"/>
+<path d="M0 0 C0.75 1.6875 0.75 1.6875 1 4 C-1.81446105 8.64997913 -6.25914236 12.37140566 -11 15 C-14 14.875 -14 14.875 -16 14 C-16.80078125 11.796875 -16.80078125 11.796875 -17 9 C-14.98046875 6.578125 -14.98046875 6.578125 -12.1875 4.25 C-10.81658203 3.08210938 -10.81658203 3.08210938 -9.41796875 1.890625 C-5.71909434 -1.00154821 -4.50480579 -1.06692769 0 0 Z " fill="#DA9004" transform="translate(82,13)"/>
+<path d="M0 0 C5.0875582 0.44824301 7.6553513 1.85561989 11.4375 5.25 C12.32308594 6.01828125 13.20867188 6.7865625 14.12109375 7.578125 C16 10 16 10 15.78515625 12.796875 C15.52605469 13.52390625 15.26695313 14.2509375 15 15 C12.859375 15.76171875 12.859375 15.76171875 10 16 C7.140625 14.26953125 7.140625 14.26953125 4.25 11.8125 C3.28578125 11.01457031 2.3215625 10.21664063 1.328125 9.39453125 C-1.92423854 6.04939896 -1.92423854 6.04939896 -2 3 C-1.34 2.01 -0.68 1.02 0 0 Z " fill="#DA8F04" transform="translate(15,12)"/>
+<path d="M0 0 C3 0.125 3 0.125 4 1.125 C4.07325168 3.98767567 4.09238205 6.825719 4.0625 9.6875 C4.05798828 10.49380859 4.05347656 11.30011719 4.04882812 12.13085938 C4.03700518 14.12893756 4.01906914 16.12697783 4 18.125 C1.6875 19.25 1.6875 19.25 -1 20.125 C-1.99 19.465 -2.98 18.805 -4 18.125 C-4.24817926 15.19116664 -4.32643881 12.48867315 -4.25 9.5625 C-4.24484375 8.76908203 -4.2396875 7.97566406 -4.234375 7.15820312 C-4.13892499 0.17245521 -4.13892499 0.17245521 0 0 Z " fill="#F5A105" transform="translate(48,-0.125)"/>
+<path d="M0 0 C0.79792969 0.00386719 1.59585938 0.00773437 2.41796875 0.01171875 C3.21589844 0.00785156 4.01382813 0.00398438 4.8359375 0 C10.79136108 0.01011108 10.79136108 0.01011108 11.91796875 1.13671875 C11.95877658 3.13630239 11.96051231 5.13717129 11.91796875 7.13671875 C8.88367198 8.65386714 5.74195208 8.28035791 2.41796875 8.26171875 C1.72832031 8.26558594 1.03867188 8.26945312 0.328125 8.2734375 C-4.82869832 8.26338521 -4.82869832 8.26338521 -7.08203125 7.13671875 C-7.12457481 5.13717129 -7.12283908 3.13630239 -7.08203125 1.13671875 C-5.19650595 -0.74880655 -2.50434294 0.00425186 0 0 Z " fill="#DA9104" transform="translate(81.08203125,38.86328125)"/>
+<path d="M0 0 C0.79792969 0.00386719 1.59585937 0.00773437 2.41796875 0.01171875 C3.21589844 0.00785156 4.01382812 0.00398438 4.8359375 0 C10.79136108 0.01011108 10.79136108 0.01011108 11.91796875 1.13671875 C12.16796875 3.57421875 12.16796875 3.57421875 11.91796875 6.13671875 C8.21555593 8.60499397 6.25885765 8.37430901 1.85546875 8.32421875 C-0.01818359 8.31455078 -0.01818359 8.31455078 -1.9296875 8.3046875 C-5.08203125 8.13671875 -5.08203125 8.13671875 -7.08203125 7.13671875 C-7.12457481 5.13717129 -7.12283908 3.13630239 -7.08203125 1.13671875 C-5.19650595 -0.74880655 -2.50434294 0.00425186 0 0 Z " fill="#D98F04" transform="translate(10.08203125,38.86328125)"/>
+<path d="M0 0 C0.66 0.33 1.32 0.66 2 1 C0.62661079 5.37336228 -1.26467582 7.51333672 -4.8125 10.375 C-6.09060547 11.43847656 -6.09060547 11.43847656 -7.39453125 12.5234375 C-10 14 -10 14 -12.82421875 13.7265625 C-13.90123047 13.36691406 -13.90123047 13.36691406 -15 13 C-10.43369266 8.12927217 -5.25023461 4.10843602 0 0 Z " fill="#F4A005" transform="translate(81,14)"/>
+<path d="M0 0 C0.99 0 1.98 0 3 0 C3 6.6 3 13.2 3 20 C1.68 19.34 0.36 18.68 -1 18 C-1.02684312 15.18743719 -1.04676188 12.37512759 -1.0625 9.5625 C-1.07087891 8.76005859 -1.07925781 7.95761719 -1.08789062 7.13085938 C-1.0965143 5.08704779 -1.0522815 3.04316098 -1 1 C-0.67 0.67 -0.34 0.34 0 0 Z " fill="#D88E04" transform="translate(45,0)"/>
+<path d="M0 0 C5.23589631 0.4222497 7.61710401 1.95695114 11.375 5.5625 C12.24898437 6.38878906 13.12296875 7.21507812 14.0234375 8.06640625 C14.67570312 8.70449219 15.32796875 9.34257812 16 10 C15.67 11.32 15.34 12.64 15 14 C9.66666667 10 4.33333333 6 -1 2 C-0.67 1.34 -0.34 0.68 0 0 Z " fill="#F4A005" transform="translate(15,12)"/>
+<path d="M0 0 C5.61 0 11.22 0 17 0 C17.33 0.99 17.66 1.98 18 3 C11.73 3 5.46 3 -1 3 C-0.67 2.01 -0.34 1.02 0 0 Z " fill="#F4A005" transform="translate(75,39)"/>
+<path d="M0 0 C5.61 0 11.22 0 17 0 C17.33 0.99 17.66 1.98 18 3 C11.73 3 5.46 3 -1 3 C-0.67 2.01 -0.34 1.02 0 0 Z " fill="#F4A005" transform="translate(4,39)"/>
+<path d="M0 0 C0 5.61 0 11.22 0 17 C-2 16 -2 16 -3.0625 12.8125 C-3.371875 11.554375 -3.68125 10.29625 -4 9 C-4.268125 7.9275 -4.53625 6.855 -4.8125 5.75 C-5 3 -5 3 -3.6875 1.125 C-2 0 -2 0 0 0 Z " fill="#D6D7D9" transform="translate(48,66)"/>
+</svg>
--- a/ui/dist/imgs/providers/local.svg
+++ b/ui/dist/imgs/providers/local.svg
@@ -0,0 +1,10 @@
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="#29a34a" stroke="#29a34a">
+
+<g id="SVGRepo_bgCarrier" stroke-width="0"/>
+
+<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
+
+<g id="SVGRepo_iconCarrier">
--- a/ui/dist/imgs/providers/zerossl.svg
+++ b/ui/dist/imgs/providers/zerossl.svg
@@ -0,0 +1 @@
+<svg height="500" width="500" xmlns="http://www.w3.org/2000/svg"><path d="m0 0h500v500c-165 0-330 0-500 0 0-165 0-330 0-500z" fill="#4d70d5"/><path d="m0 0h86v85h85v85h85v86c-28.05 0-56.1 0-85 0v85c-28.05 0-56.1 0-85 0 0-28.05 0-56.1 0-85-28.05 0-56.1 0-85 0v85c-28.38 0-56.76 0-86 0 0-28.38 0-56.76 0-86h85c0-28.05 0-56.1 0-85-27.72 0-55.44 0-84 0 0-28.05 0-56.1 0-85h84c0-28.05 0-56.1 0-85z" fill="#fefefe" transform="translate(175 76)"/><path d="m0 0h1v84h85v1c-28.05 0-56.1 0-85 0v85c-28.38 0-56.76 0-86 0 0-28.38 0-56.76 0-86h85c0-27.72 0-55.44 0-84zm-84 85v84h84c0-27.72 0-55.44 0-84-27.72 0-55.44 0-84 0z" fill="#bcc9ef" transform="translate(175 247)"/></svg>
--- a/ui/dist/index.html
+++ b/ui/dist/index.html
@@ -5,8 +5,8 @@
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Certimate - Your Trusted SSL Automation Partner</title>
-    <script type="module" crossorigin src="/assets/index-B-WSkv0U.js"></script>
-    <link rel="stylesheet" crossorigin href="/assets/index-BLt37AhW.css">
+    <script type="module" crossorigin src="/assets/index-8E76olt7.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-DOft-CKV.css">
  </head>
  <body class="bg-background">
    <div id="root"></div>
--- a/ui/package-lock.json
+++ b/ui/package-lock.json
@@ -27,6 +27,9 @@
        "@radix-ui/react-tooltip": "^1.1.2",
        "class-variance-authority": "^0.7.0",
        "clsx": "^2.1.1",
+        "i18next": "^23.15.1",
+        "i18next-browser-languagedetector": "^8.0.0",
+        "i18next-http-backend": "^2.6.1",
        "jszip": "^3.10.1",
        "lucide-react": "^0.417.0",
        "moment": "^2.30.1",
@@ -34,6 +37,7 @@
        "react": "^18.3.1",
        "react-dom": "^18.3.1",
        "react-hook-form": "^7.52.1",
+        "react-i18next": "^15.0.2",
        "react-router-dom": "^6.25.1",
        "tailwind-merge": "^2.4.0",
        "tailwindcss-animate": "^1.0.7",
@@ -53,7 +57,7 @@
        "eslint-plugin-react-refresh": "^0.4.7",
        "postcss": "^8.4.40",
        "tailwindcss": "^3.4.7",
-        "typescript": "^5.2.2",
+        "typescript": "^5.6.2",
        "vite": "^5.3.4"
      }
    },
@@ -382,6 +386,17 @@
        "@babel/core": "^7.0.0-0"
      }
    },
+    "node_modules/@babel/runtime": {
+      "version": "7.25.6",
+      "resolved": "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.25.6.tgz",
+      "integrity": "sha512-VBj9MYyDb9tuLq7yzqjgzt6Q+IBQLrGZfdjOekyEirZPHxXWoTSGUTMrpsfi58Up73d13NfYLv8HT9vmznjzhQ==",
+      "dependencies": {
+        "regenerator-runtime": "^0.14.0"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
    "node_modules/@babel/template": {
      "version": "7.24.7",
      "resolved": "https://registry.npmmirror.com/@babel/template/-/template-7.24.7.tgz",
@@ -2100,9 +2115,9 @@
      }
    },
    "node_modules/@rollup/rollup-android-arm-eabi": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.19.0.tgz",
-      "integrity": "sha512-JlPfZ/C7yn5S5p0yKk7uhHTTnFlvTgLetl2VxqE518QgyM7C9bSfFTYvB/Q/ftkq0RIPY4ySxTz+/wKJ/dXC0w==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.22.4.tgz",
+      "integrity": "sha512-Fxamp4aEZnfPOcGA8KSNEohV8hX7zVHOemC8jVBoBUHu5zpJK/Eu3uJwt6BMgy9fkvzxDaurgj96F/NiLukF2w==",
      "cpu": [
        "arm"
      ],
@@ -2113,9 +2128,9 @@
      ]
    },
    "node_modules/@rollup/rollup-android-arm64": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.19.0.tgz",
-      "integrity": "sha512-RDxUSY8D1tWYfn00DDi5myxKgOk6RvWPxhmWexcICt/MEC6yEMr4HNCu1sXXYLw8iAsg0D44NuU+qNq7zVWCrw==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.22.4.tgz",
+      "integrity": "sha512-VXoK5UMrgECLYaMuGuVTOx5kcuap1Jm8g/M83RnCHBKOqvPPmROFJGQaZhGccnsFtfXQ3XYa4/jMCJvZnbJBdA==",
      "cpu": [
        "arm64"
      ],
@@ -2126,9 +2141,9 @@
      ]
    },
    "node_modules/@rollup/rollup-darwin-arm64": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.19.0.tgz",
-      "integrity": "sha512-emvKHL4B15x6nlNTBMtIaC9tLPRpeA5jMvRLXVbl/W9Ie7HhkrE7KQjvgS9uxgatL1HmHWDXk5TTS4IaNJxbAA==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.22.4.tgz",
+      "integrity": "sha512-xMM9ORBqu81jyMKCDP+SZDhnX2QEVQzTcC6G18KlTQEzWK8r/oNZtKuZaCcHhnsa6fEeOBionoyl5JsAbE/36Q==",
      "cpu": [
        "arm64"
      ],
@@ -2139,9 +2154,9 @@
      ]
    },
    "node_modules/@rollup/rollup-darwin-x64": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.19.0.tgz",
-      "integrity": "sha512-fO28cWA1dC57qCd+D0rfLC4VPbh6EOJXrreBmFLWPGI9dpMlER2YwSPZzSGfq11XgcEpPukPTfEVFtw2q2nYJg==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.22.4.tgz",
+      "integrity": "sha512-aJJyYKQwbHuhTUrjWjxEvGnNNBCnmpHDvrb8JFDbeSH3m2XdHcxDd3jthAzvmoI8w/kSjd2y0udT+4okADsZIw==",
      "cpu": [
        "x64"
      ],
@@ -2152,9 +2167,9 @@
      ]
    },
    "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.19.0.tgz",
-      "integrity": "sha512-2Rn36Ubxdv32NUcfm0wB1tgKqkQuft00PtM23VqLuCUR4N5jcNWDoV5iBC9jeGdgS38WK66ElncprqgMUOyomw==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.22.4.tgz",
+      "integrity": "sha512-j63YtCIRAzbO+gC2L9dWXRh5BFetsv0j0va0Wi9epXDgU/XUi5dJKo4USTttVyK7fGw2nPWK0PbAvyliz50SCQ==",
      "cpu": [
        "arm"
      ],
@@ -2165,9 +2180,9 @@
      ]
    },
    "node_modules/@rollup/rollup-linux-arm-musleabihf": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.19.0.tgz",
-      "integrity": "sha512-gJuzIVdq/X1ZA2bHeCGCISe0VWqCoNT8BvkQ+BfsixXwTOndhtLUpOg0A1Fcx/+eA6ei6rMBzlOz4JzmiDw7JQ==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.22.4.tgz",
+      "integrity": "sha512-dJnWUgwWBX1YBRsuKKMOlXCzh2Wu1mlHzv20TpqEsfdZLb3WoJW2kIEsGwLkroYf24IrPAvOT/ZQ2OYMV6vlrg==",
      "cpu": [
        "arm"
      ],
@@ -2178,9 +2193,9 @@
      ]
    },
    "node_modules/@rollup/rollup-linux-arm64-gnu": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.19.0.tgz",
-      "integrity": "sha512-0EkX2HYPkSADo9cfeGFoQ7R0/wTKb7q6DdwI4Yn/ULFE1wuRRCHybxpl2goQrx4c/yzK3I8OlgtBu4xvted0ug==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.22.4.tgz",
+      "integrity": "sha512-AdPRoNi3NKVLolCN/Sp4F4N1d98c4SBnHMKoLuiG6RXgoZ4sllseuGioszumnPGmPM2O7qaAX/IJdeDU8f26Aw==",
      "cpu": [
        "arm64"
      ],
@@ -2191,9 +2206,9 @@
      ]
    },
    "node_modules/@rollup/rollup-linux-arm64-musl": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.19.0.tgz",
-      "integrity": "sha512-GlIQRj9px52ISomIOEUq/IojLZqzkvRpdP3cLgIE1wUWaiU5Takwlzpz002q0Nxxr1y2ZgxC2obWxjr13lvxNQ==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.22.4.tgz",
+      "integrity": "sha512-Gl0AxBtDg8uoAn5CCqQDMqAx22Wx22pjDOjBdmG0VIWX3qUBHzYmOKh8KXHL4UpogfJ14G4wk16EQogF+v8hmA==",
      "cpu": [
        "arm64"
      ],
@@ -2204,9 +2219,9 @@
      ]
    },
    "node_modules/@rollup/rollup-linux-powerpc64le-gnu": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.19.0.tgz",
-      "integrity": "sha512-N6cFJzssruDLUOKfEKeovCKiHcdwVYOT1Hs6dovDQ61+Y9n3Ek4zXvtghPPelt6U0AH4aDGnDLb83uiJMkWYzQ==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.22.4.tgz",
+      "integrity": "sha512-3aVCK9xfWW1oGQpTsYJJPF6bfpWfhbRnhdlyhak2ZiyFLDaayz0EP5j9V1RVLAAxlmWKTDfS9wyRyY3hvhPoOg==",
      "cpu": [
        "ppc64"
      ],
@@ -2217,9 +2232,9 @@
      ]
    },
    "node_modules/@rollup/rollup-linux-riscv64-gnu": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.19.0.tgz",
-      "integrity": "sha512-2DnD3mkS2uuam/alF+I7M84koGwvn3ZVD7uG+LEWpyzo/bq8+kKnus2EVCkcvh6PlNB8QPNFOz6fWd5N8o1CYg==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.22.4.tgz",
+      "integrity": "sha512-ePYIir6VYnhgv2C5Xe9u+ico4t8sZWXschR6fMgoPUK31yQu7hTEJb7bCqivHECwIClJfKgE7zYsh1qTP3WHUA==",
      "cpu": [
        "riscv64"
      ],
@@ -2230,9 +2245,9 @@
      ]
    },
    "node_modules/@rollup/rollup-linux-s390x-gnu": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.19.0.tgz",
-      "integrity": "sha512-D6pkaF7OpE7lzlTOFCB2m3Ngzu2ykw40Nka9WmKGUOTS3xcIieHe82slQlNq69sVB04ch73thKYIWz/Ian8DUA==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.22.4.tgz",
+      "integrity": "sha512-GqFJ9wLlbB9daxhVlrTe61vJtEY99/xB3C8e4ULVsVfflcpmR6c8UZXjtkMA6FhNONhj2eA5Tk9uAVw5orEs4Q==",
      "cpu": [
        "s390x"
      ],
@@ -2243,9 +2258,9 @@
      ]
    },
    "node_modules/@rollup/rollup-linux-x64-gnu": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.19.0.tgz",
-      "integrity": "sha512-HBndjQLP8OsdJNSxpNIN0einbDmRFg9+UQeZV1eiYupIRuZsDEoeGU43NQsS34Pp166DtwQOnpcbV/zQxM+rWA==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.22.4.tgz",
+      "integrity": "sha512-87v0ol2sH9GE3cLQLNEy0K/R0pz1nvg76o8M5nhMR0+Q+BBGLnb35P0fVz4CQxHYXaAOhE8HhlkaZfsdUOlHwg==",
      "cpu": [
        "x64"
      ],
@@ -2256,9 +2271,9 @@
      ]
    },
    "node_modules/@rollup/rollup-linux-x64-musl": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.19.0.tgz",
-      "integrity": "sha512-HxfbvfCKJe/RMYJJn0a12eiOI9OOtAUF4G6ozrFUK95BNyoJaSiBjIOHjZskTUffUrB84IPKkFG9H9nEvJGW6A==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.22.4.tgz",
+      "integrity": "sha512-UV6FZMUgePDZrFjrNGIWzDo/vABebuXBhJEqrHxrGiU6HikPy0Z3LfdtciIttEUQfuDdCn8fqh7wiFJjCNwO+g==",
      "cpu": [
        "x64"
      ],
@@ -2269,9 +2284,9 @@
      ]
    },
    "node_modules/@rollup/rollup-win32-arm64-msvc": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.19.0.tgz",
-      "integrity": "sha512-HxDMKIhmcguGTiP5TsLNolwBUK3nGGUEoV/BO9ldUBoMLBssvh4J0X8pf11i1fTV7WShWItB1bKAKjX4RQeYmg==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.22.4.tgz",
+      "integrity": "sha512-BjI+NVVEGAXjGWYHz/vv0pBqfGoUH0IGZ0cICTn7kB9PyjrATSkX+8WkguNjWoj2qSr1im/+tTGRaY+4/PdcQw==",
      "cpu": [
        "arm64"
      ],
@@ -2282,9 +2297,9 @@
      ]
    },
    "node_modules/@rollup/rollup-win32-ia32-msvc": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.19.0.tgz",
-      "integrity": "sha512-xItlIAZZaiG/u0wooGzRsx11rokP4qyc/79LkAOdznGRAbOFc+SfEdfUOszG1odsHNgwippUJavag/+W/Etc6Q==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.22.4.tgz",
+      "integrity": "sha512-SiWG/1TuUdPvYmzmYnmd3IEifzR61Tragkbx9D3+R8mzQqDBz8v+BvZNDlkiTtI9T15KYZhP0ehn3Dld4n9J5g==",
      "cpu": [
        "ia32"
      ],
@@ -2295,9 +2310,9 @@
      ]
    },
    "node_modules/@rollup/rollup-win32-x64-msvc": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.19.0.tgz",
-      "integrity": "sha512-xNo5fV5ycvCCKqiZcpB65VMR11NJB+StnxHz20jdqRAktfdfzhgjTiJ2doTDQE/7dqGaV5I7ZGqKpgph6lCIag==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.22.4.tgz",
+      "integrity": "sha512-j8pPKp53/lq9lMXN57S8cFz0MynJk8OWNuUnXct/9KCpKU7DgU3bYMJhwWmcqC0UU29p8Lr0/7KEVcaM6bf47Q==",
      "cpu": [
        "x64"
      ],
@@ -2350,7 +2365,7 @@
    },
    "node_modules/@types/estree": {
      "version": "1.0.5",
-      "resolved": "https://registry.npmmirror.com/@types/estree/-/estree-1.0.5.tgz",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.5.tgz",
      "integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==",
      "dev": true
    },
@@ -2959,6 +2974,14 @@
      "resolved": "https://registry.npmmirror.com/core-util-is/-/core-util-is-1.0.3.tgz",
      "integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ=="
    },
+    "node_modules/cross-fetch": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmmirror.com/cross-fetch/-/cross-fetch-4.0.0.tgz",
+      "integrity": "sha512-e4a5N8lVvuLgAWgnCrLr2PP0YyDOTHa9H/Rj54dirp61qXnNq46m82bRhNqIA5VccJtWBvPTFRV3TtvHUKPB1g==",
+      "dependencies": {
+        "node-fetch": "^2.6.12"
+      }
+    },
    "node_modules/cross-spawn": {
      "version": "7.0.3",
      "resolved": "https://registry.npmmirror.com/cross-spawn/-/cross-spawn-7.0.3.tgz",
@@ -3697,6 +3720,52 @@
        "node": ">= 0.4"
      }
    },
+    "node_modules/html-parse-stringify": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmmirror.com/html-parse-stringify/-/html-parse-stringify-3.0.1.tgz",
+      "integrity": "sha512-KknJ50kTInJ7qIScF3jeaFRpMpE8/lfiTdzf/twXyPBLAGrLRTmkz3AdTnKeh40X8k9L2fdYwEp/42WGXIRGcg==",
+      "dependencies": {
+        "void-elements": "3.1.0"
+      }
+    },
+    "node_modules/i18next": {
+      "version": "23.15.1",
+      "resolved": "https://registry.npmmirror.com/i18next/-/i18next-23.15.1.tgz",
+      "integrity": "sha512-wB4abZ3uK7EWodYisHl/asf8UYEhrI/vj/8aoSsrj/ZDxj4/UXPOa1KvFt1Fq5hkUHquNqwFlDprmjZ8iySgYA==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://locize.com"
+        },
+        {
+          "type": "individual",
+          "url": "https://locize.com/i18next.html"
+        },
+        {
+          "type": "individual",
+          "url": "https://www.i18next.com/how-to/faq#i18next-is-awesome.-how-can-i-support-the-project"
+        }
+      ],
+      "dependencies": {
+        "@babel/runtime": "^7.23.2"
+      }
+    },
+    "node_modules/i18next-browser-languagedetector": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmmirror.com/i18next-browser-languagedetector/-/i18next-browser-languagedetector-8.0.0.tgz",
+      "integrity": "sha512-zhXdJXTTCoG39QsrOCiOabnWj2jecouOqbchu3EfhtSHxIB5Uugnm9JaizenOy39h7ne3+fLikIjeW88+rgszw==",
+      "dependencies": {
+        "@babel/runtime": "^7.23.2"
+      }
+    },
+    "node_modules/i18next-http-backend": {
+      "version": "2.6.1",
+      "resolved": "https://registry.npmmirror.com/i18next-http-backend/-/i18next-http-backend-2.6.1.tgz",
+      "integrity": "sha512-rCilMAnlEQNeKOZY1+x8wLM5IpYOj10guGvEpeC59tNjj6MMreLIjIW8D1RclhD3ifLwn6d/Y9HEM1RUE6DSog==",
+      "dependencies": {
+        "cross-fetch": "4.0.0"
+      }
+    },
    "node_modules/ignore": {
      "version": "5.3.1",
      "resolved": "https://registry.npmmirror.com/ignore/-/ignore-5.3.1.tgz",
@@ -4032,9 +4101,9 @@
      }
    },
    "node_modules/micromatch": {
-      "version": "4.0.7",
-      "resolved": "https://registry.npmmirror.com/micromatch/-/micromatch-4.0.7.tgz",
-      "integrity": "sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==",
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
+      "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
      "dependencies": {
        "braces": "^3.0.3",
        "picomatch": "^2.3.1"
@@ -4112,6 +4181,25 @@
      "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==",
      "dev": true
    },
+    "node_modules/node-fetch": {
+      "version": "2.7.0",
+      "resolved": "https://registry.npmmirror.com/node-fetch/-/node-fetch-2.7.0.tgz",
+      "integrity": "sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==",
+      "dependencies": {
+        "whatwg-url": "^5.0.0"
+      },
+      "engines": {
+        "node": "4.x || >=6.0.0"
+      },
+      "peerDependencies": {
+        "encoding": "^0.1.0"
+      },
+      "peerDependenciesMeta": {
+        "encoding": {
+          "optional": true
+        }
+      }
+    },
    "node_modules/node-releases": {
      "version": "2.0.18",
      "resolved": "https://registry.npmmirror.com/node-releases/-/node-releases-2.0.18.tgz",
@@ -4290,9 +4378,9 @@
      }
    },
    "node_modules/picocolors": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmmirror.com/picocolors/-/picocolors-1.0.1.tgz",
-      "integrity": "sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew=="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.0.tgz",
+      "integrity": "sha512-TQ92mBOW0l3LeMeyLV6mzy/kWr8lkd/hp3mTg7wYK7zJhuBStmGMBG0BdeDZS/dZx1IukaX6Bk11zcln25o1Aw=="
    },
    "node_modules/picomatch": {
      "version": "2.3.1",
@@ -4327,9 +4415,9 @@
      "integrity": "sha512-WJHyaqdAt95JgZ1OCRD099+DST4IIG0M/jMrCckWYDSN/6ocp61qsz7m6h0xI0J2N79ScBljceEC0fFAaQrrAw=="
    },
    "node_modules/postcss": {
-      "version": "8.4.40",
-      "resolved": "https://registry.npmmirror.com/postcss/-/postcss-8.4.40.tgz",
-      "integrity": "sha512-YF2kKIUzAofPMpfH6hOi2cGnv/HrUlfucspc7pDyvv7kGdqXrfj8SCl/t8owkEgKEuu8ZcRjSOxFxVLqwChZ2Q==",
+      "version": "8.4.47",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.47.tgz",
+      "integrity": "sha512-56rxCq7G/XfB4EkXq9Egn5GCqugWvDFjafDOThIdMBsI15iqPqR5r15TfSr1YPYeEI19YeaXMCbY6u88Y76GLQ==",
      "funding": [
        {
          "type": "opencollective",
@@ -4346,8 +4434,8 @@
      ],
      "dependencies": {
        "nanoid": "^3.3.7",
-        "picocolors": "^1.0.1",
-        "source-map-js": "^1.2.0"
+        "picocolors": "^1.1.0",
+        "source-map-js": "^1.2.1"
      },
      "engines": {
        "node": "^10 || ^12 || >=14"
@@ -4553,6 +4641,27 @@
        "react": "^16.8.0 || ^17 || ^18 || ^19"
      }
    },
+    "node_modules/react-i18next": {
+      "version": "15.0.2",
+      "resolved": "https://registry.npmmirror.com/react-i18next/-/react-i18next-15.0.2.tgz",
+      "integrity": "sha512-z0W3/RES9Idv3MmJUcf0mDNeeMOUXe+xoL0kPfQPbDoZHmni/XsIoq5zgT2MCFUiau283GuBUK578uD/mkAbLQ==",
+      "dependencies": {
+        "@babel/runtime": "^7.25.0",
+        "html-parse-stringify": "^3.0.1"
+      },
+      "peerDependencies": {
+        "i18next": ">= 23.2.3",
+        "react": ">= 16.8.0"
+      },
+      "peerDependenciesMeta": {
+        "react-dom": {
+          "optional": true
+        },
+        "react-native": {
+          "optional": true
+        }
+      }
+    },
    "node_modules/react-refresh": {
      "version": "0.14.2",
      "resolved": "https://registry.npmmirror.com/react-refresh/-/react-refresh-0.14.2.tgz",
@@ -4692,6 +4801,11 @@
        "node": ">=8.10.0"
      }
    },
+    "node_modules/regenerator-runtime": {
+      "version": "0.14.1",
+      "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
+      "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw=="
+    },
    "node_modules/resolve": {
      "version": "1.22.8",
      "resolved": "https://registry.npmmirror.com/resolve/-/resolve-1.22.8.tgz",
@@ -4743,9 +4857,9 @@
      }
    },
    "node_modules/rollup": {
-      "version": "4.19.0",
-      "resolved": "https://registry.npmmirror.com/rollup/-/rollup-4.19.0.tgz",
-      "integrity": "sha512-5r7EYSQIowHsK4eTZ0Y81qpZuJz+MUuYeqmmYmRMl1nwhdmbiYqt5jwzf6u7wyOzJgYqtCRMtVRKOtHANBz7rA==",
+      "version": "4.22.4",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.22.4.tgz",
+      "integrity": "sha512-vD8HJ5raRcWOyymsR6Z3o6+RzfEPCnVLMFJ6vRslO1jt4LO6dUo5Qnpg7y4RkZFM2DMe3WUirkI5c16onjrc6A==",
      "dev": true,
      "dependencies": {
        "@types/estree": "1.0.5"
@@ -4758,22 +4872,22 @@
        "npm": ">=8.0.0"
      },
      "optionalDependencies": {
-        "@rollup/rollup-android-arm-eabi": "4.19.0",
-        "@rollup/rollup-android-arm64": "4.19.0",
-        "@rollup/rollup-darwin-arm64": "4.19.0",
-        "@rollup/rollup-darwin-x64": "4.19.0",
-        "@rollup/rollup-linux-arm-gnueabihf": "4.19.0",
-        "@rollup/rollup-linux-arm-musleabihf": "4.19.0",
-        "@rollup/rollup-linux-arm64-gnu": "4.19.0",
-        "@rollup/rollup-linux-arm64-musl": "4.19.0",
-        "@rollup/rollup-linux-powerpc64le-gnu": "4.19.0",
-        "@rollup/rollup-linux-riscv64-gnu": "4.19.0",
-        "@rollup/rollup-linux-s390x-gnu": "4.19.0",
-        "@rollup/rollup-linux-x64-gnu": "4.19.0",
-        "@rollup/rollup-linux-x64-musl": "4.19.0",
-        "@rollup/rollup-win32-arm64-msvc": "4.19.0",
-        "@rollup/rollup-win32-ia32-msvc": "4.19.0",
-        "@rollup/rollup-win32-x64-msvc": "4.19.0",
+        "@rollup/rollup-android-arm-eabi": "4.22.4",
+        "@rollup/rollup-android-arm64": "4.22.4",
+        "@rollup/rollup-darwin-arm64": "4.22.4",
+        "@rollup/rollup-darwin-x64": "4.22.4",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.22.4",
+        "@rollup/rollup-linux-arm-musleabihf": "4.22.4",
+        "@rollup/rollup-linux-arm64-gnu": "4.22.4",
+        "@rollup/rollup-linux-arm64-musl": "4.22.4",
+        "@rollup/rollup-linux-powerpc64le-gnu": "4.22.4",
+        "@rollup/rollup-linux-riscv64-gnu": "4.22.4",
+        "@rollup/rollup-linux-s390x-gnu": "4.22.4",
+        "@rollup/rollup-linux-x64-gnu": "4.22.4",
+        "@rollup/rollup-linux-x64-musl": "4.22.4",
+        "@rollup/rollup-win32-arm64-msvc": "4.22.4",
+        "@rollup/rollup-win32-ia32-msvc": "4.22.4",
+        "@rollup/rollup-win32-x64-msvc": "4.22.4",
        "fsevents": "~2.3.2"
      }
    },
@@ -4869,9 +4983,9 @@
      }
    },
    "node_modules/source-map-js": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmmirror.com/source-map-js/-/source-map-js-1.2.0.tgz",
-      "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
+      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
      "engines": {
        "node": ">=0.10.0"
      }
@@ -5140,6 +5254,11 @@
        "node": ">=8.0"
      }
    },
+    "node_modules/tr46": {
+      "version": "0.0.3",
+      "resolved": "https://registry.npmmirror.com/tr46/-/tr46-0.0.3.tgz",
+      "integrity": "sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw=="
+    },
    "node_modules/ts-api-utils": {
      "version": "1.3.0",
      "resolved": "https://registry.npmmirror.com/ts-api-utils/-/ts-api-utils-1.3.0.tgz",
@@ -5187,9 +5306,9 @@
      }
    },
    "node_modules/typescript": {
-      "version": "5.5.4",
-      "resolved": "https://registry.npmmirror.com/typescript/-/typescript-5.5.4.tgz",
-      "integrity": "sha512-Mtq29sKDAEYP7aljRgtPOpTvOfbwRWlS6dPRzwjdE+C0R4brX/GUyhHSecbHMFLNBLcJIPt9nl9yG5TZ1weH+Q==",
+      "version": "5.6.2",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.6.2.tgz",
+      "integrity": "sha512-NW8ByodCSNCwZeghjN3o+JX5OFH0Ojg6sadjEKY4huZ52TqbJTJnDo5+Tw98lSy63NZvi4n+ez5m2u5d4PkZyw==",
      "dev": true,
      "bin": {
        "tsc": "bin/tsc",
@@ -5303,14 +5422,14 @@
      }
    },
    "node_modules/vite": {
-      "version": "5.3.5",
-      "resolved": "https://registry.npmmirror.com/vite/-/vite-5.3.5.tgz",
-      "integrity": "sha512-MdjglKR6AQXQb9JGiS7Rc2wC6uMjcm7Go/NHNO63EwiJXfuk9PgqiP/n5IDJCziMkfw9n4Ubp7lttNwz+8ZVKA==",
+      "version": "5.4.8",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.8.tgz",
+      "integrity": "sha512-FqrItQ4DT1NC4zCUqMB4c4AZORMKIa0m8/URVCZ77OZ/QSNeJ54bU1vrFADbDsuwfIPcgknRkmqakQcgnL4GiQ==",
      "dev": true,
      "dependencies": {
        "esbuild": "^0.21.3",
-        "postcss": "^8.4.39",
-        "rollup": "^4.13.0"
+        "postcss": "^8.4.43",
+        "rollup": "^4.20.0"
      },
      "bin": {
        "vite": "bin/vite.js"
@@ -5329,6 +5448,7 @@
        "less": "*",
        "lightningcss": "^1.21.0",
        "sass": "*",
+        "sass-embedded": "*",
        "stylus": "*",
        "sugarss": "*",
        "terser": "^5.4.0"
@@ -5346,6 +5466,9 @@
        "sass": {
          "optional": true
        },
+        "sass-embedded": {
+          "optional": true
+        },
        "stylus": {
          "optional": true
        },
@@ -5357,6 +5480,28 @@
        }
      }
    },
+    "node_modules/void-elements": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmmirror.com/void-elements/-/void-elements-3.1.0.tgz",
+      "integrity": "sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/webidl-conversions": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmmirror.com/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
+      "integrity": "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ=="
+    },
+    "node_modules/whatwg-url": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmmirror.com/whatwg-url/-/whatwg-url-5.0.0.tgz",
+      "integrity": "sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==",
+      "dependencies": {
+        "tr46": "~0.0.3",
+        "webidl-conversions": "^3.0.0"
+      }
+    },
    "node_modules/which": {
      "version": "2.0.2",
      "resolved": "https://registry.npmmirror.com/which/-/which-2.0.2.tgz",
--- a/ui/package.json
+++ b/ui/package.json
@@ -4,7 +4,7 @@
  "version": "0.0.0",
  "type": "module",
  "scripts": {
-    "dev": "vite",
+    "dev": "vite --host",
    "build": "tsc -b && vite build",
    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
    "preview": "vite preview"
@@ -40,7 +40,11 @@
    "tailwind-merge": "^2.4.0",
    "tailwindcss-animate": "^1.0.7",
    "vaul": "^0.9.1",
-    "zod": "^3.23.8"
+    "zod": "^3.23.8",
+    "i18next": "^23.15.1",
+    "i18next-browser-languagedetector": "^8.0.0",
+    "i18next-http-backend": "^2.6.1",
+    "react-i18next": "^15.0.2"
  },
  "devDependencies": {
    "@types/node": "^22.0.0",
@@ -55,7 +59,7 @@
    "eslint-plugin-react-refresh": "^0.4.7",
    "postcss": "^8.4.40",
    "tailwindcss": "^3.4.7",
-    "typescript": "^5.2.2",
+    "typescript": "^5.6.2",
    "vite": "^5.3.4"
  }
 }
--- a/ui/public/imgs/providers/letsencrypt.svg
+++ b/ui/public/imgs/providers/letsencrypt.svg
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="96" height="96">
+<path d="M0 0 C3.96616708 2.87966696 6.94216973 6.71174376 8.75390625 11.2734375 C8.94921875 14.2890625 8.94921875 14.2890625 8.87890625 17.5234375 C8.86085937 18.60109375 8.8428125 19.67875 8.82421875 20.7890625 C8.80101562 21.60890625 8.7778125 22.42875 8.75390625 23.2734375 C9.86765625 23.2321875 10.98140625 23.1909375 12.12890625 23.1484375 C15.75390625 23.2734375 15.75390625 23.2734375 17.75390625 25.2734375 C17.94178314 28.33535881 18.00936994 31.30529877 17.984375 34.3671875 C17.98391678 35.2696521 17.98345856 36.1721167 17.98298645 37.10192871 C17.97996265 39.01181349 17.97207256 40.92169577 17.9597168 42.83154297 C17.94148066 45.76148172 17.93920695 48.69110422 17.93945312 51.62109375 C17.93453722 53.47396108 17.92870858 55.32682625 17.921875 57.1796875 C17.92076218 58.05991577 17.91964935 58.94014404 17.91850281 59.8470459 C17.86996885 66.04131231 17.86996885 66.04131231 16.75390625 68.2734375 C-1.72609375 68.2734375 -20.20609375 68.2734375 -39.24609375 68.2734375 C-40.95558713 64.85445075 -40.40930624 60.94182137 -40.4140625 57.1796875 C-40.4173909 56.2772229 -40.4207193 55.3747583 -40.42414856 54.44494629 C-40.42921569 52.53508006 -40.43155695 50.62520497 -40.43139648 48.71533203 C-40.43358486 45.78533449 -40.45174793 42.85571222 -40.47070312 39.92578125 C-40.47363664 38.07291796 -40.47562172 36.22005287 -40.4765625 34.3671875 C-40.48374802 33.48695923 -40.49093353 32.60673096 -40.49833679 31.6998291 C-40.47491923 25.50226298 -40.47491923 25.50226298 -38.24609375 23.2734375 C-34.62109375 23.1484375 -34.62109375 23.1484375 -31.24609375 23.2734375 C-31.30410156 22.5 -31.36210937 21.7265625 -31.421875 20.9296875 C-31.73940921 13.59918343 -31.17057807 8.85901698 -26.24609375 3.2734375 C-18.78730361 -3.81241313 -9.01893001 -5.1380571 0 0 Z M-19.24609375 15.2734375 C-19.24609375 17.9134375 -19.24609375 20.5534375 -19.24609375 23.2734375 C-13.96609375 23.2734375 -8.68609375 23.2734375 -3.24609375 23.2734375 C-2.47540396 15.74874343 -2.47540396 15.74874343 -5.37109375 12.2734375 C-8.09392313 10.10082379 -8.09392313 10.10082379 -11.24609375 9.6484375 C-15.38792256 10.5113185 -16.80835846 11.83192885 -19.24609375 15.2734375 Z M-11.24609375 39.2734375 C-11.24609375 44.5534375 -11.24609375 49.8334375 -11.24609375 55.2734375 C-10.58609375 54.9434375 -9.92609375 54.6134375 -9.24609375 54.2734375 C-8.89430178 51.9428157 -8.56279196 49.60908683 -8.24609375 47.2734375 C-7.18359375 44.8359375 -7.18359375 44.8359375 -6.24609375 43.2734375 C-7.60933118 41.2334656 -7.60933118 41.2334656 -9.24609375 39.2734375 C-9.90609375 39.2734375 -10.56609375 39.2734375 -11.24609375 39.2734375 Z " fill="#10376E" transform="translate(59.24609375,27.7265625)"/>
+<path d="M0 0 C1.12067871 0.01047363 2.24135742 0.02094727 3.39599609 0.03173828 C5.21357422 0.04140625 5.21357422 0.04140625 7.06787109 0.05126953 C8.33888672 0.06802734 9.60990234 0.08478516 10.91943359 0.10205078 C12.19818359 0.11107422 13.47693359 0.12009766 14.79443359 0.12939453 C17.96128526 0.15302775 21.12776783 0.18597449 24.29443359 0.22705078 C24.4024195 2.66573246 24.48169949 5.09964212 24.54443359 7.53955078 C24.59470703 8.57499023 24.59470703 8.57499023 24.64599609 9.63134766 C24.68505859 11.65283203 24.68505859 11.65283203 24.29443359 15.22705078 C22.27880859 17.20751953 22.27880859 17.20751953 20.29443359 18.22705078 C20.7362031 21.76120687 21.41676358 24.50596315 22.85693359 27.78955078 C24.29443359 32.22705078 24.29443359 32.22705078 24.29443359 45.22705078 C15.05443359 45.22705078 5.81443359 45.22705078 -3.70556641 45.22705078 C-5.41505978 41.80806403 -4.8687789 37.89543466 -4.87353516 34.13330078 C-4.87686356 33.23083618 -4.88019196 32.32837158 -4.88362122 31.39855957 C-4.88868835 29.48869334 -4.89102961 27.57881825 -4.89086914 25.66894531 C-4.89305752 22.73894777 -4.91122059 19.8093255 -4.93017578 16.87939453 C-4.9331093 15.02653124 -4.93509437 13.17366616 -4.93603516 11.32080078 C-4.94322067 10.44057251 -4.95040619 9.56034424 -4.95780945 8.65344238 C-4.92667455 0.41344589 -4.92667455 0.41344589 0 0 Z " fill="#0F3161" transform="translate(23.70556640625,50.77294921875)"/>
+<path d="M0 0 C3.95863415 2.87419762 6.96698604 6.71040909 8.75390625 11.2734375 C8.94921875 14.5078125 8.94921875 14.5078125 8.87890625 18.0234375 C8.86085937 19.19390625 8.8428125 20.364375 8.82421875 21.5703125 C8.80101562 22.46234375 8.7778125 23.354375 8.75390625 24.2734375 C4.79390625 24.2734375 0.83390625 24.2734375 -3.24609375 24.2734375 C-3.32859375 22.8709375 -3.41109375 21.4684375 -3.49609375 20.0234375 C-3.85974947 16.86013089 -4.14926646 15.42047154 -5.93359375 12.7109375 C-8.99476118 10.80804964 -10.701589 10.68268671 -14.24609375 11.2734375 C-16.74330199 12.6018971 -16.74330199 12.6018971 -18.24609375 15.2734375 C-18.86751236 18.3074225 -19.06322936 21.16474289 -19.24609375 24.2734375 C-23.20609375 24.2734375 -27.16609375 24.2734375 -31.24609375 24.2734375 C-32.16565531 10.86827339 -32.16565531 10.86827339 -27.671875 4.85546875 C-20.21832025 -3.41491392 -9.84160472 -5.60673239 0 0 Z " fill="#F3A006" transform="translate(59.24609375,27.7265625)"/>
+<path d="M0 0 C0 3.96 0 7.92 0 12 C-1.4540625 12.680625 -1.4540625 12.680625 -2.9375 13.375 C-6.07079582 14.65786221 -6.07079582 14.65786221 -7 17 C-7.22467831 18.53668865 -7.40796805 20.07968054 -7.5625 21.625 C-7.706875 23.06875 -7.85125 24.5125 -8 26 C-11.96 26 -15.92 26 -20 26 C-20.91789085 12.61919109 -20.91789085 12.61919109 -16.4375 6.5859375 C-11.06401953 0.65758677 -7.616909 -0.12285337 0 0 Z " fill="#D58C05" transform="translate(48,26)"/>
+<path d="M0 0 C0.75 1.6875 0.75 1.6875 1 4 C-1.81446105 8.64997913 -6.25914236 12.37140566 -11 15 C-14 14.875 -14 14.875 -16 14 C-16.80078125 11.796875 -16.80078125 11.796875 -17 9 C-14.98046875 6.578125 -14.98046875 6.578125 -12.1875 4.25 C-10.81658203 3.08210938 -10.81658203 3.08210938 -9.41796875 1.890625 C-5.71909434 -1.00154821 -4.50480579 -1.06692769 0 0 Z " fill="#DA9004" transform="translate(82,13)"/>
+<path d="M0 0 C5.0875582 0.44824301 7.6553513 1.85561989 11.4375 5.25 C12.32308594 6.01828125 13.20867188 6.7865625 14.12109375 7.578125 C16 10 16 10 15.78515625 12.796875 C15.52605469 13.52390625 15.26695313 14.2509375 15 15 C12.859375 15.76171875 12.859375 15.76171875 10 16 C7.140625 14.26953125 7.140625 14.26953125 4.25 11.8125 C3.28578125 11.01457031 2.3215625 10.21664063 1.328125 9.39453125 C-1.92423854 6.04939896 -1.92423854 6.04939896 -2 3 C-1.34 2.01 -0.68 1.02 0 0 Z " fill="#DA8F04" transform="translate(15,12)"/>
+<path d="M0 0 C3 0.125 3 0.125 4 1.125 C4.07325168 3.98767567 4.09238205 6.825719 4.0625 9.6875 C4.05798828 10.49380859 4.05347656 11.30011719 4.04882812 12.13085938 C4.03700518 14.12893756 4.01906914 16.12697783 4 18.125 C1.6875 19.25 1.6875 19.25 -1 20.125 C-1.99 19.465 -2.98 18.805 -4 18.125 C-4.24817926 15.19116664 -4.32643881 12.48867315 -4.25 9.5625 C-4.24484375 8.76908203 -4.2396875 7.97566406 -4.234375 7.15820312 C-4.13892499 0.17245521 -4.13892499 0.17245521 0 0 Z " fill="#F5A105" transform="translate(48,-0.125)"/>
+<path d="M0 0 C0.79792969 0.00386719 1.59585938 0.00773437 2.41796875 0.01171875 C3.21589844 0.00785156 4.01382813 0.00398438 4.8359375 0 C10.79136108 0.01011108 10.79136108 0.01011108 11.91796875 1.13671875 C11.95877658 3.13630239 11.96051231 5.13717129 11.91796875 7.13671875 C8.88367198 8.65386714 5.74195208 8.28035791 2.41796875 8.26171875 C1.72832031 8.26558594 1.03867188 8.26945312 0.328125 8.2734375 C-4.82869832 8.26338521 -4.82869832 8.26338521 -7.08203125 7.13671875 C-7.12457481 5.13717129 -7.12283908 3.13630239 -7.08203125 1.13671875 C-5.19650595 -0.74880655 -2.50434294 0.00425186 0 0 Z " fill="#DA9104" transform="translate(81.08203125,38.86328125)"/>
+<path d="M0 0 C0.79792969 0.00386719 1.59585937 0.00773437 2.41796875 0.01171875 C3.21589844 0.00785156 4.01382812 0.00398438 4.8359375 0 C10.79136108 0.01011108 10.79136108 0.01011108 11.91796875 1.13671875 C12.16796875 3.57421875 12.16796875 3.57421875 11.91796875 6.13671875 C8.21555593 8.60499397 6.25885765 8.37430901 1.85546875 8.32421875 C-0.01818359 8.31455078 -0.01818359 8.31455078 -1.9296875 8.3046875 C-5.08203125 8.13671875 -5.08203125 8.13671875 -7.08203125 7.13671875 C-7.12457481 5.13717129 -7.12283908 3.13630239 -7.08203125 1.13671875 C-5.19650595 -0.74880655 -2.50434294 0.00425186 0 0 Z " fill="#D98F04" transform="translate(10.08203125,38.86328125)"/>
+<path d="M0 0 C0.66 0.33 1.32 0.66 2 1 C0.62661079 5.37336228 -1.26467582 7.51333672 -4.8125 10.375 C-6.09060547 11.43847656 -6.09060547 11.43847656 -7.39453125 12.5234375 C-10 14 -10 14 -12.82421875 13.7265625 C-13.90123047 13.36691406 -13.90123047 13.36691406 -15 13 C-10.43369266 8.12927217 -5.25023461 4.10843602 0 0 Z " fill="#F4A005" transform="translate(81,14)"/>
+<path d="M0 0 C0.99 0 1.98 0 3 0 C3 6.6 3 13.2 3 20 C1.68 19.34 0.36 18.68 -1 18 C-1.02684312 15.18743719 -1.04676188 12.37512759 -1.0625 9.5625 C-1.07087891 8.76005859 -1.07925781 7.95761719 -1.08789062 7.13085938 C-1.0965143 5.08704779 -1.0522815 3.04316098 -1 1 C-0.67 0.67 -0.34 0.34 0 0 Z " fill="#D88E04" transform="translate(45,0)"/>
+<path d="M0 0 C5.23589631 0.4222497 7.61710401 1.95695114 11.375 5.5625 C12.24898437 6.38878906 13.12296875 7.21507812 14.0234375 8.06640625 C14.67570312 8.70449219 15.32796875 9.34257812 16 10 C15.67 11.32 15.34 12.64 15 14 C9.66666667 10 4.33333333 6 -1 2 C-0.67 1.34 -0.34 0.68 0 0 Z " fill="#F4A005" transform="translate(15,12)"/>
+<path d="M0 0 C5.61 0 11.22 0 17 0 C17.33 0.99 17.66 1.98 18 3 C11.73 3 5.46 3 -1 3 C-0.67 2.01 -0.34 1.02 0 0 Z " fill="#F4A005" transform="translate(75,39)"/>
+<path d="M0 0 C5.61 0 11.22 0 17 0 C17.33 0.99 17.66 1.98 18 3 C11.73 3 5.46 3 -1 3 C-0.67 2.01 -0.34 1.02 0 0 Z " fill="#F4A005" transform="translate(4,39)"/>
+<path d="M0 0 C0 5.61 0 11.22 0 17 C-2 16 -2 16 -3.0625 12.8125 C-3.371875 11.554375 -3.68125 10.29625 -4 9 C-4.268125 7.9275 -4.53625 6.855 -4.8125 5.75 C-5 3 -5 3 -3.6875 1.125 C-2 0 -2 0 0 0 Z " fill="#D6D7D9" transform="translate(48,66)"/>
+</svg>
--- a/ui/public/imgs/providers/local.svg
+++ b/ui/public/imgs/providers/local.svg
@@ -0,0 +1,10 @@
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="#29a34a" stroke="#29a34a">
+
+<g id="SVGRepo_bgCarrier" stroke-width="0"/>
+
+<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
+
+<g id="SVGRepo_iconCarrier">
--- a/ui/public/imgs/providers/zerossl.svg
+++ b/ui/public/imgs/providers/zerossl.svg
@@ -0,0 +1 @@
+<svg height="500" width="500" xmlns="http://www.w3.org/2000/svg"><path d="m0 0h500v500c-165 0-330 0-500 0 0-165 0-330 0-500z" fill="#4d70d5"/><path d="m0 0h86v85h85v85h85v86c-28.05 0-56.1 0-85 0v85c-28.05 0-56.1 0-85 0 0-28.05 0-56.1 0-85-28.05 0-56.1 0-85 0v85c-28.38 0-56.76 0-86 0 0-28.38 0-56.76 0-86h85c0-28.05 0-56.1 0-85-27.72 0-55.44 0-84 0 0-28.05 0-56.1 0-85h84c0-28.05 0-56.1 0-85z" fill="#fefefe" transform="translate(175 76)"/><path d="m0 0h1v84h85v1c-28.05 0-56.1 0-85 0v85c-28.38 0-56.76 0-86 0 0-28.38 0-56.76 0-86h85c0-27.72 0-55.44 0-84zm-84 85v84h84c0-27.72 0-55.44 0-84-27.72 0-55.44 0-84 0z" fill="#bcc9ef" transform="translate(175 247)"/></svg>
--- a/ui/src/components/LocaleToggle.tsx
+++ b/ui/src/components/LocaleToggle.tsx
@@ -0,0 +1,33 @@
+import { Languages } from "lucide-react";
+
+import { useTranslation } from "react-i18next";
+
+import { Button } from "@/components/ui/button";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+
+export default function LocaleToggle() {
+  const { i18n } = useTranslation()
+
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Button variant="outline" size="icon">
+          <Languages className="h-[1.2rem] w-[1.2rem]  dark:text-white" />
+          <span className="sr-only">Toggle theme</span>
+        </Button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent align="end">
+        {Object.keys(i18n.store.data).map(key => (
+          <DropdownMenuItem onClick={() => i18n.changeLanguage(key)}>
+            {i18n.store.data[key].name as string}
+          </DropdownMenuItem>
+        ))}
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+}
--- a/ui/src/components/ThemeToggle.tsx
+++ b/ui/src/components/ThemeToggle.tsx
@@ -1,4 +1,5 @@
 import { Moon, Sun } from "lucide-react";
+import { useTranslation } from 'react-i18next'

 import { Button } from "@/components/ui/button";
 import {
@@ -11,6 +12,8 @@ import { useTheme } from "./ThemeProvider";

 export function ThemeToggle() {
  const { setTheme } = useTheme();
+  const { t } = useTranslation();
+

  return (
    <DropdownMenu>
@@ -23,13 +26,13 @@ export function ThemeToggle() {
      </DropdownMenuTrigger>
      <DropdownMenuContent align="end">
        <DropdownMenuItem onClick={() => setTheme("light")}>
-          浅色
+          {t('theme.light')}
        </DropdownMenuItem>
        <DropdownMenuItem onClick={() => setTheme("dark")}>
-          暗黑
+          {t('theme.dark')}
        </DropdownMenuItem>
        <DropdownMenuItem onClick={() => setTheme("system")}>
-          系统
+          {t('theme.system')}
        </DropdownMenuItem>
      </DropdownMenuContent>
    </DropdownMenu>
--- a/ui/src/components/certimate/AccessAliyunForm.tsx
+++ b/ui/src/components/certimate/AccessAliyunForm.tsx
@@ -1,5 +1,6 @@
 import { Input } from "@/components/ui/input";
 import { useForm } from "react-hook-form";
+import { useTranslation } from "react-i18next";

 import { zodResolver } from "@hookform/resolvers/zod";

@@ -23,18 +24,21 @@ import { PbErrorData } from "@/domain/base";

 const AccessAliyunForm = ({
  data,
+  op,
  onAfterReq,
 }: {
  data?: Access;
+  op: "add" | "edit" | "copy";
  onAfterReq: () => void;
 }) => {
  const { addAccess, updateAccess } = useConfig();
+  const { t } = useTranslation();
  const formSchema = z.object({
    id: z.string().optional(),
-    name: z.string().min(1).max(64),
+    name: z.string().min(1, 'access.form.name.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
    configType: accessFormType,
-    accessKeyId: z.string().min(1).max(64),
-    accessSecretId: z.string().min(1).max(64),
+    accessKeyId: z.string().min(1, 'access.form.access.key.id.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
+    accessSecretId: z.string().min(1, 'access.form.access.key.secret.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
  });

  let config: AliyunConfig = {
@@ -47,7 +51,7 @@ const AccessAliyunForm = ({
    resolver: zodResolver(formSchema),
    defaultValues: {
      id: data?.id,
-      name: data?.name,
+      name: data?.name || '',
      configType: "aliyun",
      accessKeyId: config.accessKeyId,
      accessSecretId: config.accessKeySecret,
@@ -67,6 +71,7 @@ const AccessAliyunForm = ({
    };

    try {
+      req.id =  op == "copy" ? "" : req.id;
      const rs = await save(req);

      onAfterReq();
@@ -74,10 +79,11 @@ const AccessAliyunForm = ({
      req.id = rs.id;
      req.created = rs.created;
      req.updated = rs.updated;
-      if (data.id) {
+      if (data.id && op == "edit") {
        updateAccess(req);
        return;
      }
+      console.log(req);
      addAccess(req);
    } catch (e) {
      const err = e as ClientResponseError;
@@ -111,9 +117,9 @@ const AccessAliyunForm = ({
              name="name"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>名称</FormLabel>
+                  <FormLabel>{t('name')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入授权名称" {...field} />
+                    <Input placeholder={t('access.form.name.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -126,7 +132,7 @@ const AccessAliyunForm = ({
              name="id"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -141,7 +147,7 @@ const AccessAliyunForm = ({
              name="configType"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -156,9 +162,9 @@ const AccessAliyunForm = ({
              name="accessKeyId"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>AccessKeyId</FormLabel>
+                  <FormLabel>{t('access.form.access.key.id')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入AccessKeyId" {...field} />
+                    <Input placeholder={t('access.form.access.key.id.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -171,9 +177,9 @@ const AccessAliyunForm = ({
              name="accessSecretId"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>AccessKeySecret</FormLabel>
+                  <FormLabel>{t('access.form.access.key.secret')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入AccessKeySecret" {...field} />
+                    <Input placeholder={t('access.form.access.key.secret.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -184,7 +190,7 @@ const AccessAliyunForm = ({
            <FormMessage />

            <div className="flex justify-end">
-              <Button type="submit">保存</Button>
+              <Button type="submit">{t('save')}</Button>
            </div>
          </form>
        </Form>
--- a/ui/src/components/certimate/AccessCloudflareForm.tsx
+++ b/ui/src/components/certimate/AccessCloudflareForm.tsx
@@ -1,5 +1,6 @@
 import { Input } from "@/components/ui/input";
 import { useForm } from "react-hook-form";
+import { useTranslation } from "react-i18next";

 import { zodResolver } from "@hookform/resolvers/zod";

@@ -22,17 +23,20 @@ import { PbErrorData } from "@/domain/base";

 const AccessCloudflareForm = ({
  data,
+  op,
  onAfterReq,
 }: {
  data?: Access;
+  op: "add" | "edit" | "copy";
  onAfterReq: () => void;
 }) => {
  const { addAccess, updateAccess } = useConfig();
+  const { t } = useTranslation();
  const formSchema = z.object({
    id: z.string().optional(),
-    name: z.string().min(1).max(64),
+    name: z.string().min(1, 'access.form.name.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
    configType: accessFormType,
-    dnsApiToken: z.string().min(1).max(64),
+    dnsApiToken: z.string().min(1, 'access.form.cloud.dns.api.token.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
  });

  let config: CloudflareConfig = {
@@ -44,7 +48,7 @@ const AccessCloudflareForm = ({
    resolver: zodResolver(formSchema),
    defaultValues: {
      id: data?.id,
-      name: data?.name,
+      name: data?.name || '',
      configType: "cloudflare",
      dnsApiToken: config.dnsApiToken,
    },
@@ -63,6 +67,7 @@ const AccessCloudflareForm = ({
    };

    try {
+      req.id =  op == "copy" ? "" : req.id;
      const rs = await save(req);

      onAfterReq();
@@ -70,7 +75,7 @@ const AccessCloudflareForm = ({
      req.id = rs.id;
      req.created = rs.created;
      req.updated = rs.updated;
-      if (data.id) {
+      if (data.id && op == "edit") {
        updateAccess(req);
        return;
      }
@@ -106,9 +111,9 @@ const AccessCloudflareForm = ({
              name="name"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>名称</FormLabel>
+                  <FormLabel>{t('name')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入授权名称" {...field} />
+                    <Input placeholder={t('access.form.name.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -121,7 +126,7 @@ const AccessCloudflareForm = ({
              name="id"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -136,7 +141,7 @@ const AccessCloudflareForm = ({
              name="configType"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -151,9 +156,9 @@ const AccessCloudflareForm = ({
              name="dnsApiToken"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>CLOUD_DNS_API_TOKEN</FormLabel>
+                  <FormLabel>{t('access.form.cloud.dns.api.token')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入CLOUD_DNS_API_TOKEN" {...field} />
+                    <Input placeholder={t('access.form.cloud.dns.api.token.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -162,7 +167,7 @@ const AccessCloudflareForm = ({
            />

            <div className="flex justify-end">
-              <Button type="submit">保存</Button>
+              <Button type="submit">{t('save')}</Button>
            </div>
          </form>
        </Form>
--- a/ui/src/components/certimate/AccessEdit.tsx
+++ b/ui/src/components/certimate/AccessEdit.tsx
@@ -8,6 +8,7 @@ import {
 import { ScrollArea } from "@/components/ui/scroll-area";

 import { useState } from "react";
+import { useTranslation } from "react-i18next";

 import AccessTencentForm from "./AccessTencentForm";

@@ -32,9 +33,10 @@ import AccessCloudflareForm from "./AccessCloudflareForm";
 import AccessQiniuForm from "./AccessQiniuForm";
 import AccessNamesiloForm from "./AccessNamesiloForm";
 import AccessGodaddyFrom from "./AccessGodaddyForm";
+import AccessLocalForm from "./AccessLocalForm";

 type TargetConfigEditProps = {
-  op: "add" | "edit";
+  op: "add" | "edit" | "copy";
  className?: string;
  trigger: React.ReactNode;
  data?: Access;
@@ -46,6 +48,7 @@ export function AccessEdit({
  className,
 }: TargetConfigEditProps) {
  const [open, setOpen] = useState(false);
+  const { t } = useTranslation();

  const typeKeys = Array.from(accessTypeMap.keys());

@@ -57,6 +60,7 @@ export function AccessEdit({
      form = (
        <AccessTencentForm
          data={data}
+          op={op}
          onAfterReq={() => {
            setOpen(false);
          }}
@@ -67,6 +71,7 @@ export function AccessEdit({
      form = (
        <AccessAliyunForm
          data={data}
+          op={op}
          onAfterReq={() => {
            setOpen(false);
          }}
@@ -77,6 +82,7 @@ export function AccessEdit({
      form = (
        <AccessSSHForm
          data={data}
+          op={op}
          onAfterReq={() => {
            setOpen(false);
          }}
@@ -87,6 +93,7 @@ export function AccessEdit({
      form = (
        <WebhookForm
          data={data}
+          op={op}
          onAfterReq={() => {
            setOpen(false);
          }}
@@ -97,6 +104,7 @@ export function AccessEdit({
      form = (
        <AccessCloudflareForm
          data={data}
+          op={op}
          onAfterReq={() => {
            setOpen(false);
          }}
@@ -107,6 +115,7 @@ export function AccessEdit({
      form = (
        <AccessQiniuForm
          data={data}
+          op={op}
          onAfterReq={() => {
            setOpen(false);
          }}
@@ -117,6 +126,7 @@ export function AccessEdit({
      form = (
        <AccessNamesiloForm
          data={data}
+          op={op}
          onAfterReq={() => {
            setOpen(false);
          }}
@@ -127,6 +137,18 @@ export function AccessEdit({
      form = (
        <AccessGodaddyFrom
          data={data}
+          op={op}
+          onAfterReq={() => {
+            setOpen(false);
+          }}
+        />
+      );
+      break;
+    case "local":
+      form = (
+        <AccessLocalForm
+          data={data}
+          op={op}
          onAfterReq={() => {
            setOpen(false);
          }}
@@ -146,25 +168,24 @@ export function AccessEdit({
      </DialogTrigger>
      <DialogContent className="sm:max-w-[600px] w-full dark:text-stone-200">
        <DialogHeader>
-          <DialogTitle>{op == "add" ? "添加" : "编辑"}授权</DialogTitle>
+          <DialogTitle>{op == "add" ? t('access.add') : op == "edit" ? t('access.edit') : t('access.copy')}</DialogTitle>
        </DialogHeader>
        <ScrollArea className="max-h-[80vh]">
          <div className="container py-3">
-            <Label>服务商</Label>
+            <Label>{t('access.type')}</Label>

            <Select
              onValueChange={(val) => {
-                console.log(val);
                setConfigType(val);
              }}
              defaultValue={configType}
            >
              <SelectTrigger className="mt-3">
-                <SelectValue placeholder="请选择服务商" />
+                <SelectValue placeholder={t('access.type.not.empty')} />
              </SelectTrigger>
              <SelectContent>
                <SelectGroup>
-                  <SelectLabel>服务商</SelectLabel>
+                  <SelectLabel>{t('access.type')}</SelectLabel>
                  {typeKeys.map((key) => (
                    <SelectItem value={key} key={key}>
                      <div
@@ -177,7 +198,7 @@ export function AccessEdit({
                          src={accessTypeMap.get(key)?.[1]}
                          className="h-6 w-6"
                        />
-                        <div>{accessTypeMap.get(key)?.[0]}</div>
+                        <div>{t(accessTypeMap.get(key)?.[0] || '')}</div>
                      </div>
                    </SelectItem>
                  ))}
--- a/ui/src/components/certimate/AccessGodaddyForm.tsx
+++ b/ui/src/components/certimate/AccessGodaddyForm.tsx
@@ -1,5 +1,6 @@
 import { Input } from "@/components/ui/input";
 import { useForm } from "react-hook-form";
+import { useTranslation } from "react-i18next";

 import { zodResolver } from "@hookform/resolvers/zod";

@@ -27,18 +28,21 @@ import { PbErrorData } from "@/domain/base";

 const AccessGodaddyFrom = ({
  data,
+  op,
  onAfterReq,
 }: {
  data?: Access;
+  op: "add" | "edit" | "copy";
  onAfterReq: () => void;
 }) => {
  const { addAccess, updateAccess } = useConfig();
+  const { t } = useTranslation();
  const formSchema = z.object({
    id: z.string().optional(),
-    name: z.string().min(1).max(64),
+    name: z.string().min(1, 'access.form.name.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
    configType: accessFormType,
-    apiKey: z.string().min(1).max(64),
-    apiSecret: z.string().min(1).max(64),
+    apiKey: z.string().min(1, 'access.form.go.daddy.api.key.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
+    apiSecret: z.string().min(1, 'access.form.go.daddy.api.secret.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
  });

  let config: GodaddyConfig = {
@@ -51,7 +55,7 @@ const AccessGodaddyFrom = ({
    resolver: zodResolver(formSchema),
    defaultValues: {
      id: data?.id,
-      name: data?.name,
+      name: data?.name || '',
      configType: "godaddy",
      apiKey: config.apiKey,
      apiSecret: config.apiSecret,
@@ -72,6 +76,7 @@ const AccessGodaddyFrom = ({
    };

    try {
+      req.id =  op == "copy" ? "" : req.id;
      const rs = await save(req);

      onAfterReq();
@@ -79,7 +84,7 @@ const AccessGodaddyFrom = ({
      req.id = rs.id;
      req.created = rs.created;
      req.updated = rs.updated;
-      if (data.id) {
+      if (data.id && op == "edit") {
        updateAccess(req);
        return;
      }
@@ -115,9 +120,9 @@ const AccessGodaddyFrom = ({
              name="name"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>名称</FormLabel>
+                  <FormLabel>{t('name')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入授权名称" {...field} />
+                    <Input placeholder={t('access.form.name.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -130,7 +135,7 @@ const AccessGodaddyFrom = ({
              name="id"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -145,7 +150,7 @@ const AccessGodaddyFrom = ({
              name="configType"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -160,9 +165,9 @@ const AccessGodaddyFrom = ({
              name="apiKey"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>GODADDY_API_KEY</FormLabel>
+                  <FormLabel>{t('access.form.go.daddy.api.key')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入GODADDY_API_KEY" {...field} />
+                    <Input placeholder={t('access.form.go.daddy.api.key.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -175,9 +180,9 @@ const AccessGodaddyFrom = ({
              name="apiSecret"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>GODADDY_API_SECRET</FormLabel>
+                  <FormLabel>{t('access.form.go.daddy.api.secret')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入GODADDY_API_SECRET" {...field} />
+                    <Input placeholder={t('access.form.go.daddy.api.secret.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -186,7 +191,7 @@ const AccessGodaddyFrom = ({
            />

            <div className="flex justify-end">
-              <Button type="submit">保存</Button>
+              <Button type="submit">{t('save')}</Button>
            </div>
          </form>
        </Form>
--- a/ui/src/components/certimate/AccessGroupEdit.tsx
+++ b/ui/src/components/certimate/AccessGroupEdit.tsx
@@ -25,6 +25,7 @@ import { update } from "@/repository/access_group";
 import { ClientResponseError } from "pocketbase";
 import { PbErrorData } from "@/domain/base";
 import { useState } from "react";
+import { useTranslation } from "react-i18next";

 type AccessGroupEditProps = {
  className?: string;
@@ -35,9 +36,10 @@ const AccessGroupEdit = ({ className, trigger }: AccessGroupEditProps) => {
  const { reloadAccessGroups } = useConfig();

  const [open, setOpen] = useState(false);
+  const { t } = useTranslation();

  const formSchema = z.object({
-    name: z.string().min(1).max(64),
+    name: z.string().min(1, 'access.group.name.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
  });

  const form = useForm<z.infer<typeof formSchema>>({
@@ -78,14 +80,13 @@ const AccessGroupEdit = ({ className, trigger }: AccessGroupEditProps) => {
      </DialogTrigger>
      <DialogContent className="sm:max-w-[600px] w-full dark:text-stone-200">
        <DialogHeader>
-          <DialogTitle>添加分组</DialogTitle>
+          <DialogTitle>{t('access.group.add')}</DialogTitle>
        </DialogHeader>

        <div className="container py-3">
          <Form {...form}>
            <form
              onSubmit={(e) => {
-                console.log(e);
                e.stopPropagation();
                form.handleSubmit(onSubmit)(e);
              }}
@@ -96,9 +97,9 @@ const AccessGroupEdit = ({ className, trigger }: AccessGroupEditProps) => {
                name="name"
                render={({ field }) => (
                  <FormItem>
-                    <FormLabel>组名</FormLabel>
+                    <FormLabel>{t('access.group.name')}</FormLabel>
                    <FormControl>
-                      <Input placeholder="请输入组名" {...field} type="text" />
+                      <Input placeholder={t('access.group.name.not.empty')} {...field} type="text" />
                    </FormControl>

                    <FormMessage />
@@ -107,7 +108,7 @@ const AccessGroupEdit = ({ className, trigger }: AccessGroupEditProps) => {
              />

              <div className="flex justify-end">
-                <Button type="submit">保存</Button>
+                <Button type="submit">{t('save')}</Button>
              </div>
            </form>
          </Form>
--- a/ui/src/components/certimate/AccessGroupList.tsx
+++ b/ui/src/components/certimate/AccessGroupList.tsx
@@ -29,6 +29,7 @@ import { Group } from "lucide-react";
 import { useToast } from "@/components/ui/use-toast";

 import { useNavigate } from "react-router-dom";
+import { useTranslation } from "react-i18next";

 const AccessGroupList = () => {
  const {
@@ -39,8 +40,7 @@ const AccessGroupList = () => {
  const { toast } = useToast();

  const navigate = useNavigate();
-
-  
+  const { t } = useTranslation();

  const handleRemoveClick = async (id: string) => {
    try {
@@ -48,7 +48,7 @@ const AccessGroupList = () => {
      reloadAccessGroups();
    } catch (e) {
      toast({
-        title: "删除失败",
+        title: t('delete.failed'),
        description: getErrMessage(e),
        variant: "destructive",
      });
@@ -69,10 +69,10 @@ const AccessGroupList = () => {
            </span>

            <div className="text-center text-sm text-muted-foreground mt-3">
-              请添加域名开始部署证书吧。
+              {t('access.group.domain.empty')}
            </div>
            <AccessGroupEdit
-              trigger={<Button>新增授权组</Button>}
+              trigger={<Button>{t('access.group.add')}</Button>}
              className="mt-3"
            />
          </div>
@@ -86,9 +86,7 @@ const AccessGroupList = () => {
              <CardHeader>
                <CardTitle>{accessGroup.name}</CardTitle>
                <CardDescription>
-                  共有
-                  {accessGroup.expand ? accessGroup.expand.access.length : 0}
-                  个部署授权配置
+                  {t('access.group.total', { total: accessGroup.expand ? accessGroup.expand.access.length : 0 })}
                </CardDescription>
              </CardHeader>
              <CardContent className="min-h-[180px]">
@@ -123,7 +121,7 @@ const AccessGroupList = () => {
                        <Group size={40} />
                      </div>
                      <div className="ml-2">
-                        暂无部署授权配置，请添加后开始使用吧
+                        {t('access.group.empty')}
                      </div>
                    </div>
                  </>
@@ -151,7 +149,7 @@ const AccessGroupList = () => {
                          );
                        }}
                      >
-                        所有授权
+                        {t('access.all')}
                      </Button>
                    </div>
                  </Show>
@@ -159,14 +157,14 @@ const AccessGroupList = () => {
                  <Show
                    when={
                      !accessGroup.expand ||
-                      accessGroup.expand.access.length == 0
+                        accessGroup.expand.access.length == 0
                        ? true
                        : false
                    }
                  >
                    <div>
                      <Button size="sm" onClick={handleAddAccess}>
-                        新增授权
+                        {t('access.add')}
                      </Button>
                    </div>
                  </Show>
@@ -175,21 +173,21 @@ const AccessGroupList = () => {
                    <AlertDialog>
                      <AlertDialogTrigger asChild>
                        <Button variant={"destructive"} size={"sm"}>
-                          删除
+                          {t('delete')}
                        </Button>
                      </AlertDialogTrigger>
                      <AlertDialogContent>
                        <AlertDialogHeader>
                          <AlertDialogTitle className="dark:text-gray-200">
-                            删除组
+                            {t('access.group.delete')}
                          </AlertDialogTitle>
                          <AlertDialogDescription>
-                            确定要删除部署授权组吗？
+                            {t('access.group.delete.confirm')}
                          </AlertDialogDescription>
                        </AlertDialogHeader>
                        <AlertDialogFooter>
                          <AlertDialogCancel className="dark:text-gray-200">
-                            取消
+                            {t('cancel')}
                          </AlertDialogCancel>
                          <AlertDialogAction
                            onClick={() => {
@@ -198,7 +196,7 @@ const AccessGroupList = () => {
                              );
                            }}
                          >
-                            确认
+                            {t('confirm')}
                          </AlertDialogAction>
                        </AlertDialogFooter>
                      </AlertDialogContent>
--- a/ui/src/components/certimate/AccessLocalForm.tsx
+++ b/ui/src/components/certimate/AccessLocalForm.tsx
@@ -0,0 +1,228 @@
+import {
+  Access,
+  accessFormType,
+  getUsageByConfigType,
+  LocalConfig,
+  SSHConfig,
+} from "@/domain/access";
+import { useConfig } from "@/providers/config";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useForm } from "react-hook-form";
+import { z } from "zod";
+import { useTranslation } from "react-i18next";
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from "../ui/form";
+import { Input } from "../ui/input";
+import { Button } from "../ui/button";
+import { Textarea } from "../ui/textarea";
+import { save } from "@/repository/access";
+import { ClientResponseError } from "pocketbase";
+import { PbErrorData } from "@/domain/base";
+
+const AccessLocalForm = ({
+  data,
+  op,
+  onAfterReq,
+}: {
+  data?: Access;
+  op: "add" | "edit" | "copy";
+  onAfterReq: () => void;
+}) => {
+  const { addAccess, updateAccess, reloadAccessGroups } = useConfig();
+  const { t } = useTranslation();
+
+  const formSchema = z.object({
+    id: z.string().optional(),
+    name: z.string().min(1, 'access.form.name.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
+    configType: accessFormType,
+
+    command: z.string().min(1, 'access.form.ssh.command.not.empty').max(2048, t('zod.rule.string.max', { max: 2048 })),
+    certPath: z.string().min(0, 'access.form.ssh.cert.path.not.empty').max(2048, t('zod.rule.string.max', { max: 2048 })),
+    keyPath: z.string().min(0, 'access.form.ssh.key.path.not.empty').max(2048, t('zod.rule.string.max', { max: 2048 })),
+  });
+
+  let config: LocalConfig = {
+    command: "sudo service nginx restart",
+    certPath: "/etc/nginx/ssl/certificate.crt",
+    keyPath: "/etc/nginx/ssl/private.key",
+  };
+  if (data) config = data.config as SSHConfig;
+
+  const form = useForm<z.infer<typeof formSchema>>({
+    resolver: zodResolver(formSchema),
+    defaultValues: {
+      id: data?.id,
+      name: data?.name || '',
+      configType: "local",
+      certPath: config.certPath,
+      keyPath: config.keyPath,
+      command: config.command,
+    },
+  });
+
+  const onSubmit = async (data: z.infer<typeof formSchema>) => {
+    const req: Access = {
+      id: data.id as string,
+      name: data.name,
+      configType: data.configType,
+      usage: getUsageByConfigType(data.configType),
+
+      config: {
+        command: data.command,
+        certPath: data.certPath,
+        keyPath: data.keyPath,
+      },
+    };
+
+    try {
+      req.id =  op == "copy" ? "" : req.id;
+      const rs = await save(req);
+
+      onAfterReq();
+
+      req.id = rs.id;
+      req.created = rs.created;
+      req.updated = rs.updated;
+      if (data.id && op == "edit") {
+        updateAccess(req);
+      } else {
+        addAccess(req);
+      }
+
+      reloadAccessGroups();
+    } catch (e) {
+      const err = e as ClientResponseError;
+
+      Object.entries(err.response.data as PbErrorData).forEach(
+        ([key, value]) => {
+          form.setError(key as keyof z.infer<typeof formSchema>, {
+            type: "manual",
+            message: value.message,
+          });
+        }
+      );
+
+      return;
+    }
+  };
+
+  return (
+    <>
+      <div className="max-w-[35em] mx-auto mt-10">
+        <Form {...form}>
+          <form
+            onSubmit={(e) => {
+              e.stopPropagation();
+              form.handleSubmit(onSubmit)(e);
+            }}
+            className="space-y-3"
+          >
+            <FormField
+              control={form.control}
+              name="name"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>{t('name')}</FormLabel>
+                  <FormControl>
+                    <Input placeholder={t('access.form.name.not.empty')} {...field} />
+                  </FormControl>
+
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <FormField
+              control={form.control}
+              name="id"
+              render={({ field }) => (
+                <FormItem className="hidden">
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
+                  <FormControl>
+                    <Input {...field} />
+                  </FormControl>
+
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <FormField
+              control={form.control}
+              name="configType"
+              render={({ field }) => (
+                <FormItem className="hidden">
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
+                  <FormControl>
+                    <Input {...field} />
+                  </FormControl>
+
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <FormField
+              control={form.control}
+              name="certPath"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>{t('access.form.ssh.cert.path')}</FormLabel>
+                  <FormControl>
+                    <Input placeholder={t('access.form.ssh.cert.path.not.empty')} {...field} />
+                  </FormControl>
+
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <FormField
+              control={form.control}
+              name="keyPath"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>{t('access.form.ssh.key.path')}</FormLabel>
+                  <FormControl>
+                    <Input placeholder={t('access.form.ssh.key.path.not.empty')} {...field} />
+                  </FormControl>
+
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <FormField
+              control={form.control}
+              name="command"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>{t('access.form.ssh.command')}</FormLabel>
+                  <FormControl>
+                    <Textarea placeholder={t('access.form.ssh.command.not.empty')} {...field} />
+                  </FormControl>
+
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <FormMessage />
+
+            <div className="flex justify-end">
+              <Button type="submit">{t('save')}</Button>
+            </div>
+          </form>
+        </Form>
+      </div>
+    </>
+  );
+};
+
+export default AccessLocalForm;
--- a/ui/src/components/certimate/AccessNamesiloForm.tsx
+++ b/ui/src/components/certimate/AccessNamesiloForm.tsx
@@ -1,5 +1,6 @@
 import { Input } from "@/components/ui/input";
 import { useForm } from "react-hook-form";
+import { useTranslation } from "react-i18next";

 import { zodResolver } from "@hookform/resolvers/zod";

@@ -22,17 +23,20 @@ import { PbErrorData } from "@/domain/base";

 const AccessNamesiloForm = ({
  data,
+  op,
  onAfterReq,
 }: {
  data?: Access;
+  op: "add" | "edit" | "copy";
  onAfterReq: () => void;
 }) => {
  const { addAccess, updateAccess } = useConfig();
+  const { t } = useTranslation();
  const formSchema = z.object({
    id: z.string().optional(),
-    name: z.string().min(1).max(64),
+    name: z.string().min(1, 'access.form.name.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
    configType: accessFormType,
-    apiKey: z.string().min(1).max(64),
+    apiKey: z.string().min(1, 'access.form.namesilo.api.key.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
  });

  let config: NamesiloConfig = {
@@ -44,14 +48,13 @@ const AccessNamesiloForm = ({
    resolver: zodResolver(formSchema),
    defaultValues: {
      id: data?.id,
-      name: data?.name,
+      name: data?.name || '',
      configType: "namesilo",
      apiKey: config.apiKey,
    },
  });

  const onSubmit = async (data: z.infer<typeof formSchema>) => {
-    console.log(data);
    const req: Access = {
      id: data.id as string,
      name: data.name,
@@ -63,6 +66,7 @@ const AccessNamesiloForm = ({
    };

    try {
+      req.id =  op == "copy" ? "" : req.id;
      const rs = await save(req);

      onAfterReq();
@@ -70,7 +74,7 @@ const AccessNamesiloForm = ({
      req.id = rs.id;
      req.created = rs.created;
      req.updated = rs.updated;
-      if (data.id) {
+      if (data.id && op == "edit") {
        updateAccess(req);
        return;
      }
@@ -106,9 +110,9 @@ const AccessNamesiloForm = ({
              name="name"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>名称</FormLabel>
+                  <FormLabel>{t('name')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入授权名称" {...field} />
+                    <Input placeholder={t('access.form.name.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -121,7 +125,7 @@ const AccessNamesiloForm = ({
              name="id"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -136,7 +140,7 @@ const AccessNamesiloForm = ({
              name="configType"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -151,9 +155,9 @@ const AccessNamesiloForm = ({
              name="apiKey"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>NAMESILO_API_KEY</FormLabel>
+                  <FormLabel>{t('access.form.namesilo.api.key')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入NAMESILO_API_KEY" {...field} />
+                    <Input placeholder={t('access.form.namesilo.api.key.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -162,7 +166,7 @@ const AccessNamesiloForm = ({
            />

            <div className="flex justify-end">
-              <Button type="submit">保存</Button>
+              <Button type="submit">{t('save')}</Button>
            </div>
          </form>
        </Form>
--- a/ui/src/components/certimate/AccessQiniuForm.tsx
+++ b/ui/src/components/certimate/AccessQiniuForm.tsx
@@ -1,5 +1,6 @@
 import { Input } from "@/components/ui/input";
 import { useForm } from "react-hook-form";
+import { useTranslation } from "react-i18next";

 import { zodResolver } from "@hookform/resolvers/zod";

@@ -23,18 +24,21 @@ import { PbErrorData } from "@/domain/base";

 const AccessQiniuForm = ({
  data,
+  op,
  onAfterReq,
 }: {
  data?: Access;
+  op: "add" | "edit" | "copy";
  onAfterReq: () => void;
 }) => {
  const { addAccess, updateAccess } = useConfig();
+  const { t } = useTranslation();
  const formSchema = z.object({
    id: z.string().optional(),
-    name: z.string().min(1).max(64),
+    name: z.string().min(1, 'access.form.name.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
    configType: accessFormType,
-    accessKey: z.string().min(1).max(64),
-    secretKey: z.string().min(1).max(64),
+    accessKey: z.string().min(1, 'access.form.access.key.not.empty').max(64),
+    secretKey: z.string().min(1, 'access.form.secret.key.not.empty').max(64),
  });

  let config: QiniuConfig = {
@@ -47,7 +51,7 @@ const AccessQiniuForm = ({
    resolver: zodResolver(formSchema),
    defaultValues: {
      id: data?.id,
-      name: data?.name,
+      name: data?.name || '',
      configType: "qiniu",
      accessKey: config.accessKey,
      secretKey: config.secretKey,
@@ -67,6 +71,7 @@ const AccessQiniuForm = ({
    };

    try {
+      req.id =  op == "copy" ? "" : req.id;
      const rs = await save(req);

      onAfterReq();
@@ -74,7 +79,7 @@ const AccessQiniuForm = ({
      req.id = rs.id;
      req.created = rs.created;
      req.updated = rs.updated;
-      if (data.id) {
+      if (data.id && op == "edit") {
        updateAccess(req);
        return;
      }
@@ -111,9 +116,9 @@ const AccessQiniuForm = ({
              name="name"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>名称</FormLabel>
+                  <FormLabel>{t('name')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入授权名称" {...field} />
+                    <Input placeholder={t('access.form.name.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -126,7 +131,7 @@ const AccessQiniuForm = ({
              name="id"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -141,7 +146,7 @@ const AccessQiniuForm = ({
              name="configType"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -156,9 +161,9 @@ const AccessQiniuForm = ({
              name="accessKey"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>AccessKey</FormLabel>
+                  <FormLabel>{t('access.form.access.key')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入AccessKey" {...field} />
+                    <Input placeholder={t('access.form.access.key.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -171,9 +176,9 @@ const AccessQiniuForm = ({
              name="secretKey"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>SecretKey</FormLabel>
+                  <FormLabel>{t('access.form.secret.key')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入SecretKey" {...field} />
+                    <Input placeholder={t('access.form.secret.key.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -184,7 +189,7 @@ const AccessQiniuForm = ({
            <FormMessage />

            <div className="flex justify-end">
-              <Button type="submit">保存</Button>
+              <Button type="submit">{t('save')}</Button>
            </div>
          </form>
        </Form>
--- a/ui/src/components/certimate/AccessSSHForm.tsx
+++ b/ui/src/components/certimate/AccessSSHForm.tsx
@@ -24,6 +24,7 @@ import { ClientResponseError } from "pocketbase";
 import { PbErrorData } from "@/domain/base";
 import { readFileContent } from "@/lib/file";
 import { useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
 import {
  Select,
  SelectContent,
@@ -38,9 +39,11 @@ import { updateById } from "@/repository/access_group";

 const AccessSSHForm = ({
  data,
+  op,
  onAfterReq,
 }: {
  data?: Access;
+  op: "add" | "edit" | "copy";
  onAfterReq: () => void;
 }) => {
  const {
@@ -53,6 +56,7 @@ const AccessSSHForm = ({
  const fileInputRef = useRef<HTMLInputElement | null>(null);

  const [fileName, setFileName] = useState("");
+  const { t } = useTranslation();

  const originGroup = data ? (data.group ? data.group : "") : "";

@@ -62,25 +66,27 @@ const AccessSSHForm = ({

  const formSchema = z.object({
    id: z.string().optional(),
-    name: z.string().min(1).max(64),
+    name: z.string().min(1, 'access.form.name.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
    configType: accessFormType,
    host: z.string().refine(
      (str) => {
        return ipReg.test(str) || domainReg.test(str);
      },
      {
-        message: "请输入正确的域名或IP",
+        message: "zod.rule.ssh.host",
      }
    ),
    group: z.string().optional(),
-    port: z.string().min(1).max(5),
-    username: z.string().min(1).max(64),
-    password: z.string().min(0).max(64),
-    key: z.string().min(0).max(20480),
+    port: z.string().min(1, 'access.form.ssh.port.not.empty').max(5, t('zod.rule.string.max', { max: 5 })),
+    username: z.string().min(1, 'username.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
+    password: z.string().min(0, 'password.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
+    key: z.string().min(0, 'access.form.ssh.key.not.empty').max(20480, t('zod.rule.string.max', { max: 20480 })),
    keyFile: z.any().optional(),
-    command: z.string().min(1).max(2048),
-    certPath: z.string().min(0).max(2048),
-    keyPath: z.string().min(0).max(2048),
+
+    preCommand: z.string().min(0).max(2048, t('zod.rule.string.max', { max: 2048 })).optional(),
+    command: z.string().min(1, 'access.form.ssh.command.not.empty').max(2048, t('zod.rule.string.max', { max: 2048 })),
+    certPath: z.string().min(0, 'access.form.ssh.cert.path.not.empty').max(2048, t('zod.rule.string.max', { max: 2048 })),
+    keyPath: z.string().min(0, 'access.form.ssh.key.path.not.empty').max(2048, t('zod.rule.string.max', { max: 2048 })),
  });

  let config: SSHConfig = {
@@ -90,6 +96,7 @@ const AccessSSHForm = ({
    password: "",
    key: "",
    keyFile: "",
+    preCommand: "",
    command: "sudo service nginx restart",
    certPath: "/etc/nginx/ssl/certificate.crt",
    keyPath: "/etc/nginx/ssl/private.key",
@@ -100,7 +107,7 @@ const AccessSSHForm = ({
    resolver: zodResolver(formSchema),
    defaultValues: {
      id: data?.id,
-      name: data?.name,
+      name: data?.name || '',
      configType: "ssh",
      group: data?.group,
      host: config.host,
@@ -112,11 +119,11 @@ const AccessSSHForm = ({
      certPath: config.certPath,
      keyPath: config.keyPath,
      command: config.command,
+      preCommand: config.preCommand,
    },
  });

  const onSubmit = async (data: z.infer<typeof formSchema>) => {
-    console.log(data);
    let group = data.group;
    if (group == "emptyId") group = "";

@@ -133,12 +140,14 @@ const AccessSSHForm = ({
        password: data.password,
        key: data.key,
        command: data.command,
+        preCommand: data.preCommand,
        certPath: data.certPath,
        keyPath: data.keyPath,
      },
    };

    try {
+      req.id =  op == "copy" ? "" : req.id;
      const rs = await save(req);

      onAfterReq();
@@ -146,7 +155,7 @@ const AccessSSHForm = ({
      req.id = rs.id;
      req.created = rs.created;
      req.updated = rs.updated;
-      if (data.id) {
+      if (data.id && op == "edit") {
        updateAccess(req);
      } else {
        addAccess(req);
@@ -219,9 +228,9 @@ const AccessSSHForm = ({
              name="name"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>名称</FormLabel>
+                  <FormLabel>{t('name')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入授权名称" {...field} />
+                    <Input placeholder={t('access.form.name.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -235,12 +244,12 @@ const AccessSSHForm = ({
              render={({ field }) => (
                <FormItem>
                  <FormLabel className="w-full flex justify-between">
-                    <div>授权配置组(用于将一个域名证书部署到多个 ssh 主机)</div>
+                    <div>{t('access.form.ssh.group.label')}</div>
                    <AccessGroupEdit
                      trigger={
                        <div className="font-normal text-primary hover:underline cursor-pointer flex items-center">
                          <Plus size={14} />
-                          新增
+                          {t('add')}
                        </div>
                      }
                    />
@@ -255,7 +264,7 @@ const AccessSSHForm = ({
                      }}
                    >
                      <SelectTrigger>
-                        <SelectValue placeholder="请选择分组" />
+                        <SelectValue placeholder={t('access.group.not.empty')} />
                      </SelectTrigger>
                      <SelectContent>
                        <SelectItem value="emptyId">
@@ -295,7 +304,7 @@ const AccessSSHForm = ({
              name="id"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -310,7 +319,7 @@ const AccessSSHForm = ({
              name="configType"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -325,9 +334,9 @@ const AccessSSHForm = ({
                name="host"
                render={({ field }) => (
                  <FormItem className="grow">
-                    <FormLabel>服务器HOST</FormLabel>
+                    <FormLabel>{t('access.form.ssh.host')}</FormLabel>
                    <FormControl>
-                      <Input placeholder="请输入Host" {...field} />
+                      <Input placeholder={t('access.form.ssh.host.not.empty')} {...field} />
                    </FormControl>

                    <FormMessage />
@@ -340,10 +349,10 @@ const AccessSSHForm = ({
                name="port"
                render={({ field }) => (
                  <FormItem>
-                    <FormLabel>SSH端口</FormLabel>
+                    <FormLabel>{t('access.form.ssh.port')}</FormLabel>
                    <FormControl>
                      <Input
-                        placeholder="请输入Port"
+                        placeholder={t('access.form.ssh.port.not.empty')}
                        {...field}
                        type="number"
                      />
@@ -360,9 +369,9 @@ const AccessSSHForm = ({
              name="username"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>用户名</FormLabel>
+                  <FormLabel>{t('username')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入用户名" {...field} />
+                    <Input placeholder={t('username.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -375,10 +384,10 @@ const AccessSSHForm = ({
              name="password"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>密码</FormLabel>
+                  <FormLabel>{t('password')}</FormLabel>
                  <FormControl>
                    <Input
-                      placeholder="请输入密码"
+                      placeholder={t('password.not.empty')}
                      {...field}
                      type="password"
                    />
@@ -394,9 +403,9 @@ const AccessSSHForm = ({
              name="key"
              render={({ field }) => (
                <FormItem hidden>
-                  <FormLabel>Key（使用证书登录）</FormLabel>
+                  <FormLabel>{t('access.form.ssh.key')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入Key" {...field} />
+                    <Input placeholder={t('access.form.ssh.key.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -409,7 +418,7 @@ const AccessSSHForm = ({
              name="keyFile"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>Key（使用证书登录）</FormLabel>
+                  <FormLabel>{t('access.form.ssh.key')}</FormLabel>
                  <FormControl>
                    <div>
                      <Button
@@ -419,10 +428,10 @@ const AccessSSHForm = ({
                        className="w-48"
                        onClick={handleSelectFileClick}
                      >
-                        {fileName ? fileName : "请选择文件"}
+                        {fileName ? fileName : t('access.form.ssh.key.file.not.empty')}
                      </Button>
                      <Input
-                        placeholder="请输入Key"
+                        placeholder={t('access.form.ssh.key.not.empty')}
                        {...field}
                        ref={fileInputRef}
                        className="hidden"
@@ -443,9 +452,9 @@ const AccessSSHForm = ({
              name="certPath"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>证书上传路径</FormLabel>
+                  <FormLabel>{t('access.form.ssh.cert.path')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入证书上传路径" {...field} />
+                    <Input placeholder={t('access.form.ssh.cert.path.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -458,9 +467,24 @@ const AccessSSHForm = ({
              name="keyPath"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>私钥上传路径</FormLabel>
+                  <FormLabel>{t('access.form.ssh.key.path')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入私钥上传路径" {...field} />
+                    <Input placeholder={t('access.form.ssh.key.path.not.empty')} {...field} />
+                  </FormControl>
+
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <FormField
+              control={form.control}
+              name="preCommand"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>{t('access.form.ssh.pre.command')}</FormLabel>
+                  <FormControl>
+                    <Textarea placeholder={t('access.form.ssh.pre.command.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -473,9 +497,9 @@ const AccessSSHForm = ({
              name="command"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>Command</FormLabel>
+                  <FormLabel>{t('access.form.ssh.command')}</FormLabel>
                  <FormControl>
-                    <Textarea placeholder="请输入要执行的命令" {...field} />
+                    <Textarea placeholder={t('access.form.ssh.command.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -486,7 +510,7 @@ const AccessSSHForm = ({
            <FormMessage />

            <div className="flex justify-end">
-              <Button type="submit">保存</Button>
+              <Button type="submit">{t('save')}</Button>
            </div>
          </form>
        </Form>
--- a/ui/src/components/certimate/AccessTencentForm.tsx
+++ b/ui/src/components/certimate/AccessTencentForm.tsx
@@ -1,5 +1,6 @@
 import { Input } from "@/components/ui/input";
 import { useForm } from "react-hook-form";
+import { useTranslation } from "react-i18next";

 import { zodResolver } from "@hookform/resolvers/zod";

@@ -22,18 +23,21 @@ import { PbErrorData } from "@/domain/base";

 const AccessTencentForm = ({
  data,
+  op,
  onAfterReq,
 }: {
  data?: Access;
+  op: "add" | "edit" | "copy";
  onAfterReq: () => void;
 }) => {
  const { addAccess, updateAccess } = useConfig();
+  const { t } = useTranslation();
  const formSchema = z.object({
    id: z.string().optional(),
-    name: z.string().min(1).max(64),
+    name: z.string().min(1, 'access.form.name.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
    configType: accessFormType,
-    secretId: z.string().min(1).max(64),
-    secretKey: z.string().min(1).max(64),
+    secretId: z.string().min(1, 'access.form.secret.id.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
+    secretKey: z.string().min(1, 'access.form.secret.key.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
  });

  let config: TencentConfig = {
@@ -46,7 +50,7 @@ const AccessTencentForm = ({
    resolver: zodResolver(formSchema),
    defaultValues: {
      id: data?.id,
-      name: data?.name,
+      name: data?.name || '',
      configType: "tencent",
      secretId: config.secretId,
      secretKey: config.secretKey,
@@ -66,6 +70,7 @@ const AccessTencentForm = ({
    };

    try {
+      req.id =  op == "copy" ? "" : req.id;
      const rs = await save(req);

      onAfterReq();
@@ -73,7 +78,7 @@ const AccessTencentForm = ({
      req.id = rs.id;
      req.created = rs.created;
      req.updated = rs.updated;
-      if (data.id) {
+      if (data.id && op == "edit") {
        updateAccess(req);
        return;
      }
@@ -108,9 +113,9 @@ const AccessTencentForm = ({
              name="name"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>名称</FormLabel>
+                  <FormLabel>{t('name')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入授权名称" {...field} />
+                    <Input placeholder={t('access.form.name.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -123,7 +128,7 @@ const AccessTencentForm = ({
              name="id"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -138,7 +143,7 @@ const AccessTencentForm = ({
              name="configType"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -153,9 +158,9 @@ const AccessTencentForm = ({
              name="secretId"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>SecretId</FormLabel>
+                  <FormLabel>{t('access.form.secret.id')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入SecretId" {...field} />
+                    <Input placeholder={t('access.form.secret.id.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -168,9 +173,9 @@ const AccessTencentForm = ({
              name="secretKey"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>SecretKey</FormLabel>
+                  <FormLabel>{t('access.form.secret.key')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入SecretKey" {...field} />
+                    <Input placeholder={t('access.form.secret.key.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -179,7 +184,7 @@ const AccessTencentForm = ({
            />

            <div className="flex justify-end">
-              <Button type="submit">保存</Button>
+              <Button type="submit">{t('save')}</Button>
            </div>
          </form>
        </Form>
--- a/ui/src/components/certimate/AccessWebhookFrom.tsx
+++ b/ui/src/components/certimate/AccessWebhookFrom.tsx
@@ -1,5 +1,6 @@
 import { Input } from "@/components/ui/input";
 import { useForm } from "react-hook-form";
+import { useTranslation } from "react-i18next";

 import { zodResolver } from "@hookform/resolvers/zod";

@@ -22,17 +23,20 @@ import { PbErrorData } from "@/domain/base";

 const WebhookForm = ({
  data,
+  op,
  onAfterReq,
 }: {
  data?: Access;
+  op: "add" | "edit" | "copy";
  onAfterReq: () => void;
 }) => {
  const { addAccess, updateAccess } = useConfig();
+  const { t } = useTranslation();
  const formSchema = z.object({
    id: z.string().optional(),
-    name: z.string().min(1).max(64),
+    name: z.string().min(1, 'access.form.name.not.empty').max(64, t('zod.rule.string.max', { max: 64 })),
    configType: accessFormType,
-    url: z.string().url(),
+    url: z.string().url('zod.rule.url'),
  });

  let config: WebhookConfig = {
@@ -44,14 +48,13 @@ const WebhookForm = ({
    resolver: zodResolver(formSchema),
    defaultValues: {
      id: data?.id,
-      name: data?.name,
+      name: data?.name || '',
      configType: "webhook",
      url: config.url,
    },
  });

  const onSubmit = async (data: z.infer<typeof formSchema>) => {
-    console.log(data);
    const req: Access = {
      id: data.id as string,
      name: data.name,
@@ -63,6 +66,7 @@ const WebhookForm = ({
    };

    try {
+      req.id =  op == "copy" ? "" : req.id;
      const rs = await save(req);

      onAfterReq();
@@ -70,7 +74,7 @@ const WebhookForm = ({
      req.id = rs.id;
      req.created = rs.created;
      req.updated = rs.updated;
-      if (data.id) {
+      if (data.id && op == "edit") {
        updateAccess(req);
        return;
      }
@@ -106,9 +110,9 @@ const WebhookForm = ({
              name="name"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>名称</FormLabel>
+                  <FormLabel>{t('name')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入授权名称" {...field} />
+                    <Input placeholder={t('access.form.name.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -121,7 +125,7 @@ const WebhookForm = ({
              name="id"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -136,7 +140,7 @@ const WebhookForm = ({
              name="configType"
              render={({ field }) => (
                <FormItem className="hidden">
-                  <FormLabel>配置类型</FormLabel>
+                  <FormLabel>{t('access.form.config.field')}</FormLabel>
                  <FormControl>
                    <Input {...field} />
                  </FormControl>
@@ -151,9 +155,9 @@ const WebhookForm = ({
              name="url"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>Webhook Url</FormLabel>
+                  <FormLabel>{t('access.form.webhook.url')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="请输入Webhook Url" {...field} />
+                    <Input placeholder={t('access.form.webhook.url.not.empty')} {...field} />
                  </FormControl>

                  <FormMessage />
@@ -162,7 +166,7 @@ const WebhookForm = ({
            />

            <div className="flex justify-end">
-              <Button type="submit">保存</Button>
+              <Button type="submit">{t('save')}</Button>
            </div>
          </form>
        </Form>
--- a/ui/src/components/certimate/DeployProgress.tsx
+++ b/ui/src/components/certimate/DeployProgress.tsx
@@ -1,3 +1,8 @@
+import { useTranslation } from "react-i18next";
+
+import { cn } from "@/lib/utils"
+
+
 import { Separator } from "../ui/separator";

 type DeployProgressProps = {
@@ -6,80 +11,63 @@ type DeployProgressProps = {
 };

 const DeployProgress = ({ phase, phaseSuccess }: DeployProgressProps) => {
-  let rs = <> </>;
+  const { t } = useTranslation();
+
+  let step = 0;
+
  if (phase === "check") {
-    if (phaseSuccess) {
-      rs = (
-        <div className="flex items-center">
-          <div className="text-xs text-nowrap text-green-600">检查 </div>
-          <Separator className="h-1 grow" />
-          <div className="text-xs text-nowrap  text-muted-foreground">获取</div>
-          <Separator className="h-1 grow" />
-          <div className="text-xs text-nowrap text-muted-foreground">部署</div>
-        </div>
-      );
-    } else {
-      rs = (
-        <div className="flex items-center">
-          <div className="text-xs text-nowrap text-red-600">检查 </div>
-          <Separator className="h-1 grow" />
-          <div className="text-xs text-nowrap  text-muted-foreground">获取</div>
-          <Separator className="h-1 grow" />
-          <div className="text-xs text-nowrap text-muted-foreground">部署</div>
-        </div>
-      );
-    }
+    step = 1
+  } else if (phase === "apply") {
+    step = 2
+  } else if (phase === "deploy") {
+    step = 3
  }

-  if (phase === "apply") {
-    if (phaseSuccess) {
-      rs = (
-        <div className="flex items-center">
-          <div className="text-xs text-nowrap text-green-600">检查 </div>
-          <Separator className="h-1 grow bg-green-600" />
-          <div className="text-xs text-nowrap  text-green-600">获取</div>
-          <Separator className="h-1 grow" />
-          <div className="text-xs text-nowrap text-muted-foreground">部署</div>
-        </div>
-      );
-    } else {
-      rs = (
-        <div className="flex items-center">
-          <div className="text-xs text-nowrap text-green-600">检查 </div>
-          <Separator className="h-1 grow bg-green-600" />
-          <div className="text-xs text-nowrap  text-red-600">获取</div>
-          <Separator className="h-1 grow" />
-          <div className="text-xs text-nowrap text-muted-foreground">部署</div>
-        </div>
-      );
-    }
-  }
-
-  if (phase === "deploy") {
-    if (phaseSuccess) {
-      rs = (
-        <div className="flex items-center">
-          <div className="text-xs text-nowrap text-green-600">检查 </div>
-          <Separator className="h-1 grow bg-green-600" />
-          <div className="text-xs text-nowrap  text-green-600">获取</div>
-          <Separator className="h-1 grow bg-green-600" />
-          <div className="text-xs text-nowrap text-green-600">部署</div>
-        </div>
-      );
-    } else {
-      rs = (
-        <div className="flex items-center">
-          <div className="text-xs text-nowrap text-green-600">检查 </div>
-          <Separator className="h-1 grow bg-green-600" />
-          <div className="text-xs text-nowrap  text-green-600">获取</div>
-          <Separator className="h-1 grow bg-green-600" />
-          <div className="text-xs text-nowrap text-red-600">部署</div>
-        </div>
-      );
-    }
-  }
-
-  return rs;
+  return (
+    <div className="flex items-center">
+      <div className={
+        cn(
+          "text-xs text-nowrap",
+          step === 1 ? phaseSuccess ? "text-green-600" : "text-red-600" : "",
+          step > 1 ? "text-green-600" : "",
+        )
+      }>
+        {t('deploy.progress.check')}
+      </div>
+      <Separator className={
+        cn(
+          "h-1 grow max-w-[60px]",
+          step > 1 ? "bg-green-600" : "",
+        )
+      } />
+      <div className={
+        cn(
+          "text-xs text-nowrap",
+          step < 2 ? "text-muted-foreground" : "",
+          step === 2 ? phaseSuccess ? "text-green-600" : "text-red-600" : "",
+          step > 2 ? "text-green-600" : "",
+        )
+      }>
+        {t('deploy.progress.apply')}
+      </div>
+      <Separator className={
+        cn(
+          "h-1 grow max-w-[60px]",
+          step > 2 ? "bg-green-600" : "",
+        )
+      } />
+      <div className={
+        cn(
+          "text-xs text-nowrap",
+          step < 3 ? "text-muted-foreground" : "",
+          step === 3 ? phaseSuccess ? "text-green-600" : "text-red-600" : "",
+          step > 3 ? "text-green-600" : "",
+        )
+      }>
+        {t('deploy.progress.deploy')}
+      </div>
+    </div>
+  )
 };

 export default DeployProgress;
--- a/ui/src/components/certimate/EmailsEdit.tsx
+++ b/ui/src/components/certimate/EmailsEdit.tsx
@@ -10,6 +10,7 @@ import {
 import { z } from "zod";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useForm } from "react-hook-form";
+import { useTranslation } from "react-i18next";
 import {
  Form,
  FormControl,
@@ -39,9 +40,10 @@ const EmailsEdit = ({ className, trigger }: EmailsEditProps) => {
  } = useConfig();

  const [open, setOpen] = useState(false);
+  const { t } = useTranslation();

  const formSchema = z.object({
-    email: z.string().email(),
+    email: z.string().email("email.valid.message"),
  });

  const form = useForm<z.infer<typeof formSchema>>({
@@ -54,7 +56,7 @@ const EmailsEdit = ({ className, trigger }: EmailsEditProps) => {
  const onSubmit = async (data: z.infer<typeof formSchema>) => {
    if ((emails.content as EmailsSetting).emails.includes(data.email)) {
      form.setError("email", {
-        message: "邮箱已存在",
+        message: "email.already.exist",
      });
      return;
    }
@@ -100,7 +102,7 @@ const EmailsEdit = ({ className, trigger }: EmailsEditProps) => {
      </DialogTrigger>
      <DialogContent className="sm:max-w-[600px] w-full dark:text-stone-200">
        <DialogHeader>
-          <DialogTitle>添加邮箱</DialogTitle>
+          <DialogTitle>{t('email.add')}</DialogTitle>
        </DialogHeader>

        <div className="container py-3">
@@ -118,9 +120,9 @@ const EmailsEdit = ({ className, trigger }: EmailsEditProps) => {
                name="email"
                render={({ field }) => (
                  <FormItem>
-                    <FormLabel>邮箱</FormLabel>
+                    <FormLabel>{t('email')}</FormLabel>
                    <FormControl>
-                      <Input placeholder="请输入邮箱" {...field} type="email" />
+                      <Input placeholder={t('email.not.empty.message')} {...field} type="email" />
                    </FormControl>

                    <FormMessage />
@@ -129,7 +131,7 @@ const EmailsEdit = ({ className, trigger }: EmailsEditProps) => {
              />

              <div className="flex justify-end">
-                <Button type="submit">保存</Button>
+                <Button type="submit">{t('save')}</Button>
              </div>
            </form>
          </Form>
--- a/ui/src/components/certimate/StringList.tsx
+++ b/ui/src/components/certimate/StringList.tsx
@@ -0,0 +1,245 @@
+import { cn } from "@/lib/utils";
+
+import Show from "../Show";
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { FormControl, FormLabel } from "../ui/form";
+import { Button } from "../ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "../ui/dialog";
+import { Input } from "../ui/input";
+import { z } from "zod";
+import { useTranslation } from "react-i18next";
+import { Edit, Plus, Trash2 } from "lucide-react";
+
+type StringListProps = {
+  className?: string;
+  value: string;
+  valueType?: "domain" | "ip";
+  onValueChange: (value: string) => void;
+};
+
+const titles: Record<string, string> = {
+  domain: "domain",
+  ip: "IP",
+};
+
+const StringList = ({
+  value,
+  className,
+  onValueChange,
+  valueType = "domain",
+}: StringListProps) => {
+  const [list, setList] = useState<string[]>([]);
+
+  const { t } = useTranslation();
+
+  useMemo(() => {
+    if (value) {
+      setList(value.split(";"));
+    }
+  }, [value]);
+
+  useEffect(() => {
+    const changeList = () => {
+      onValueChange(list.join(";"));
+    };
+    changeList();
+  }, [list]);
+
+  const addVal = (val: string) => {
+    if (list.includes(val)) {
+      return;
+    }
+    setList([...list, val]);
+  };
+
+  const editVal = (index: number, val: string) => {
+    const newList = [...list];
+    newList[index] = val;
+    setList(newList);
+  };
+
+  const onRemoveClick = (index: number) => {
+    const newList = [...list];
+    newList.splice(index, 1);
+    setList(newList);
+  };
+
+  return (
+    <>
+      <div className={cn(className)}>
+        <FormLabel className="flex justify-between items-center">
+          <div>{t(titles[valueType])}</div>
+
+          <Show when={list.length > 0}>
+            <StringEdit
+              op="add"
+              onValueChange={(val: string) => {
+                addVal(val);
+              }}
+              valueType={valueType}
+              value={""}
+              trigger={
+                <div className="flex items-center text-primary">
+                  <Plus size={16} className="cursor-pointer " />
+
+                  <div className="text-sm ">{t("add")}</div>
+                </div>
+              }
+            />
+          </Show>
+        </FormLabel>
+        <FormControl>
+          <Show
+            when={list.length > 0}
+            fallback={
+              <div className="border rounded-md p-3 text-sm mt-2 flex flex-col items-center">
+                <div className="text-muted-foreground">暂未添加域名</div>
+
+                <StringEdit
+                  value={""}
+                  trigger={t("add")}
+                  onValueChange={addVal}
+                  valueType={valueType}
+                />
+              </div>
+            }
+          >
+            <div className="border rounded-md p-3 text-sm mt-2 text-gray-700 space-y-2 dark:text-white dark:border-stone-700 dark:bg-stone-950">
+              {list.map((item, index) => (
+                <div key={index} className="flex justify-between items-center">
+                  <div>{item}</div>
+                  <div className="flex space-x-2">
+                    <StringEdit
+                      op="edit"
+                      valueType={valueType}
+                      trigger={
+                        <Edit
+                          size={16}
+                          className="cursor-pointer text-gray-600 dark:text-white"
+                        />
+                      }
+                      value={item}
+                      onValueChange={(val: string) => {
+                        editVal(index, val);
+                      }}
+                    />
+                    <Trash2
+                      size={16}
+                      className="cursor-pointer"
+                      onClick={() => {
+                        onRemoveClick(index);
+                      }}
+                    />
+                  </div>
+                </div>
+              ))}
+            </div>
+          </Show>
+        </FormControl>
+      </div>
+    </>
+  );
+};
+
+export default StringList;
+
+type ValueType = "domain" | "ip";
+
+type StringEditProps = {
+  value: string;
+  trigger: React.ReactNode;
+  onValueChange: (value: string) => void;
+  valueType: ValueType;
+  op?: "add" | "edit";
+};
+
+const StringEdit = ({
+  trigger,
+  value,
+  onValueChange,
+  op = "add",
+  valueType,
+}: StringEditProps) => {
+  const [currentValue, setCurrentValue] = useState<string>("");
+  const [open, setOpen] = useState<boolean>(false);
+  const [error, setError] = useState<string>("");
+  const { t } = useTranslation();
+
+  useEffect(() => {
+    setCurrentValue(value);
+  }, [value]);
+
+  const domainSchema = z
+    .string()
+    .regex(/^(?:\*\.)?([a-zA-Z0-9-]+\.)+[a-zA-Z]{2,}$/, {
+      message: t("domain.not.empty.verify.message"),
+    });
+
+  const ipSchema = z.string().ip({ message: t("ip.not.empty.verify.message") });
+
+  const schedules: Record<ValueType, z.ZodString> = {
+    domain: domainSchema,
+    ip: ipSchema,
+  };
+
+  const onSaveClick = useCallback(() => {
+    const schema = schedules[valueType];
+
+    const resp = schema.safeParse(currentValue);
+    if (!resp.success) {
+      setError(JSON.parse(resp.error.message)[0].message);
+      return;
+    }
+
+    setCurrentValue("");
+    setOpen(false);
+    setError("");
+
+    onValueChange(currentValue);
+  }, [currentValue]);
+
+  return (
+    <Dialog
+      open={open}
+      onOpenChange={(open) => {
+        setOpen(open);
+      }}
+    >
+      <DialogTrigger className="text-primary">{trigger}</DialogTrigger>
+      <DialogContent className="dark:text-white">
+        <DialogHeader>
+          <DialogTitle className="dark:text-white">
+            {t(titles[valueType])}
+          </DialogTitle>
+        </DialogHeader>
+        <Input
+          value={currentValue}
+          className="dark:text-white"
+          onChange={(e) => {
+            setCurrentValue(e.target.value);
+          }}
+        />
+        <Show when={error.length > 0}>
+          <div className="text-red-500 text-sm">{error}</div>
+        </Show>
+
+        <DialogFooter>
+          <Button
+            onClick={() => {
+              onSaveClick();
+            }}
+          >
+            {op === "add" ? t("add") : t("confirm")}
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+};
--- a/ui/src/components/certimate/Version.tsx
+++ b/ui/src/components/certimate/Version.tsx
@@ -1,9 +1,12 @@
 import { BookOpen } from "lucide-react";
+import { useTranslation } from "react-i18next";

 import { Separator } from "../ui/separator";
 import { version } from "@/domain/version";

 const Version = () => {
+  const { t } = useTranslation()
+
  return (
    <div className="fixed right-0 bottom-0 w-full flex justify-between p-5">
      <div className=""></div>
@@ -14,7 +17,7 @@ const Version = () => {
          className="flex items-center"
        >
          <BookOpen size={16} />
-          <div className="ml-1">文档</div>
+          <div className="ml-1">{t('document')}</div>
        </a>
        <Separator orientation="vertical" className="mx-2" />
        <a
--- a/ui/src/components/notify/DingTalk.tsx
+++ b/ui/src/components/notify/DingTalk.tsx
@@ -8,6 +8,7 @@ import { useEffect, useState } from "react";
 import { update } from "@/repository/settings";
 import { getErrMessage } from "@/lib/error";
 import { useToast } from "../ui/use-toast";
+import { useTranslation } from 'react-i18next'

 type DingTalkSetting = {
  id: string;
@@ -17,6 +18,7 @@ type DingTalkSetting = {

 const DingTalk = () => {
  const { config, setChannels } = useNotify();
+  const { t } = useTranslation();

  const [dingtalk, setDingtalk] = useState<DingTalkSetting>({
    id: config.id ?? "",
@@ -70,15 +72,15 @@ const DingTalk = () => {

      setChannels(resp);
      toast({
-        title: "保存成功",
-        description: "配置保存成功",
+        title: t('save.succeed'),
+        description: t('setting.notify.config.save.succeed'),
      });
    } catch (e) {
      const msg = getErrMessage(e);

      toast({
-        title: "保存失败",
-        description: "配置保存失败：" + msg,
+        title: t('save.failed'),
+        description: `${t('setting.notify.config.save.failed')}: ${msg}`,
        variant: "destructive",
      });
    }
@@ -100,7 +102,7 @@ const DingTalk = () => {
        }}
      />
      <Input
-        placeholder="加签的签名"
+        placeholder={t('access.form.ding.access.token.placeholder')}
        className="mt-2"
        value={dingtalk.data.secret}
        onChange={(e) => {
@@ -127,7 +129,7 @@ const DingTalk = () => {
            });
          }}
        />
-        <Label htmlFor="airplane-mode">是否启用</Label>
+        <Label htmlFor="airplane-mode">{t('setting.notify.config.enable')}</Label>
      </div>

      <div className="flex justify-end mt-2">
@@ -136,7 +138,7 @@ const DingTalk = () => {
            handleSaveClick();
          }}
        >
-          保存
+          {t('save')}
        </Button>
      </div>
    </div>
--- a/ui/src/components/notify/NotifyTemplate.tsx
+++ b/ui/src/components/notify/NotifyTemplate.tsx
@@ -9,6 +9,7 @@ import {
 } from "@/domain/settings";
 import { getSetting, update } from "@/repository/settings";
 import { useToast } from "../ui/use-toast";
+import { useTranslation } from 'react-i18next'

 const NotifyTemplate = () => {
  const [id, setId] = useState("");
@@ -17,6 +18,7 @@ const NotifyTemplate = () => {
  ]);

  const { toast } = useToast();
+  const { t } = useTranslation();

  useEffect(() => {
    const featchData = async () => {
@@ -66,8 +68,8 @@ const NotifyTemplate = () => {
    }

    toast({
-      title: "保存成功",
-      description: "通知模板保存成功",
+      title: t('save.succeed'),
+      description: t('setting.notify.template.save.succeed'),
    });
  };

@@ -81,7 +83,7 @@ const NotifyTemplate = () => {
      />

      <div className="text-muted-foreground text-sm mt-1">
-        可选的变量, COUNT:即将过期张数
+        {t('setting.notify.template.variables.tips.title')}
      </div>

      <Textarea
@@ -92,10 +94,10 @@ const NotifyTemplate = () => {
        }}
      ></Textarea>
      <div className="text-muted-foreground text-sm mt-1">
-        可选的变量, COUNT:即将过期张数，DOMAINS:域名列表
+        {t('setting.notify.template.variables.tips.content')}
      </div>
      <div className="flex justify-end mt-2">
-        <Button onClick={handleSaveClick}>保存</Button>
+        <Button onClick={handleSaveClick}>{t('save')}</Button>
      </div>
    </div>
  );
--- a/ui/src/components/notify/Telegram.tsx
+++ b/ui/src/components/notify/Telegram.tsx
@@ -8,6 +8,7 @@ import { useEffect, useState } from "react";
 import { update } from "@/repository/settings";
 import { getErrMessage } from "@/lib/error";
 import { useToast } from "../ui/use-toast";
+import { useTranslation } from "react-i18next";

 type TelegramSetting = {
  id: string;
@@ -17,6 +18,7 @@ type TelegramSetting = {

 const Telegram = () => {
  const { config, setChannels } = useNotify();
+  const { t } = useTranslation();

  const [telegram, setTelegram] = useState<TelegramSetting>({
    id: config.id ?? "",
@@ -70,15 +72,15 @@ const Telegram = () => {

      setChannels(resp);
      toast({
-        title: "保存成功",
-        description: "配置保存成功",
+        title: t('save.succeed'),
+        description: t('setting.notify.config.save.succeed'),
      });
    } catch (e) {
      const msg = getErrMessage(e);

      toast({
-        title: "保存失败",
-        description: "配置保存失败：" + msg,
+        title: t('save.failed'),
+        description: `${t('setting.notify.config.save.failed')}: ${msg}`,
        variant: "destructive",
      });
    }
@@ -128,7 +130,7 @@ const Telegram = () => {
            });
          }}
        />
-        <Label htmlFor="airplane-mode">是否启用</Label>
+        <Label htmlFor="airplane-mode">{t('setting.notify.config.enable')}</Label>
      </div>

      <div className="flex justify-end mt-2">
@@ -137,7 +139,7 @@ const Telegram = () => {
            handleSaveClick();
          }}
        >
-          保存
+          {t('save')}
        </Button>
      </div>
    </div>
--- a/ui/src/components/notify/Webhook.tsx
+++ b/ui/src/components/notify/Webhook.tsx
@@ -9,6 +9,7 @@ import { update } from "@/repository/settings";
 import { getErrMessage } from "@/lib/error";
 import { useToast } from "../ui/use-toast";
 import { isValidURL } from "@/lib/url";
+import { useTranslation } from 'react-i18next'

 type WebhookSetting = {
  id: string;
@@ -18,6 +19,7 @@ type WebhookSetting = {

 const Webhook = () => {
  const { config, setChannels } = useNotify();
+  const { t } = useTranslation();

  const [webhook, setWebhook] = useState<WebhookSetting>({
    id: config.id ?? "",
@@ -59,8 +61,8 @@ const Webhook = () => {
      webhook.data.url = webhook.data.url.trim();
      if (!isValidURL(webhook.data.url)) {
        toast({
-          title: "保存失败",
-          description: "Url格式不正确",
+          title: t('save.failed'),
+          description: t('setting.notify.config.save.failed.url.not.valid'),
          variant: "destructive",
        });
        return;
@@ -79,15 +81,15 @@ const Webhook = () => {

      setChannels(resp);
      toast({
-        title: "保存成功",
-        description: "配置保存成功",
+        title: t('save.succeed'),
+        description: t('setting.notify.config.save.succeed'),
      });
    } catch (e) {
      const msg = getErrMessage(e);

      toast({
-        title: "保存失败",
-        description: "配置保存失败：" + msg,
+        title: t('save.failed'),
+        description: `${t('setting.notify.config.save.failed')}: ${msg}`,
        variant: "destructive",
      });
    }
@@ -123,7 +125,7 @@ const Webhook = () => {
            });
          }}
        />
-        <Label htmlFor="airplane-mode">是否启用</Label>
+        <Label htmlFor="airplane-mode">{t('setting.notify.config.enable')}</Label>
      </div>

      <div className="flex justify-end mt-2">
@@ -132,7 +134,7 @@ const Webhook = () => {
            handleSaveClick();
          }}
        >
-          保存
+          {t('save')}
        </Button>
      </div>
    </div>
--- a/ui/src/components/ui/form.tsx
+++ b/ui/src/components/ui/form.tsx
@@ -12,6 +12,7 @@ import {

 import { cn } from "@/lib/utils"
 import { Label } from "@/components/ui/label"
+import { useTranslation } from "react-i18next"

 const Form = FormProvider

@@ -145,7 +146,9 @@ const FormMessage = React.forwardRef<
  React.HTMLAttributes<HTMLParagraphElement>
 >(({ className, children, ...props }, ref) => {
  const { error, formMessageId } = useFormField()
-  const body = error ? String(error?.message) : children
+  const { t } = useTranslation()
+
+  const body = error ? t(String(error?.message)) : children

  if (!body) {
    return null
--- a/ui/src/components/ui/pagination.tsx
+++ b/ui/src/components/ui/pagination.tsx
@@ -3,6 +3,7 @@ import { ChevronLeft, ChevronRight, MoreHorizontal } from "lucide-react";

 import { cn } from "@/lib/utils";
 import { ButtonProps, buttonVariants } from "@/components/ui/button";
+import { useTranslation } from "react-i18next";

 const Pagination = ({ className, ...props }: React.ComponentProps<"nav">) => (
  <nav
@@ -62,33 +63,41 @@ PaginationLink.displayName = "PaginationLink";
 const PaginationPrevious = ({
  className,
  ...props
-}: React.ComponentProps<typeof PaginationLink>) => (
-  <PaginationLink
-    aria-label="Go to previous page"
-    size="default"
-    className={cn("gap-1 pl-2.5", className)}
-    {...props}
-  >
-    <ChevronLeft className="h-4 w-4" />
-    <span>上一页</span>
-  </PaginationLink>
-);
+}: React.ComponentProps<typeof PaginationLink>) => {
+  const { t } = useTranslation()
+
+  return (
+    <PaginationLink
+      aria-label="Go to previous page"
+      size="default"
+      className={cn("gap-1 pl-2.5", className)}
+      {...props}
+    >
+      <ChevronLeft className="h-4 w-4" />
+      <span>{t('pagination.prev')}</span>
+    </PaginationLink>
+  )
+};
 PaginationPrevious.displayName = "PaginationPrevious";

 const PaginationNext = ({
  className,
  ...props
-}: React.ComponentProps<typeof PaginationLink>) => (
-  <PaginationLink
-    aria-label="Go to next page"
-    size="default"
-    className={cn("gap-1 pr-2.5", className)}
-    {...props}
-  >
-    <span>下一页</span>
-    <ChevronRight className="h-4 w-4" />
-  </PaginationLink>
-);
+}: React.ComponentProps<typeof PaginationLink>) => {
+  const { t } = useTranslation()
+
+  return (
+    <PaginationLink
+      aria-label="Go to next page"
+      size="default"
+      className={cn("gap-1 pr-2.5", className)}
+      {...props}
+    >
+      <span>{t('pagination.next')}</span>
+      <ChevronRight className="h-4 w-4" />
+    </PaginationLink>
+  )
+};
 PaginationNext.displayName = "PaginationNext";

 const PaginationEllipsis = ({
--- a/ui/src/domain/access.ts
+++ b/ui/src/domain/access.ts
@@ -1,14 +1,15 @@
 import { z } from "zod";

 export const accessTypeMap: Map<string, [string, string]> = new Map([
-  ["tencent", ["腾讯云", "/imgs/providers/tencent.svg"]],
-  ["aliyun", ["阿里云", "/imgs/providers/aliyun.svg"]],
-  ["cloudflare", ["Cloudflare", "/imgs/providers/cloudflare.svg"]],
-  ["namesilo", ["Namesilo", "/imgs/providers/namesilo.svg"]],
-  ["godaddy", ["GoDaddy", "/imgs/providers/godaddy.svg"]],
-  ["qiniu", ["七牛云", "/imgs/providers/qiniu.svg"]],
-  ["ssh", ["SSH部署", "/imgs/providers/ssh.svg"]],
-  ["webhook", ["Webhook", "/imgs/providers/webhook.svg"]],
+  ["tencent", ["tencent", "/imgs/providers/tencent.svg"]],
+  ["aliyun", ["aliyun", "/imgs/providers/aliyun.svg"]],
+  ["cloudflare", ["cloudflare", "/imgs/providers/cloudflare.svg"]],
+  ["namesilo", ["namesilo", "/imgs/providers/namesilo.svg"]],
+  ["godaddy", ["go.daddy", "/imgs/providers/godaddy.svg"]],
+  ["qiniu", ["qiniu", "/imgs/providers/qiniu.svg"]],
+  ["ssh", ["ssh", "/imgs/providers/ssh.svg"]],
+  ["webhook", ["webhook", "/imgs/providers/webhook.svg"]],
+  ["local", ["local.deployment", "/imgs/providers/local.svg"]],
 ]);

 export const getProviderInfo = (t: string) => {
@@ -25,8 +26,9 @@ export const accessFormType = z.union(
    z.literal("qiniu"),
    z.literal("namesilo"),
    z.literal("godaddy"),
+    z.literal("local"),
  ],
-  { message: "请选择云服务商" }
+  { message: "access.not.empty" }
 );

 type AccessUsage = "apply" | "deploy" | "all";
@@ -45,7 +47,8 @@ export type Access = {
    | CloudflareConfig
    | QiniuConfig
    | NamesiloConfig
-    | GodaddyConfig;
+    | GodaddyConfig
+    | LocalConfig;

  deleted?: string;
  created?: string;
@@ -86,6 +89,7 @@ export type GodaddyConfig = {
 export type SSHConfig = {
  host: string;
  port: string;
+  preCommand?: string;
  command: string;
  username: string;
  password?: string;
@@ -95,6 +99,12 @@ export type SSHConfig = {
  keyPath: string;
 };

+export type LocalConfig = {
+  command: string;
+  certPath: string;
+  keyPath: string;
+};
+
 export const getUsageByConfigType = (configType: string): AccessUsage => {
  switch (configType) {
    case "aliyun":
@@ -103,6 +113,7 @@ export const getUsageByConfigType = (configType: string): AccessUsage => {
    case "ssh":
    case "webhook":
    case "qiniu":
+    case "local":
      return "deploy";

    case "cloudflare":
--- a/ui/src/domain/domain.ts
+++ b/ui/src/domain/domain.ts
@@ -26,6 +26,22 @@ export type Domain = {
  expand?: {
    lastDeployment?: Deployment;
  };
+
+  applyConfig?: ApplyConfig;
+  deployConfig?: DeployConfig[];
+};
+
+export type DeployConfig = {
+  access: string;
+  type: string;
+  config?: Record<string, string>;
+};
+
+export type ApplyConfig = {
+  access: string;
+  email: string;
+  timeout?: number;
+  nameservers?: string;
 };

 export type Statistic = {
@@ -40,13 +56,14 @@ export const getLastDeployment = (domain: Domain): Deployment | undefined => {
 };

 export const targetTypeMap: Map<string, [string, string]> = new Map([
-  ["aliyun-cdn", ["阿里云-CDN", "/imgs/providers/aliyun.svg"]],
-  ["aliyun-oss", ["阿里云-OSS", "/imgs/providers/aliyun.svg"]],
-  ["aliyun-dcdn", ["阿里云-DCDN", "/imgs/providers/aliyun.svg"]],
-  ["tencent-cdn", ["腾讯云-CDN", "/imgs/providers/tencent.svg"]],
-  ["ssh", ["SSH部署", "/imgs/providers/ssh.svg"]],
-  ["qiniu-cdn", ["七牛云-CDN", "/imgs/providers/qiniu.svg"]],
-  ["webhook", ["Webhook", "/imgs/providers/webhook.svg"]],
+  ["aliyun-cdn", ["aliyun.cdn", "/imgs/providers/aliyun.svg"]],
+  ["aliyun-oss", ["aliyun.oss", "/imgs/providers/aliyun.svg"]],
+  ["aliyun-dcdn", ["aliyun.dcdn", "/imgs/providers/aliyun.svg"]],
+  ["tencent-cdn", ["tencent.cdn", "/imgs/providers/tencent.svg"]],
+  ["ssh", ["ssh", "/imgs/providers/ssh.svg"]],
+  ["qiniu-cdn", ["qiniu.cdn", "/imgs/providers/qiniu.svg"]],
+  ["webhook", ["webhook", "/imgs/providers/webhook.svg"]],
+  ["local", ["local.deployment", "/imgs/providers/local.svg"]],
 ]);

 export const targetTypeKeys = Array.from(targetTypeMap.keys());
--- a/ui/src/domain/settings.ts
+++ b/ui/src/domain/settings.ts
@@ -1,7 +1,11 @@
 export type Setting = {
  id?: string;
  name?: string;
-  content?: EmailsSetting | NotifyTemplates | NotifyChannels;
+  content?:
+    | EmailsSetting
+    | NotifyTemplates
+    | NotifyChannels
+    | SSLProviderSetting;
 };

 export type EmailsSetting = {
@@ -49,3 +53,14 @@ export const defaultNotifyTemplate: NotifyTemplate = {
  title: "您有{COUNT}张证书即将过期",
  content: "有{COUNT}张证书即将过期,域名分别为{DOMAINS},请保持关注！",
 };
+
+export type SSLProvider = "letsencrypt" | "zerossl";
+
+export type SSLProviderSetting = {
+  provider: SSLProvider;
+  config: {
+    [key: string]: {
+      [key: string]: string;
+    };
+  };
+};
--- a/ui/src/domain/version.ts
+++ b/ui/src/domain/version.ts
@@ -1 +1 @@
-export const version = "Certimate v0.1.11";
+export const version = "Certimate v0.1.17";
--- a/ui/src/i18n/index.ts
+++ b/ui/src/i18n/index.ts
@@ -0,0 +1,22 @@
+import i18n from 'i18next';
+import { initReactI18next } from 'react-i18next';
+import LanguageDetector from 'i18next-browser-languagedetector';
+
+import resources from './locales'
+
+i18n
+    .use(LanguageDetector)
+    .use(initReactI18next)
+    .init({
+        resources,
+        fallbackLng: 'zh',
+        debug: true,
+        interpolation: {
+            escapeValue: false,
+        },
+        backend: {
+            loadPath: '/locales/{{lng}}.json',
+        }
+    });
+
+export default i18n;
--- a/ui/src/i18n/locales/en.json
+++ b/ui/src/i18n/locales/en.json
@@ -0,0 +1,216 @@
+{
+  "ca": "Certificate Authority",
+  "username": "Username",
+  "username.not.empty": "Please enter username",
+  "password": "Password",
+  "password.not.empty": "Please enter password",
+  "email": "Email",
+  "logout": "Logout",
+  "setting": "Settings",
+  "account": "Account",
+  "template": "Template",
+  "save": "Save",
+  "no.data": "No data available",
+  "status": "Status",
+  "operation": "Operation",
+  "enable": "Enable",
+  "disable": "Disable",
+  "deploy": "Deploy",
+  "download": "Download",
+  "delete": "Delete",
+  "cancel": "Cancel",
+  "confirm": "Confirm",
+  "edit": "Edit",
+  "copy": "Copy",
+  "succeed": "Successful",
+  "add": "Add",
+  "document": "Document",
+  "variables": "Variables",
+  "dns": "Domain Name Server",
+  "name": "Name",
+  "create.time": "CreateTime",
+  "update.time": "UpdateTime",
+  "created.in": "Created in",
+  "updated.in": "Updated in",
+  "basic.setting": "Basic Settings",
+  "advanced.setting": "Advanced Settings",
+  "operation.succeed": "Operation Successful",
+  "save.succeed": "Save Successful",
+  "save.failed": "Save Failed",
+  "update.succeed": "Update Successful",
+  "update.failed": "Update Failed",
+  "delete.failed": "Delete Failed",
+  "ding.talk": "Ding Talk",
+  "telegram": "Telegram",
+  "webhook": "Webhook",
+  "local.deployment": "Local Deployment",
+  "tencent": "Tencent",
+  "tencent.cdn": "Tencent-CDN",
+  "aliyun": "Alibaba Cloud",
+  "aliyun.cdn": "Alibaba Cloud-CDN",
+  "aliyun.oss": "Alibaba Cloud-OSS",
+  "aliyun.dcdn": "Alibaba Cloud-DCDN",
+  "qiniu": "Qiniu",
+  "qiniu.cdn": "Qiniu-CDN",
+  "cloudflare": "Cloudflare",
+  "namesilo": "Namesilo",
+  "go.daddy": "GoDaddy",
+  "ssh": "SSH Deployment",
+  "zod.rule.string.max": "Please enter no more than {{max}} characters",
+  "zod.rule.url": "Please enter a valid URL",
+  "zod.rule.ssh.host": "Please enter the correct domain name or IP",
+  "login.submit": "Log In",
+  "login.username.no.empty.message": "Please enter a valid email address",
+  "login.password.length.message": "Password should be at least 10 characters",
+  "menu.auth.management": "Authorization Management",
+  "theme.light": "Light",
+  "theme.dark": "Dark",
+  "theme.system": "System",
+  "dashboard": "Dashboard",
+  "dashboard.all": "All",
+  "dashboard.near.expired": "About to Expire",
+  "dashboard.enabled": "Enabled",
+  "dashboard.not.enabled": "Not Enabled",
+  "dashboard.unit": "Unit",
+  "deployment.log.name": "Deployment History",
+  "deployment.log.empty": "You have not created any deployments yet, please add a domain to start deployment!",
+  "deployment.log.status": "Status",
+  "deployment.log.stage": "Stage",
+  "deployment.log.last.execution.time": "Last Execution Time",
+  "deployment.log.detail.button.text": "Log",
+  "deployment.log.detail": "Deployment Details",
+  "pagination.next": "Next",
+  "pagination.prev": "Previous",
+  "domain": "Domain",
+  "domain.add": "Add Domain",
+  "domain.edit":"Edit Domain",
+  "domain.delete": "Delete Domain",
+  "domain.not.empty.verify.message": "Please enter domain",
+  "domain.management.name": "Domain List",
+  "domain.management.start.deploy.succeed.tips": "Deployment initiated, please check the deployment log later.",
+  "domain.management.execution.failed": "Execution Failed",
+  "domain.management.execution.failed.tips": "Execution failed, please check the details in <1>Deployment History</1>.",
+  "domain.management.empty": "Please add a domain to start deploying the certificate.",
+  "domain.management.expiry.date": "Validity Period",
+  "domain.management.expiry.date1": "Valid for {{date}} days",
+  "domain.management.expiry.date2": "Expiry on {{date}}",
+  "domain.management.last.execution.time": "Last Execution Time",
+  "domain.management.last.execution.status": "Last Execution Status",
+  "domain.management.last.execution.stage": "Last Execution Stage",
+  "domain.management.enable": "Enable",
+  "domain.management.start.deploying": "Deploy Now",
+  "domain.management.forced.deployment": "Force Deployment",
+  "domain.management.delete.confirm": "Are you sure you want to delete this domain?",
+  "domain.management.edit.title": "Edit Domain",
+  "domain.management.edit.dns.access.label": "DNS Provider Authorization Configuration",
+  "domain.management.edit.dns.access.not.empty.message": "Please select DNS provider authorization configuration",
+  "domain.management.edit.access.label": "Provider Authorization Configuration",
+  "domain.management.edit.access.not.empty.message": "Please select authorization configuration",
+  "domain.management.edit.target.type": "Deployment Service Type",
+  "domain.management.edit.target.type.not.empty.message": "Please select deployment service type",
+  "domain.management.edit.succeed.tips": "Successful domain editing",
+  "domain.management.edit.target.access": "Deployment Service Provider Authorization Configuration",
+  "domain.management.edit.target.access.content.label": "Provider Authorization Configuration",
+  "domain.management.edit.target.access.not.empty.message": "Please select authorization configuration",
+  "domain.management.edit.target.access.verify.msg": "At least one of the deployment authorization and deployment authorization group must be selected",
+  "domain.management.edit.group.label": "Deployment Configuration Group (used to deploy a domain certificate to multiple ssh hosts)",
+  "domain.management.edit.group.not.empty.message": "Please select group",
+  "domain.management.edit.email.not.empty.message": "Please select email",
+  "domain.management.edit.email.description": "(A email is required to apply for a certificate)",
+  "domain.management.edit.variables.placeholder": "It can be used in SSH deployment, like:\nkey=val;\nkey2=val2;",
+  "domain.management.edit.dns.placeholder": "Custom domain name server, separates multiple entries with semicolon, like:\n8.8.8.8;\n8.8.4.4;",
+  "domain.management.add.succeed.tips": "Domain added successfully",
+  "email.add": "Add Email",
+  "email.list": "Email List",
+  "email.valid.message": "Please enter a valid email address",
+  "email.already.exist": "Email already exists",
+  "email.not.empty.message": "Please enter email",
+  "setting.notify.menu": "Notification Push",
+  "setting.submit": "Confirm Changes",
+  "setting.account.email.valid.message": "Please enter a valid email address",
+  "setting.account.email.placeholder": "Please enter email",
+  "setting.account.email.change.succeed": "Account email altered successfully",
+  "setting.account.email.change.failed": "Account email alteration failed",
+  "setting.account.log.back.in": "Please login again",
+  "setting.password.length.message": "Password should be at least 10 characters",
+  "setting.password.not.match": "Passwords do not match",
+  "setting.password.change.succeed": "Password changed successfully",
+  "setting.password.change.failed": "Password change failed",
+  "setting.password.current.password": "Current Password",
+  "setting.password.new.password": "New Password",
+  "setting.password.confirm.password": "Confirm Password",
+  "setting.notify.template.save.succeed": "Notification template saved successfully",
+  "setting.notify.template.variables.tips.title": "Optional variables, COUNT: number of expiring soon",
+  "setting.notify.template.variables.tips.content": "Optional variables, COUNT: number of expiring soon, DOMAINS: Domain list",
+  "setting.notify.config.enable": "Enable",
+  "setting.notify.config.save.succeed": "Configuration saved successfully",
+  "setting.notify.config.save.failed": "Configuration save failed",
+  "setting.notify.config.save.failed.url.not.valid": "Invalid Url format",
+  "setting.ca.not.empty": "Please select a Certificate Authority",
+  "setting.ca.eab_kid.not.empty": "Please enter EAB_KID",
+  "setting.ca.eab_hmac_key.not.empty": "Please enter EAB_HMAC_KEY.",
+  "setting.ca.eab_kid_hmac_key.not.empty": "Please enter EAB_KID and EAB_HMAC_KEY",
+  "deploy.progress.check": "Check",
+  "deploy.progress.apply": "Apply",
+  "deploy.progress.deploy": "Deploy",
+  "access.management": "Authorization Management",
+  "access.add": "Add Authorization",
+  "access.edit": "Edit Authorization",
+  "access.copy": "Copy Authorization",
+  "access.delete.confirm": "Are you sure you want to delete the deployment authorization?",
+  "access.all": "All Authorizations",
+  "access.list": "Authorization List",
+  "access.type": "Provider",
+  "access.type.not.empty": "Please select a provider",
+  "access.not.empty": "Please select a cloud provider",
+  "access.empty": "Please add authorization to start deploying certificate.",
+  "access.group.management": "Authorization Group Management",
+  "access.group.add": "Add Authorization Group",
+  "access.group.not.empty": "Please select a group",
+  "access.group.name": "Group Name",
+  "access.group.name.not.empty": "Please enter group name",
+  "access.group.delete": "Delete Group",
+  "access.group.delete.confirm": "Are you sure you want to delete the deployment authorization group?",
+  "access.group.domain.empty": "Please add a domain to start deploying the certificate.",
+  "access.group.empty": "No deployment authorization configuration yet, please add after starting use.",
+  "access.group.total": "Totally {{total}} deployment authorization configuration",
+  "access.form.name.not.empty": "Please enter authorization name",
+  "access.form.config.field": "Configuration Type",
+  "access.form.access.key.id": "AccessKeyId",
+  "access.form.access.key.id.not.empty": "Please enter AccessKeyId",
+  "access.form.access.key.secret": "AccessKeySecret",
+  "access.form.access.key.secret.not.empty": "Please enter AccessKeySecret",
+  "access.form.cloud.dns.api.token": "CLOUD_DNS_API_TOKEN",
+  "access.form.cloud.dns.api.token.not.empty": "Please enter CLOUD_DNS_API_TOKEN",
+  "access.form.go.daddy.api.key": "GO_DADDY_API_KEY",
+  "access.form.go.daddy.api.key.not.empty": "Please enter GO_DADDY_API_KEY",
+  "access.form.go.daddy.api.secret": "GO_DADDY_API_SECRET",
+  "access.form.go.daddy.api.secret.not.empty": "Please enter GO_DADDY_API_SECRET",
+  "access.form.namesilo.api.key": "NAMESILO_API_KEY",
+  "access.form.namesilo.api.key.not.empty": "Please enter NAMESILO_API_KEY",
+  "access.form.secret.id": "SecretId",
+  "access.form.secret.id.not.empty": "Please enter SecretId",
+  "access.form.secret.key": "SecretKey",
+  "access.form.secret.key.not.empty": "Please enter SecretKey",
+  "access.form.access.key": "AccessKey",
+  "access.form.access.key.not.empty": "Please enter AccessKey",
+  "access.form.webhook.url": "Webhook URL",
+  "access.form.webhook.url.not.empty": "Please enter Webhook URL",
+  "access.form.ssh.group.label": "Authorization Configuration Group (used to deploy a single domain certificate to multiple SSH hosts)",
+  "access.form.ssh.host": "Server Host",
+  "access.form.ssh.host.not.empty": "Please enter Host",
+  "access.form.ssh.port": "SSH Port",
+  "access.form.ssh.port.not.empty": "Please enter Port",
+  "access.form.ssh.key": "Key (Log in using certificate)",
+  "access.form.ssh.key.not.empty": "Please enter Key",
+  "access.form.ssh.key.file.not.empty": "Please select file",
+  "access.form.ssh.cert.path": "Certificate Save Path",
+  "access.form.ssh.cert.path.not.empty": "Please enter certificate save path",
+  "access.form.ssh.key.path": "Private Key Save Path",
+  "access.form.ssh.key.path.not.empty": "Please enter private key save path",
+  "access.form.ssh.pre.command": "Pre-deployment Command",
+  "access.form.ssh.pre.command.not.empty": "Command to be executed before deploying the certificate",
+  "access.form.ssh.command": "Command",
+  "access.form.ssh.command.not.empty": "Please enter command",
+  "access.form.ding.access.token.placeholder": "Signature for signed addition"
+}
--- a/ui/src/i18n/locales/index.ts
+++ b/ui/src/i18n/locales/index.ts
@@ -0,0 +1,17 @@
+import { Resource } from 'i18next'
+
+import zh from './zh.json'
+import en from './en.json'
+
+const resources: Resource = {
+    zh: {
+        name: '简体中文',
+        translation: zh
+    },
+    en: {
+        name: 'English',
+        translation: en
+    }
+}
+
+export default resources;
--- a/ui/src/i18n/locales/zh.json
+++ b/ui/src/i18n/locales/zh.json
@@ -0,0 +1,216 @@
+{
+  "ca": "证书颁发机构",
+  "username": "用户名",
+  "username.not.empty": "请输入用户名",
+  "password": "密码",
+  "password.not.empty": "请输入密码",
+  "email": "邮箱",
+  "logout": "退出登录",
+  "setting": "设置",
+  "account": "账户",
+  "template": "模版",
+  "save": "保存",
+  "no.data": "暂无数据",
+  "status": "状态",
+  "operation": "操作",
+  "enable": "启用",
+  "disable": "禁用",
+  "deploy": "部署",
+  "download": "下载",
+  "delete": "删除",
+  "cancel": "取消",
+  "confirm": "确认",
+  "edit": "编辑",
+  "copy": "复制",
+  "succeed": "成功",
+  "add": "新增",
+  "document": "文档",
+  "variables": "变量",
+  "dns": "域名服务器",
+  "name": "名称",
+  "create.time": "创建时间",
+  "update.time": "更新时间",
+  "created.in": "创建于",
+  "updated.in": "更新于",
+  "basic.setting": "基础设置",
+  "advanced.setting": "高级设置",
+  "operation.succeed": "操作成功",
+  "save.succeed": "保存成功",
+  "save.failed": "保存失败",
+  "update.succeed": "修改成功",
+  "update.failed": "修改失败",
+  "delete.failed": "删除失败",
+  "ding.talk": "钉钉",
+  "telegram": "Telegram",
+  "webhook": "Webhook",
+  "local.deployment": "本地部署",
+  "tencent": "腾讯云",
+  "tencent.cdn": "腾讯云-CDN",
+  "aliyun": "阿里云",
+  "aliyun.cdn": "阿里云-CDN",
+  "aliyun.oss": "阿里云-OSS",
+  "aliyun.dcdn": "阿里云-DCDN",
+  "qiniu": "七牛云",
+  "qiniu.cdn": "七牛云-CDN",
+  "cloudflare": "Cloudflare",
+  "namesilo": "Namesilo",
+  "go.daddy": "GoDaddy",
+  "ssh": "SSH 部署",
+  "zod.rule.string.max": "请输入不超过 {{max}} 个字符",
+  "zod.rule.url": "请输入有效的 url 地址",
+  "zod.rule.ssh.host": "请输入正确的域名或IP",
+  "login.submit": "登录",
+  "login.username.no.empty.message": "请输入正确的邮箱地址",
+  "login.password.length.message": "密码至少10个字符",
+  "menu.auth.management": "授权管理",
+  "theme.light": "浅色",
+  "theme.dark": "暗黑",
+  "theme.system": "系统",
+  "dashboard": "控制面板",
+  "dashboard.all": "所有",
+  "dashboard.near.expired": "即将过期",
+  "dashboard.enabled": "启用中",
+  "dashboard.not.enabled": "未启用",
+  "dashboard.unit": "个",
+  "deployment.log.name": "部署历史",
+  "deployment.log.empty": "你暂未创建任何部署，请先添加域名进行部署吧！",
+  "deployment.log.status": "状态",
+  "deployment.log.stage": "阶段",
+  "deployment.log.last.execution.time": "最近执行时间",
+  "deployment.log.detail.button.text": "日志",
+  "deployment.log.detail": "部署详情",
+  "pagination.next": "下一页",
+  "pagination.prev": "上一页",
+  "domain": "域名",
+  "domain.add": "新增域名",
+  "domain.edit": "编辑域名",
+  "domain.delete": "删除域名",
+  "domain.not.empty.verify.message": "请输入域名",
+  "domain.management.name": "域名列表",
+  "domain.management.start.deploy.succeed.tips": "已发起部署，请稍后查看部署日志。",
+  "domain.management.execution.failed": "执行失败",
+  "domain.management.execution.failed.tips": "执行失败，请在 <1>部署历史</1> 查看详情。",
+  "domain.management.empty": "请添加域名开始部署证书吧。",
+  "domain.management.expiry.date": "有效期限",
+  "domain.management.expiry.date1": "有效期 {{date}} 天",
+  "domain.management.expiry.date2": "{{date}} 到期",
+  "domain.management.last.execution.time": "最近执行时间",
+  "domain.management.last.execution.status": "最近执行状态",
+  "domain.management.last.execution.stage": "最近执行阶段",
+  "domain.management.enable": "是否启用",
+  "domain.management.start.deploying": "立即部署",
+  "domain.management.forced.deployment": "强行部署",
+  "domain.management.delete.confirm": "确定要删除域名吗？",
+  "domain.management.edit.title": "编辑域名",
+  "domain.management.edit.dns.access.label": "DNS 服务商授权配置",
+  "domain.management.edit.dns.access.not.empty.message": "请选择DNS服务商授权配置",
+  "domain.management.edit.access.label": "服务商授权配置",
+  "domain.management.edit.access.not.empty.message": "请选择授权配置",
+  "domain.management.edit.target.type": "部署服务类型",
+  "domain.management.edit.target.type.not.empty.message": "请选择部署服务类型",
+  "domain.management.edit.succeed.tips": "域名编辑成功",
+  "domain.management.edit.target.access": "部署服务商授权配置",
+  "domain.management.edit.target.access.content.label": "服务商授权配置",
+  "domain.management.edit.target.access.not.empty.message": "请选择授权配置",
+  "domain.management.edit.target.access.verify.msg": "部署授权和部署授权组至少选一个",
+  "domain.management.edit.group.label": "部署配置组（用于将一个域名证书部署到多个 ssh 主机）",
+  "domain.management.edit.group.not.empty.message": "请选择分组",
+  "domain.management.edit.email.not.empty.message": "请选择邮箱",
+  "domain.management.edit.email.description": "（申请证书需要提供邮箱）",
+  "domain.management.edit.variables.placeholder": "可在SSH部署中使用,形如:\nkey=val;\nkey2=val2;",
+  "domain.management.edit.dns.placeholder": "自定义域名服务器,多个用分号隔开,如:\n8.8.8.8;\n8.8.4.4;",
+  "domain.management.add.succeed.tips": "域名添加成功",
+  "email.add": "添加邮箱",
+  "email.list": "邮箱列表",
+  "email.valid.message": "请输入正确的邮箱地址",
+  "email.already.exist": "邮箱已存在",
+  "email.not.empty.message": "请输入邮箱",
+  "setting.notify.menu": "消息推送",
+  "setting.submit": "确认修改",
+  "setting.account.email.valid.message": "请输入正确的邮箱地址",
+  "setting.account.email.placeholder": "请输入邮箱",
+  "setting.account.email.change.succeed": "修改账户邮箱成功",
+  "setting.account.email.change.failed": "修改账户邮箱失败",
+  "setting.account.log.back.in": "请重新登录",
+  "setting.password.length.message": "密码至少10个字符",
+  "setting.password.not.match": "两次密码不一致",
+  "setting.password.change.succeed": "修改密码成功",
+  "setting.password.change.failed": "修改密码失败",
+  "setting.password.current.password": "当前密码",
+  "setting.password.new.password": "新密码",
+  "setting.password.confirm.password": "确认密码",
+  "setting.notify.template.save.succeed": "通知模板保存成功",
+  "setting.notify.template.variables.tips.title": "可选的变量, COUNT:即将过期张数",
+  "setting.notify.template.variables.tips.content": "可选的变量, COUNT:即将过期张数，DOMAINS:域名列表",
+  "setting.notify.config.enable": "是否启用",
+  "setting.notify.config.save.succeed": "配置保存成功",
+  "setting.notify.config.save.failed": "配置保存失败",
+  "setting.notify.config.save.failed.url.not.valid": "Url格式不正确",
+  "setting.ca.not.empty": "请选择证书分发机构",
+  "setting.ca.eab_kid.not.empty": "请输入EAB_KID",
+  "setting.ca.eab_hmac_key.not.empty": "请输入EAB_HMAC_KEY",
+  "setting.ca.eab_kid_hmac_key.not.empty": "请输入EAB_KID和EAB_HMAC_KEY",
+  "deploy.progress.check": "检查",
+  "deploy.progress.apply": "获取",
+  "deploy.progress.deploy": "部署",
+  "access.management": "授权管理",
+  "access.add": "添加授权",
+  "access.edit": "编辑授权",
+  "access.copy": "复制授权",
+  "access.delete.confirm": "确定要删除授权吗？",
+  "access.all": "所有授权",
+  "access.list": "授权列表",
+  "access.type": "服务商",
+  "access.type.not.empty": "请选择服务商",
+  "access.not.empty": "请选择云服务商",
+  "access.empty": "请添加授权开始部署证书吧。",
+  "access.group.management": "授权组管理",
+  "access.group.add": "添加授权组",
+  "access.group.not.empty": "请选择分组",
+  "access.group.name": "组名",
+  "access.group.name.not.empty": "请输入组名",
+  "access.group.delete": "删除组",
+  "access.group.delete.confirm": "确定要删除部署授权组吗？",
+  "access.group.domain.empty": "请添加域名开始部署证书吧。",
+  "access.group.empty": "暂无部署授权配置，请添加后开始使用吧",
+  "access.group.total": "共有 {{total}} 个部署授权配置",
+  "access.form.name.not.empty": "请输入授权名称",
+  "access.form.config.field": "配置类型",
+  "access.form.access.key.id": "AccessKeyId",
+  "access.form.access.key.id.not.empty": "请输入 AccessKeyId",
+  "access.form.access.key.secret": "AccessKeySecret",
+  "access.form.access.key.secret.not.empty": "请输入 AccessKeySecret",
+  "access.form.cloud.dns.api.token": "CLOUD_DNS_API_TOKEN",
+  "access.form.cloud.dns.api.token.not.empty": "请输入 CLOUD_DNS_API_TOKEN",
+  "access.form.go.daddy.api.key": "GO_DADDY_API_KEY",
+  "access.form.go.daddy.api.key.not.empty": "请输入 GO_DADDY_API_KEY",
+  "access.form.go.daddy.api.secret": "GO_DADDY_API_SECRET",
+  "access.form.go.daddy.api.secret.not.empty": "请输入 GO_DADDY_API_SECRET",
+  "access.form.namesilo.api.key": "NAMESILO_API_KEY",
+  "access.form.namesilo.api.key.not.empty": "请输入 NAMESILO_API_KEY",
+  "access.form.secret.id": "SecretId",
+  "access.form.secret.id.not.empty": "请输入 SecretId",
+  "access.form.secret.key": "SecretKey",
+  "access.form.secret.key.not.empty": "请输入 SecretKey",
+  "access.form.access.key": "AccessKey",
+  "access.form.access.key.not.empty": "请输入 AccessKey",
+  "access.form.webhook.url": "Webhook URL",
+  "access.form.webhook.url.not.empty": "请输入 Webhook URL",
+  "access.form.ssh.group.label": "授权配置组（用于将一个域名证书部署到多个 ssh 主机）",
+  "access.form.ssh.host": "服务器 Host",
+  "access.form.ssh.host.not.empty": "请输入 Host",
+  "access.form.ssh.port": "SSH 端口",
+  "access.form.ssh.port.not.empty": "请输入 Port",
+  "access.form.ssh.key": "Key（使用证书登录）",
+  "access.form.ssh.key.not.empty": "请输入 Key",
+  "access.form.ssh.key.file.not.empty": "请选择文件",
+  "access.form.ssh.cert.path": "证书保存路径",
+  "access.form.ssh.cert.path.not.empty": "请输入证书保存路径",
+  "access.form.ssh.key.path": "私钥保存路径",
+  "access.form.ssh.key.path.not.empty": "请输入私钥保存路径",
+  "access.form.ssh.pre.command": "前置 Command",
+  "access.form.ssh.pre.command.not.empty": "在部署证书前执行的前置命令",
+  "access.form.ssh.command": "Command",
+  "access.form.ssh.command.not.empty": "请输入要执行的命令",
+  "access.form.ding.access.token.placeholder": "加签的签名"
+}
--- a/ui/src/main.tsx
+++ b/ui/src/main.tsx
@@ -4,6 +4,7 @@ import "./global.css";
 import { RouterProvider } from "react-router-dom";
 import { router } from "./router.tsx";
 import { ThemeProvider } from "./components/ThemeProvider.tsx";
+import "@/i18n";

 ReactDOM.createRoot(document.getElementById("root")!).render(
  <React.StrictMode>
--- a/ui/src/pages/DashboardLayout.tsx
+++ b/ui/src/pages/DashboardLayout.tsx
@@ -6,6 +6,7 @@ import {
  useNavigate,
 } from "react-router-dom";
 import { CircleUser, Earth, History, Home, Menu, Server } from "lucide-react";
+import { useTranslation } from "react-i18next";

 import { Button } from "@/components/ui/button";

@@ -22,12 +23,14 @@ import { cn } from "@/lib/utils";
 import { ConfigProvider } from "@/providers/config";
 import { getPb } from "@/repository/api";
 import { ThemeToggle } from "@/components/ThemeToggle";
+import LocaleToggle from "@/components/LocaleToggle";

 import Version from "@/components/certimate/Version";

 export default function Dashboard() {
  const navigate = useNavigate();
  const location = useLocation();
+  const { t } = useTranslation()

  if (!getPb().authStore.isValid || !getPb().authStore.isAdmin) {
    return <Navigate to="/login" />;
@@ -70,7 +73,7 @@ export default function Dashboard() {
                    )}
                  >
                    <Home className="h-4 w-4" />
-                    控制面板
+                    {t('dashboard')}
                  </Link>
                  <Link
                    to="/domains"
@@ -80,7 +83,7 @@ export default function Dashboard() {
                    )}
                  >
                    <Earth className="h-4 w-4" />
-                    域名列表
+                    {t('domain.management.name')}
                  </Link>
                  <Link
                    to="/access"
@@ -90,7 +93,7 @@ export default function Dashboard() {
                    )}
                  >
                    <Server className="h-4 w-4" />
-                    授权管理
+                    {t('menu.auth.management')}
                  </Link>

                  <Link
@@ -101,7 +104,7 @@ export default function Dashboard() {
                    )}
                  >
                    <History className="h-4 w-4" />
-                    部署历史
+                    {t('deployment.log.name')}
                  </Link>
                </nav>
              </div>
@@ -138,7 +141,7 @@ export default function Dashboard() {
                      )}
                    >
                      <Home className="h-5 w-5" />
-                      控制面板
+                      {t('dashboard')}
                    </Link>
                    <Link
                      to="/domains"
@@ -148,7 +151,7 @@ export default function Dashboard() {
                      )}
                    >
                      <Earth className="h-5 w-5" />
-                      域名列表
+                      {t('domain.management.name')}
                    </Link>
                    <Link
                      to="/access"
@@ -158,7 +161,7 @@ export default function Dashboard() {
                      )}
                    >
                      <Server className="h-5 w-5" />
-                      授权管理
+                      {t('menu.auth.management')}
                    </Link>

                    <Link
@@ -169,13 +172,14 @@ export default function Dashboard() {
                      )}
                    >
                      <History className="h-5 w-5" />
-                      部署历史
+                      {t('deployment.log.name')}
                    </Link>
                  </nav>
                </SheetContent>
              </Sheet>
              <div className="w-full flex-1"></div>
              <ThemeToggle />
+              <LocaleToggle />
              <DropdownMenu>
                <DropdownMenuTrigger asChild>
                  <Button
@@ -188,15 +192,15 @@ export default function Dashboard() {
                  </Button>
                </DropdownMenuTrigger>
                <DropdownMenuContent align="end">
-                  <DropdownMenuLabel>账户</DropdownMenuLabel>
+                  <DropdownMenuLabel>{t('account')}</DropdownMenuLabel>
                  <DropdownMenuSeparator />

                  <DropdownMenuItem onClick={handleSettingClick}>
-                    偏好设置
+                    {t('setting')}
                  </DropdownMenuItem>

                  <DropdownMenuItem onClick={handleLogoutClick}>
-                    退出
+                    {t('logout')}
                  </DropdownMenuItem>
                </DropdownMenuContent>
              </DropdownMenu>
--- a/ui/src/pages/SettingLayout.tsx
+++ b/ui/src/pages/SettingLayout.tsx
@@ -1,14 +1,16 @@
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { Toaster } from "@/components/ui/toaster";
-import { KeyRound, Megaphone, UserRound } from "lucide-react";
+import { KeyRound, Megaphone, ShieldCheck, UserRound } from "lucide-react";
 import { useEffect, useState } from "react";

 import { Outlet, useLocation, useNavigate } from "react-router-dom";
+import { useTranslation } from "react-i18next";

 const SettingLayout = () => {
  const location = useLocation();
  const [tabValue, setTabValue] = useState("account");
  const navigate = useNavigate();
+  const { t } = useTranslation();

  useEffect(() => {
    const pathname = location.pathname;
@@ -20,7 +22,7 @@ const SettingLayout = () => {
    <div>
      <Toaster />
      <div className="text-muted-foreground border-b dark:border-stone-500 py-5">
-        偏好设置
+        {t("setting")}
      </div>
      <div className="w-full mt-5 p-0 md:p-3 flex justify-center">
        <Tabs defaultValue="account" className="w-full" value={tabValue}>
@@ -33,7 +35,7 @@ const SettingLayout = () => {
              className="px-5"
            >
              <UserRound size={14} />
-              <div className="ml-1">账户</div>
+              <div className="ml-1">{t("account")}</div>
            </TabsTrigger>
            <TabsTrigger
              value="password"
@@ -43,7 +45,7 @@ const SettingLayout = () => {
              className="px-5"
            >
              <KeyRound size={14} />
-              <div className="ml-1">密码</div>
+              <div className="ml-1">{t("password")}</div>
            </TabsTrigger>

            <TabsTrigger
@@ -54,7 +56,17 @@ const SettingLayout = () => {
              className="px-5"
            >
              <Megaphone size={14} />
-              <div className="ml-1">消息推送</div>
+              <div className="ml-1">{t("setting.notify.menu")}</div>
+            </TabsTrigger>
+            <TabsTrigger
+              value="ssl-provider"
+              onClick={() => {
+                navigate("/setting/ssl-provider");
+              }}
+              className="px-5"
+            >
+              <ShieldCheck size={14} />
+              <div className="ml-1">{t("ca")}</div>
            </TabsTrigger>
          </TabsList>
          <TabsContent value={tabValue}>
--- a/ui/src/pages/access/Access.tsx
+++ b/ui/src/pages/access/Access.tsx
@@ -9,8 +9,18 @@ import { Access as AccessType, accessTypeMap } from "@/domain/access";
 import { convertZulu2Beijing } from "@/lib/time";
 import { useConfig } from "@/providers/config";
 import { remove } from "@/repository/access";
+import { t } from "i18next";
 import { Key } from "lucide-react";
 import { useLocation, useNavigate } from "react-router-dom";
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent, AlertDialogDescription, AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+  AlertDialogTrigger
+} from "@/components/ui/alert-dialog.tsx";

 const Access = () => {
  const { config, deleteAccess } = useConfig();
@@ -46,11 +56,11 @@ const Access = () => {
  return (
    <div className="">
      <div className="flex justify-between items-center">
-        <div className="text-muted-foreground">授权管理</div>
+        <div className="text-muted-foreground">{t("access.management")}</div>
        {tab != "access_group" ? (
-          <AccessEdit trigger={<Button>添加授权</Button>} op="add" />
+          <AccessEdit trigger={<Button>{t("access.add")}</Button>} op="add" />
        ) : (
-          <AccessGroupEdit trigger={<Button>添加授权组</Button>} />
+          <AccessGroupEdit trigger={<Button>{t("access.group.add")}</Button>} />
        )}
      </div>

@@ -66,7 +76,7 @@ const Access = () => {
              handleTabItemClick("access");
            }}
          >
-            授权管理
+            {t("access.management")}
          </TabsTrigger>
          <TabsTrigger
            value="access_group"
@@ -74,7 +84,7 @@ const Access = () => {
              handleTabItemClick("access_group");
            }}
          >
-            授权组管理
+            {t("access.group.management")}
          </TabsTrigger>
        </TabsList>
        <TabsContent value="access">
@@ -85,10 +95,10 @@ const Access = () => {
              </span>

              <div className="text-center text-sm text-muted-foreground mt-3">
-                请添加授权开始部署证书吧。
+                {t("access.empty")}
              </div>
              <AccessEdit
-                trigger={<Button>添加授权</Button>}
+                trigger={<Button>{t("access.add")}</Button>}
                op="add"
                className="mt-3"
              />
@@ -96,15 +106,15 @@ const Access = () => {
          ) : (
            <>
              <div className="hidden sm:flex sm:flex-row text-muted-foreground text-sm border-b dark:border-stone-500 sm:p-2 mt-5">
-                <div className="w-48">名称</div>
-                <div className="w-48">服务商</div>
+                <div className="w-48">{t("name")}</div>
+                <div className="w-48">{t("access.type")}</div>

-                <div className="w-52">创建时间</div>
-                <div className="w-52">更新时间</div>
-                <div className="grow">操作</div>
+                <div className="w-60">{t("create.time")}</div>
+                <div className="w-60">{t("update.time")}</div>
+                <div className="grow">{t("operation")}</div>
              </div>
              <div className="sm:hidden flex text-sm text-muted-foreground">
-                授权列表
+                {t("access.list")}
              </div>
              {accesses
                .filter((item) => {
@@ -124,37 +134,69 @@ const Access = () => {
                        src={accessTypeMap.get(access.configType)?.[1]}
                        className="w-6"
                      />
-                      <div>{accessTypeMap.get(access.configType)?.[0]}</div>
+                      <div>
+                        {t(accessTypeMap.get(access.configType)?.[0] || "")}
+                      </div>
                    </div>

-                    <div className="sm:w-52 w-full pt-1 sm:pt-0 flex items-center">
-                      创建于{" "}
+                    <div className="sm:w-60 w-full pt-1 sm:pt-0 flex items-center">
+                      {t("created.in")}{" "}
                      {access.created && convertZulu2Beijing(access.created)}
                    </div>
-                    <div className="sm:w-52 w-full pt-1 sm:pt-0 flex items-center">
-                      更新于{" "}
+                    <div className="sm:w-60 w-full pt-1 sm:pt-0 flex items-center">
+                      {t("updated.in")}{" "}
                      {access.updated && convertZulu2Beijing(access.updated)}
                    </div>
                    <div className="flex items-center grow justify-start pt-1 sm:pt-0">
                      <AccessEdit
                        trigger={
                          <Button variant={"link"} className="p-0">
-                            编辑
+                            {t("edit")}
                          </Button>
                        }
                        op="edit"
                        data={access}
                      />
                      <Separator orientation="vertical" className="h-4 mx-2" />
-                      <Button
-                        variant={"link"}
-                        className="p-0"
-                        onClick={() => {
-                          handleDelete(access);
-                        }}
-                      >
-                        删除
-                      </Button>
+                      <AccessEdit
+                          trigger={
+                            <Button variant={"link"} className="p-0">
+                              {t("copy")}
+                            </Button>
+                          }
+                          op="copy"
+                          data={access}
+                      />
+                      <Separator orientation="vertical" className="h-4 mx-2" />
+                      <AlertDialog>
+                        <AlertDialogTrigger asChild>
+                          <Button variant={"link"} size={"sm"}>
+                            {t('delete')}
+                          </Button>
+                        </AlertDialogTrigger>
+                        <AlertDialogContent>
+                          <AlertDialogHeader>
+                            <AlertDialogTitle className="dark:text-gray-200">
+                              {t('access.group.delete')}
+                            </AlertDialogTitle>
+                            <AlertDialogDescription>
+                              {t('access.delete.confirm')}
+                            </AlertDialogDescription>
+                          </AlertDialogHeader>
+                          <AlertDialogFooter>
+                            <AlertDialogCancel className="dark:text-gray-200">
+                              {t('cancel')}
+                            </AlertDialogCancel>
+                            <AlertDialogAction
+                                onClick={() => {
+                                  handleDelete(access);
+                                }}
+                            >
+                              {t('confirm')}
+                            </AlertDialogAction>
+                          </AlertDialogFooter>
+                        </AlertDialogContent>
+                      </AlertDialog>
                    </div>
                  </div>
                ))}
--- a/ui/src/pages/dashboard/Dashboard.tsx
+++ b/ui/src/pages/dashboard/Dashboard.tsx
@@ -24,12 +24,14 @@ import {
 } from "lucide-react";
 import { useEffect, useState } from "react";
 import { Link, useNavigate } from "react-router-dom";
+import { useTranslation } from "react-i18next";

 const Dashboard = () => {
  const [statistic, setStatistic] = useState<Statistic>();
  const [deployments, setDeployments] = useState<Deployment[]>();

  const navigate = useNavigate();
+  const { t } = useTranslation();

  useEffect(() => {
    const fetchStatistic = async () => {
@@ -55,7 +57,7 @@ const Dashboard = () => {
  return (
    <div className="flex flex-col">
      <div className="flex justify-between items-center">
-        <div className="text-muted-foreground">控制面板</div>
+        <div className="text-muted-foreground">{t("dashboard")}</div>
      </div>
      <div className="flex mt-10 gap-5 flex-col flex-wrap md:flex-row">
        <div className="w-full md:w-[250px] 3xl:w-[300px] flex items-center rounded-md p-3 shadow-lg border">
@@ -63,7 +65,9 @@ const Dashboard = () => {
            <SquareSigma size={48} strokeWidth={1} className="text-blue-400" />
          </div>
          <div>
-            <div className="text-muted-foreground font-semibold">所有</div>
+            <div className="text-muted-foreground font-semibold">
+              {t("dashboard.all")}
+            </div>
            <div className="flex items-baseline">
              <div className="text-3xl text-stone-700 dark:text-stone-200">
                {statistic?.total ? (
@@ -74,7 +78,9 @@ const Dashboard = () => {
                  0
                )}
              </div>
-              <div className="ml-1 text-stone-700 dark:text-stone-200">个</div>
+              <div className="ml-1 text-stone-700 dark:text-stone-200">
+                {t("dashboard.unit")}
+              </div>
            </div>
          </div>
        </div>
@@ -84,7 +90,9 @@ const Dashboard = () => {
            <CalendarX2 size={48} strokeWidth={1} className="text-red-400" />
          </div>
          <div>
-            <div className="text-muted-foreground font-semibold">即将过期</div>
+            <div className="text-muted-foreground font-semibold">
+              {t("dashboard.near.expired")}
+            </div>
            <div className="flex items-baseline">
              <div className="text-3xl text-stone-700 dark:text-stone-200">
                {statistic?.expired ? (
@@ -95,7 +103,9 @@ const Dashboard = () => {
                  0
                )}
              </div>
-              <div className="ml-1 text-stone-700 dark:text-stone-200">个</div>
+              <div className="ml-1 text-stone-700 dark:text-stone-200">
+                {t("dashboard.unit")}
+              </div>
            </div>
          </div>
        </div>
@@ -109,7 +119,9 @@ const Dashboard = () => {
            />
          </div>
          <div>
-            <div className="text-muted-foreground font-semibold">启用中</div>
+            <div className="text-muted-foreground font-semibold">
+              {t("dashboard.enabled")}
+            </div>
            <div className="flex items-baseline">
              <div className="text-3xl text-stone-700 dark:text-stone-200">
                {statistic?.enabled ? (
@@ -120,7 +132,9 @@ const Dashboard = () => {
                  0
                )}
              </div>
-              <div className="ml-1 text-stone-700 dark:text-stone-200">个</div>
+              <div className="ml-1 text-stone-700 dark:text-stone-200">
+                {t("dashboard.unit")}
+              </div>
            </div>
          </div>
        </div>
@@ -130,7 +144,9 @@ const Dashboard = () => {
            <Ban size={48} strokeWidth={1} className="text-gray-400" />
          </div>
          <div>
-            <div className="text-muted-foreground font-semibold">未启用</div>
+            <div className="text-muted-foreground font-semibold">
+              {t("dashboard.not.enabled")}
+            </div>
            <div className="flex items-baseline">
              <div className="text-3xl text-stone-700 dark:text-stone-200">
                {statistic?.disabled ? (
@@ -144,28 +160,29 @@ const Dashboard = () => {
                  0
                )}
              </div>
-              <div className="ml-1 text-stone-700 dark:text-stone-200">个</div>
+              <div className="ml-1 text-stone-700 dark:text-stone-200">
+                {t("dashboard.unit")}
+              </div>
            </div>
          </div>
        </div>
      </div>

      <div>
-        <div className="text-muted-foreground mt-5 text-sm">部署历史</div>
+        <div className="text-muted-foreground mt-5 text-sm">
+          {t("deployment.log.name")}
+        </div>

        {deployments?.length == 0 ? (
          <>
            <Alert className="max-w-[40em] mt-10">
-              <AlertTitle>暂无数据</AlertTitle>
+              <AlertTitle>{t("no.data")}</AlertTitle>
              <AlertDescription>
                <div className="flex items-center mt-5">
                  <div>
                    <Smile className="text-yellow-400" size={36} />
                  </div>
-                  <div className="ml-2">
-                    {" "}
-                    你暂未创建任何部署，请先添加域名进行部署吧！
-                  </div>
+                  <div className="ml-2"> {t("deployment.log.empty")}</div>
                </div>
                <div className="mt-2 flex justify-end">
                  <Button
@@ -173,7 +190,7 @@ const Dashboard = () => {
                      navigate("/edit");
                    }}
                  >
-                    添加域名
+                    {t("domain.add")}
                  </Button>
                </div>
              </AlertDescription>
@@ -182,16 +199,18 @@ const Dashboard = () => {
        ) : (
          <>
            <div className="hidden sm:flex sm:flex-row text-muted-foreground text-sm border-b dark:border-stone-500 sm:p-2 mt-5">
-              <div className="w-48">域名</div>
+              <div className="w-48">{t("domain")}</div>

-              <div className="w-24">状态</div>
-              <div className="w-56">阶段</div>
-              <div className="w-56 sm:ml-2 text-center">最近执行时间</div>
+              <div className="w-24">{t("deployment.log.status")}</div>
+              <div className="w-56">{t("deployment.log.stage")}</div>
+              <div className="w-56 sm:ml-2 text-center">
+                {t("deployment.log.last.execution.time")}
+              </div>

-              <div className="grow">操作</div>
+              <div className="grow">{t("operation")}</div>
            </div>
            <div className="sm:hidden flex text-sm text-muted-foreground">
-              部署历史
+              {t("deployment.log.name")}
            </div>

            {deployments?.map((deployment) => (
@@ -200,7 +219,14 @@ const Dashboard = () => {
                className="flex flex-col sm:flex-row text-secondary-foreground border-b  dark:border-stone-500 sm:p-2 hover:bg-muted/50 text-sm"
              >
                <div className="sm:w-48 w-full pt-1 sm:pt-0 flex items-center">
-                  {deployment.expand.domain?.domain}
+                  {deployment.expand.domain?.domain
+                    .split(";")
+                    .map((domain: string) => (
+                      <>
+                        {domain}
+                        <br />
+                      </>
+                    ))}
                </div>
                <div className="sm:w-24 w-full pt-1 sm:pt-0 flex items-center">
                  <DeployState deployment={deployment} />
@@ -218,14 +244,14 @@ const Dashboard = () => {
                  <Sheet>
                    <SheetTrigger asChild>
                      <Button variant={"link"} className="p-0">
-                        日志
+                        {t("deployment.log.detail.button.text")}
                      </Button>
                    </SheetTrigger>
                    <SheetContent className="sm:max-w-5xl">
                      <SheetHeader>
                        <SheetTitle>
                          {deployment.expand.domain?.domain}-{deployment.id}
-                          部署详情
+                          {t("deployment.log.detail")}
                        </SheetTitle>
                      </SheetHeader>
                      <div className="bg-gray-950 text-stone-100 p-5 text-sm h-[80dvh]">
--- a/ui/src/pages/domains/Edit.tsx
+++ b/ui/src/pages/domains/Edit.tsx
@@ -1,4 +1,3 @@
-import { Input } from "@/components/ui/input";
 import { useForm } from "react-hook-form";

 import { zodResolver } from "@hookform/resolvers/zod";
@@ -38,6 +37,8 @@ import EmailsEdit from "@/components/certimate/EmailsEdit";
 import { Textarea } from "@/components/ui/textarea";
 import { cn } from "@/lib/utils";
 import { EmailsSetting } from "@/domain/settings";
+import { useTranslation } from "react-i18next";
+import StringList from "@/components/certimate/StringList";

 const Edit = () => {
  const {
@@ -47,6 +48,7 @@ const Edit = () => {
  const [domain, setDomain] = useState<Domain>();

  const location = useLocation();
+  const { t } = useTranslation();

  const [tab, setTab] = useState<"base" | "advance">("base");

@@ -68,16 +70,16 @@ const Edit = () => {

  const formSchema = z.object({
    id: z.string().optional(),
-    domain: z.string().regex(/^(?:\*\.)?([a-zA-Z0-9-]+\.)+[a-zA-Z]{2,}$/, {
-      message: "请输入正确的域名",
+    domain: z.string().min(1, {
+      message: "domain.not.empty.verify.message",
    }),
-    email: z.string().email().optional(),
+    email: z.string().email("email.valid.message").optional(),
    access: z.string().regex(/^[a-zA-Z0-9]+$/, {
-      message: "请选择DNS服务商授权配置",
+      message: "domain.management.edit.dns.access.not.empty.message",
    }),
    targetAccess: z.string().optional(),
    targetType: z.string().regex(/^[a-zA-Z0-9-]+$/, {
-      message: "请选择部署服务类型",
+      message: "domain.management.edit.target.type.not.empty.message",
    }),
    variables: z.string().optional(),
    group: z.string().optional(),
@@ -138,11 +140,11 @@ const Edit = () => {
    if (group == "" && targetAccess == "") {
      form.setError("group", {
        type: "manual",
-        message: "部署授权和部署授权组至少选一个",
+        message: "domain.management.edit.target.access.verify.msg",
      });
      form.setError("targetAccess", {
        type: "manual",
-        message: "部署授权和部署授权组至少选一个",
+        message: "domain.management.edit.target.access.verify.msg",
      });
      return;
    }
@@ -162,13 +164,13 @@ const Edit = () => {

    try {
      await save(req);
-      let description = "域名编辑成功";
+      let description = t("domain.management.edit.succeed.tips");
      if (req.id == "") {
-        description = "域名添加成功";
+        description = t("domain.management.add.succeed.tips");
      }

      toast({
-        title: "成功",
+        title: t("succeed"),
        description,
      });
      navigate("/domains");
@@ -193,7 +195,7 @@ const Edit = () => {
      <div className="">
        <Toaster />
        <div className=" h-5 text-muted-foreground">
-          {domain?.id ? "编辑" : "新增"}域名
+          {domain?.id ? t("domain.edit") : t("domain.add")}
        </div>
        <div className="mt-5 flex w-full justify-center md:space-x-10 flex-col md:flex-row">
          <div className="w-full md:w-[200px] text-muted-foreground space-x-3 md:space-y-3 flex-row md:flex-col flex">
@@ -206,7 +208,7 @@ const Edit = () => {
                setTab("base");
              }}
            >
-              基础设置
+              {t("basic.setting")}
            </div>
            <div
              className={cn(
@@ -217,7 +219,7 @@ const Edit = () => {
                setTab("advance");
              }}
            >
-              高级设置
+              {t("advanced.setting")}
            </div>
          </div>

@@ -232,10 +234,15 @@ const Edit = () => {
                  name="domain"
                  render={({ field }) => (
                    <FormItem hidden={tab != "base"}>
-                      <FormLabel>域名</FormLabel>
-                      <FormControl>
-                        <Input placeholder="请输入域名" {...field} />
-                      </FormControl>
+                      <>
+                        <StringList
+                          value={field.value}
+                          valueType="domain"
+                          onValueChange={(domain: string) => {
+                            form.setValue("domain", domain);
+                          }}
+                        />
+                      </>

                      <FormMessage />
                    </FormItem>
@@ -247,12 +254,15 @@ const Edit = () => {
                  render={({ field }) => (
                    <FormItem hidden={tab != "base"}>
                      <FormLabel className="flex w-full justify-between">
-                        <div>Email（申请证书需要提供邮箱）</div>
+                        <div>
+                          {t("email") +
+                            t("domain.management.edit.email.description")}
+                        </div>
                        <EmailsEdit
                          trigger={
                            <div className="font-normal text-primary hover:underline cursor-pointer flex items-center">
                              <Plus size={14} />
-                              新增
+                              {t("add")}
                            </div>
                          }
                        />
@@ -266,11 +276,15 @@ const Edit = () => {
                          }}
                        >
                          <SelectTrigger>
-                            <SelectValue placeholder="请选择邮箱" />
+                            <SelectValue
+                              placeholder={t(
+                                "domain.management.edit.email.not.empty.message"
+                              )}
+                            />
                          </SelectTrigger>
                          <SelectContent>
                            <SelectGroup>
-                              <SelectLabel>邮箱列表</SelectLabel>
+                              <SelectLabel>{t("email.list")}</SelectLabel>
                              {(emails.content as EmailsSetting).emails.map(
                                (item) => (
                                  <SelectItem key={item} value={item}>
@@ -293,12 +307,14 @@ const Edit = () => {
                  render={({ field }) => (
                    <FormItem hidden={tab != "base"}>
                      <FormLabel className="flex w-full justify-between">
-                        <div>DNS 服务商授权配置</div>
+                        <div>
+                          {t("domain.management.edit.dns.access.label")}
+                        </div>
                        <AccessEdit
                          trigger={
                            <div className="font-normal text-primary hover:underline cursor-pointer flex items-center">
                              <Plus size={14} />
-                              新增
+                              {t("add")}
                            </div>
                          }
                          op="add"
@@ -313,11 +329,17 @@ const Edit = () => {
                          }}
                        >
                          <SelectTrigger>
-                            <SelectValue placeholder="请选择授权配置" />
+                            <SelectValue
+                              placeholder={t(
+                                "domain.management.edit.access.not.empty.message"
+                              )}
+                            />
                          </SelectTrigger>
                          <SelectContent>
                            <SelectGroup>
-                              <SelectLabel>服务商授权配置</SelectLabel>
+                              <SelectLabel>
+                                {t("domain.management.edit.access.label")}
+                              </SelectLabel>
                              {accesses
                                .filter((item) => item.usage != "deploy")
                                .map((item) => (
@@ -349,7 +371,9 @@ const Edit = () => {
                  name="targetType"
                  render={({ field }) => (
                    <FormItem hidden={tab != "base"}>
-                      <FormLabel>部署服务类型</FormLabel>
+                      <FormLabel>
+                        {t("domain.management.edit.target.type")}
+                      </FormLabel>
                      <FormControl>
                        <Select
                          {...field}
@@ -359,11 +383,17 @@ const Edit = () => {
                          }}
                        >
                          <SelectTrigger>
-                            <SelectValue placeholder="请选择部署服务类型" />
+                            <SelectValue
+                              placeholder={t(
+                                "domain.management.edit.target.type.not.empty.message"
+                              )}
+                            />
                          </SelectTrigger>
                          <SelectContent>
                            <SelectGroup>
-                              <SelectLabel>部署服务类型</SelectLabel>
+                              <SelectLabel>
+                                {t("domain.management.edit.target.type")}
+                              </SelectLabel>
                              {targetTypeKeys.map((key) => (
                                <SelectItem key={key} value={key}>
                                  <div className="flex items-center space-x-2">
@@ -371,7 +401,9 @@ const Edit = () => {
                                      className="w-6"
                                      src={targetTypeMap.get(key)?.[1]}
                                    />
-                                    <div>{targetTypeMap.get(key)?.[0]}</div>
+                                    <div>
+                                      {t(targetTypeMap.get(key)?.[0] || "")}
+                                    </div>
                                  </div>
                                </SelectItem>
                              ))}
@@ -390,12 +422,12 @@ const Edit = () => {
                  render={({ field }) => (
                    <FormItem hidden={tab != "base"}>
                      <FormLabel className="w-full flex justify-between">
-                        <div>部署服务商授权配置</div>
+                        <div>{t("domain.management.edit.target.access")}</div>
                        <AccessEdit
                          trigger={
                            <div className="font-normal text-primary hover:underline cursor-pointer flex items-center">
                              <Plus size={14} />
-                              新增
+                              {t("add")}
                            </div>
                          }
                          op="add"
@@ -409,12 +441,19 @@ const Edit = () => {
                          }}
                        >
                          <SelectTrigger>
-                            <SelectValue placeholder="请选择授权配置" />
+                            <SelectValue
+                              placeholder={t(
+                                "domain.management.edit.target.access.not.empty.message"
+                              )}
+                            />
                          </SelectTrigger>
                          <SelectContent>
                            <SelectGroup>
                              <SelectLabel>
-                                服务商授权配置{form.getValues().targetAccess}
+                                {t(
+                                  "domain.management.edit.target.access.content.label"
+                                )}{" "}
+                                {form.getValues().targetAccess}
                              </SelectLabel>
                              <SelectItem value="emptyId">
                                <div className="flex items-center space-x-2">
@@ -450,9 +489,7 @@ const Edit = () => {
                  render={({ field }) => (
                    <FormItem hidden={tab != "advance" || targetType != "ssh"}>
                      <FormLabel className="w-full flex justify-between">
-                        <div>
-                          部署配置组(用于将一个域名证书部署到多个 ssh 主机)
-                        </div>
+                        <div>{t("domain.management.edit.group.label")}</div>
                      </FormLabel>
                      <FormControl>
                        <Select
@@ -464,7 +501,11 @@ const Edit = () => {
                          }}
                        >
                          <SelectTrigger>
-                            <SelectValue placeholder="请选择分组" />
+                            <SelectValue
+                              placeholder={t(
+                                "domain.management.edit.group.not.empty.message"
+                              )}
+                            />
                          </SelectTrigger>
                          <SelectContent>
                            <SelectItem value="emptyId">
@@ -509,10 +550,12 @@ const Edit = () => {
                  name="variables"
                  render={({ field }) => (
                    <FormItem hidden={tab != "advance"}>
-                      <FormLabel>变量</FormLabel>
+                      <FormLabel>{t("variables")}</FormLabel>
                      <FormControl>
                        <Textarea
-                          placeholder={`可在SSH部署中使用,形如:\nkey=val;\nkey2=val2;`}
+                          placeholder={t(
+                            "domain.management.edit.variables.placeholder"
+                          )}
                          {...field}
                          className="placeholder:whitespace-pre-wrap"
                        />
@@ -528,10 +571,12 @@ const Edit = () => {
                  name="nameservers"
                  render={({ field }) => (
                    <FormItem hidden={tab != "advance"}>
-                      <FormLabel>域名服务器</FormLabel>
+                      <FormLabel>{t("dns")}</FormLabel>
                      <FormControl>
                        <Textarea
-                          placeholder={`自定义域名服务器,多个用分号隔开,如:\n8.8.8.8;\n8.8.4.4;`}
+                          placeholder={t(
+                            "domain.management.edit.dns.placeholder"
+                          )}
                          {...field}
                          className="placeholder:whitespace-pre-wrap"
                        />
@@ -543,7 +588,7 @@ const Edit = () => {
                />

                <div className="flex justify-end">
-                  <Button type="submit">保存</Button>
+                  <Button type="submit">{t("save")}</Button>
                </div>
              </form>
            </Form>
--- a/ui/src/pages/domains/Home.tsx
+++ b/ui/src/pages/domains/Home.tsx
@@ -35,11 +35,13 @@ import { TooltipContent, TooltipProvider } from "@radix-ui/react-tooltip";
 import { Earth } from "lucide-react";
 import { useEffect, useState } from "react";
 import { Link, useLocation, useNavigate } from "react-router-dom";
+import { useTranslation, Trans } from "react-i18next";

 const Home = () => {
  const toast = useToast();

  const navigate = useNavigate();
+  const { t } = useTranslation();

  const location = useLocation();
  const query = new URLSearchParams(location.search);
@@ -127,23 +129,24 @@ const Home = () => {
      await save(domain);

      toast.toast({
-        title: "操作成功",
-        description: "已发起部署，请稍后查看部署日志。",
+        title: t("operation.succeed"),
+        description: t("domain.management.start.deploy.succeed.tips"),
      });
    } catch (e) {
      toast.toast({
-        title: "执行失败",
+        title: t("domain.management.execution.failed"),
        description: (
-          <>
-            执行失败，请查看
+          // 这里的 text 只是占位作用，实际文案在 src/i18n/locales/[lang].json
+          <Trans i18nKey="domain.management.execution.failed.tips">
+            text1
            <Link
              to={`/history?domain=${domain.id}`}
              className="underline text-blue-500"
            >
-              部署日志
+              text2
            </Link>
-            查看详情。
-          </>
+            text3
+          </Trans>
        ),
        variant: "destructive",
      });
@@ -175,8 +178,10 @@ const Home = () => {
      <div className="">
        <Toaster />
        <div className="flex justify-between items-center">
-          <div className="text-muted-foreground">域名列表</div>
-          <Button onClick={handleCreateClick}>新增域名</Button>
+          <div className="text-muted-foreground">
+            {t("domain.management.name")}
+          </div>
+          <Button onClick={handleCreateClick}>{t("domain.add")}</Button>
        </div>

        {!domains.length ? (
@@ -187,26 +192,32 @@ const Home = () => {
              </span>

              <div className="text-center text-sm text-muted-foreground mt-3">
-                请添加域名开始部署证书吧。
+                {t("domain.management.empty")}
              </div>
              <Button onClick={handleCreateClick} className="mt-3">
-                添加域名
+                {t("domain.add")}
              </Button>
            </div>
          </>
        ) : (
          <>
            <div className="hidden sm:flex sm:flex-row text-muted-foreground text-sm border-b dark:border-stone-500 sm:p-2 mt-5">
-              <div className="w-36">域名</div>
-              <div className="w-40">有效期限</div>
-              <div className="w-32">最近执行状态</div>
-              <div className="w-64">最近执行阶段</div>
-              <div className="w-40 sm:ml-2">最近执行时间</div>
-              <div className="w-24">是否启用</div>
-              <div className="grow">操作</div>
+              <div className="w-36">{t("domain")}</div>
+              <div className="w-40">{t("domain.management.expiry.date")}</div>
+              <div className="w-32">
+                {t("domain.management.last.execution.status")}
+              </div>
+              <div className="w-64">
+                {t("domain.management.last.execution.stage")}
+              </div>
+              <div className="w-40 sm:ml-2">
+                {t("domain.management.last.execution.time")}
+              </div>
+              <div className="w-24">{t("domain.management.enable")}</div>
+              <div className="grow">{t("operation")}</div>
            </div>
            <div className="sm:hidden flex text-sm text-muted-foreground">
-              域名
+              {t("domain")}
            </div>

            {domains.map((domain) => (
@@ -214,15 +225,26 @@ const Home = () => {
                className="flex flex-col sm:flex-row text-secondary-foreground border-b  dark:border-stone-500 sm:p-2 hover:bg-muted/50 text-sm"
                key={domain.id}
              >
-                <div className="sm:w-36 w-full pt-1 sm:pt-0 flex items-center">
-                  {domain.domain}
+                <div className="sm:w-36 w-full pt-1 sm:pt-0 flex items-center truncate">
+                  {domain.domain.split(";").map((item) => (
+                    <>
+                      {item}
+                      <br />
+                    </>
+                  ))}
                </div>
                <div className="sm:w-40 w-full pt-1 sm:pt-0 flex  items-center">
                  <div>
                    {domain.expiredAt ? (
                      <>
-                        <div>有效期90天</div>
-                        <div>{getDate(domain.expiredAt)}到期</div>
+                        <div>
+                          {t("domain.management.expiry.date1", { date: 90 })}
+                        </div>
+                        <div>
+                          {t("domain.management.expiry.date2", {
+                            date: getDate(domain.expiredAt),
+                          })}
+                        </div>
                      </>
                    ) : (
                      "---"
@@ -266,7 +288,7 @@ const Home = () => {
                      </TooltipTrigger>
                      <TooltipContent>
                        <div className="border rounded-sm px-3 bg-background text-muted-foreground text-xs">
-                          {domain.enabled ? "禁用" : "启用"}
+                          {domain.enabled ? t("disable") : t("enable")}
                        </div>
                      </TooltipContent>
                    </Tooltip>
@@ -278,7 +300,7 @@ const Home = () => {
                    className="p-0"
                    onClick={() => handleHistoryClick(domain.id)}
                  >
-                    部署历史
+                    {t("deployment.log.name")}
                  </Button>
                  <Show when={domain.enabled ? true : false}>
                    <Separator orientation="vertical" className="h-4 mx-2" />
@@ -287,7 +309,7 @@ const Home = () => {
                      className="p-0"
                      onClick={() => handleRightNowClick(domain)}
                    >
-                      立即部署
+                      {t("domain.management.start.deploying")}
                    </Button>
                  </Show>

@@ -304,7 +326,7 @@ const Home = () => {
                      className="p-0"
                      onClick={() => handleForceClick(domain)}
                    >
-                      强行部署
+                      {t("domain.management.forced.deployment")}
                    </Button>
                  </Show>

@@ -315,7 +337,7 @@ const Home = () => {
                      className="p-0"
                      onClick={() => handleDownloadClick(domain)}
                    >
-                      下载
+                      {t("download")}
                    </Button>
                  </Show>

@@ -325,24 +347,26 @@ const Home = () => {
                      <AlertDialog>
                        <AlertDialogTrigger asChild>
                          <Button variant={"link"} className="p-0">
-                            删除
+                            {t("delete")}
                          </Button>
                        </AlertDialogTrigger>
                        <AlertDialogContent>
                          <AlertDialogHeader>
-                            <AlertDialogTitle>删除域名</AlertDialogTitle>
+                            <AlertDialogTitle>
+                              {t("domain.delete")}
+                            </AlertDialogTitle>
                            <AlertDialogDescription>
-                              确定要删除域名吗？
+                              {t("domain.management.delete.confirm")}
                            </AlertDialogDescription>
                          </AlertDialogHeader>
                          <AlertDialogFooter>
-                            <AlertDialogCancel>取消</AlertDialogCancel>
+                            <AlertDialogCancel>{t("cancel")}</AlertDialogCancel>
                            <AlertDialogAction
                              onClick={() => {
                                handleDeleteClick(domain.id);
                              }}
                            >
-                              确认
+                              {t("confirm")}
                            </AlertDialogAction>
                          </AlertDialogFooter>
                        </AlertDialogContent>
@@ -354,7 +378,7 @@ const Home = () => {
                        className="p-0"
                        onClick={() => handleEditClick(domain.id)}
                      >
-                        编辑
+                        {t("edit")}
                      </Button>
                    </>
                  )}
--- a/ui/src/pages/history/History.tsx
+++ b/ui/src/pages/history/History.tsx
@@ -17,11 +17,13 @@ import { list } from "@/repository/deployment";
 import { Smile } from "lucide-react";
 import { useEffect, useState } from "react";
 import { useNavigate, useSearchParams } from "react-router-dom";
+import { useTranslation } from "react-i18next";

 const History = () => {
  const navigate = useNavigate();
  const [deployments, setDeployments] = useState<Deployment[]>();
  const [searchParams] = useSearchParams();
+  const { t } = useTranslation();
  const domain = searchParams.get("domain");

  useEffect(() => {
@@ -38,20 +40,17 @@ const History = () => {

  return (
    <ScrollArea className="h-[80vh] overflow-hidden">
-      <div className="text-muted-foreground">部署历史</div>
+      <div className="text-muted-foreground">{t("deployment.log.name")}</div>
      {!deployments?.length ? (
        <>
          <Alert className="max-w-[40em] mx-auto mt-20">
-            <AlertTitle>暂无数据</AlertTitle>
+            <AlertTitle>{t("no.data")}</AlertTitle>
            <AlertDescription>
              <div className="flex items-center mt-5">
                <div>
                  <Smile className="text-yellow-400" size={36} />
                </div>
-                <div className="ml-2">
-                  {" "}
-                  你暂未创建任何部署，请先添加域名进行部署吧！
-                </div>
+                <div className="ml-2"> {t("deployment.log.empty")}</div>
              </div>
              <div className="mt-2 flex justify-end">
                <Button
@@ -59,7 +58,7 @@ const History = () => {
                    navigate("/");
                  }}
                >
-                  添加域名
+                  {t("domain.add")}
                </Button>
              </div>
            </AlertDescription>
@@ -68,16 +67,18 @@ const History = () => {
      ) : (
        <>
          <div className="hidden sm:flex sm:flex-row text-muted-foreground text-sm border-b dark:border-stone-500 sm:p-2 mt-5">
-            <div className="w-48">域名</div>
+            <div className="w-48">{t("domain")}</div>

-            <div className="w-24">状态</div>
-            <div className="w-56">阶段</div>
-            <div className="w-56 sm:ml-2 text-center">最近执行时间</div>
+            <div className="w-24">{t("deployment.log.status")}</div>
+            <div className="w-56">{t("deployment.log.stage")}</div>
+            <div className="w-56 sm:ml-2 text-center">
+              {t("deployment.log.last.execution.time")}
+            </div>

-            <div className="grow">操作</div>
+            <div className="grow">{t("operation")}</div>
          </div>
          <div className="sm:hidden flex text-sm text-muted-foreground">
-            部署历史
+            {t("deployment.log.name")}
          </div>

          {deployments?.map((deployment) => (
@@ -86,7 +87,14 @@ const History = () => {
              className="flex flex-col sm:flex-row text-secondary-foreground border-b  dark:border-stone-500 sm:p-2 hover:bg-muted/50 text-sm"
            >
              <div className="sm:w-48 w-full pt-1 sm:pt-0 flex items-center">
-                {deployment.expand.domain?.domain}
+                {deployment.expand.domain?.domain
+                  .split(";")
+                  .map((domain: string) => (
+                    <>
+                      {domain}
+                      <br />
+                    </>
+                  ))}
              </div>
              <div className="sm:w-24 w-full pt-1 sm:pt-0 flex items-center">
                <DeployState deployment={deployment} />
@@ -104,14 +112,14 @@ const History = () => {
                <Sheet>
                  <SheetTrigger asChild>
                    <Button variant={"link"} className="p-0">
-                      日志
+                      {t("deployment.log.detail.button.text")}
                    </Button>
                  </SheetTrigger>
                  <SheetContent className="sm:max-w-5xl">
                    <SheetHeader>
                      <SheetTitle>
                        {deployment.expand.domain?.domain}-{deployment.id}
-                        部署详情
+                        {t("deployment.log.detail")}
                      </SheetTitle>
                    </SheetHeader>
                    <div className="bg-gray-950 text-stone-100 p-5 text-sm h-[80dvh]">
--- a/ui/src/pages/login/Login.tsx
+++ b/ui/src/pages/login/Login.tsx
@@ -1,3 +1,8 @@
+import { useForm } from "react-hook-form";
+import { useNavigate } from "react-router-dom";
+import { z } from "zod";
+import { useTranslation } from 'react-i18next'
+
 import { Button } from "@/components/ui/button";
 import {
  Form,
@@ -11,20 +16,19 @@ import { Input } from "@/components/ui/input";
 import { getErrMessage } from "@/lib/error";
 import { getPb } from "@/repository/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { useForm } from "react-hook-form";
-import { useNavigate } from "react-router-dom";
-import { z } from "zod";

 const formSchema = z.object({
  username: z.string().email({
-    message: "请输入正确的邮箱地址",
+    message: "login.username.no.empty.message",
  }),
  password: z.string().min(10, {
-    message: "密码至少10个字符",
+    message: "login.password.length.message",
  }),
 });

 const Login = () => {
+  const { t } = useTranslation()
+
  const form = useForm<z.infer<typeof formSchema>>({
    resolver: zodResolver(formSchema),
    defaultValues: {
@@ -61,7 +65,7 @@ const Login = () => {
            name="username"
            render={({ field }) => (
              <FormItem>
-                <FormLabel>用户名</FormLabel>
+                <FormLabel>{t('username')}</FormLabel>
                <FormControl>
                  <Input placeholder="email" {...field} />
                </FormControl>
@@ -76,9 +80,9 @@ const Login = () => {
            name="password"
            render={({ field }) => (
              <FormItem>
-                <FormLabel>密码</FormLabel>
+                <FormLabel>{t('password')}</FormLabel>
                <FormControl>
-                  <Input placeholder="shadcn" {...field} type="password" />
+                  <Input placeholder="password" {...field} type="password" />
                </FormControl>

                <FormMessage />
@@ -86,7 +90,7 @@ const Login = () => {
            )}
          />
          <div className="flex justify-end">
-            <Button type="submit">登录</Button>
+            <Button type="submit">{t('login.submit')}</Button>
          </div>
        </form>
      </Form>
--- a/ui/src/pages/setting/Account.tsx
+++ b/ui/src/pages/setting/Account.tsx
@@ -15,16 +15,18 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { useState } from "react";
 import { useForm } from "react-hook-form";
 import { useNavigate } from "react-router-dom";
+import { useTranslation } from "react-i18next";

 import { z } from "zod";

 const formSchema = z.object({
-  email: z.string().email("请输入正确的邮箱"),
+  email: z.string().email("setting.account.email.valid.message"),
 });

 const Account = () => {
  const { toast } = useToast();
  const navigate = useNavigate();
+  const { t } = useTranslation();

  const [changed, setChanged] = useState(false);

@@ -43,8 +45,8 @@ const Account = () => {

      getPb().authStore.clear();
      toast({
-        title: "修改账户邮箱功",
-        description: "请重新登录",
+        title: t("setting.account.email.change.succeed"),
+        description: t("setting.account.log.back.in"),
      });
      setTimeout(() => {
        navigate("/login");
@@ -52,7 +54,7 @@ const Account = () => {
    } catch (e) {
      const message = getErrMessage(e);
      toast({
-        title: "修改账户邮箱失败",
+        title: t("setting.account.email.change.failed"),
        description: message,
        variant: "destructive",
      });
@@ -72,10 +74,10 @@ const Account = () => {
              name="email"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>邮箱</FormLabel>
+                  <FormLabel>{t('email')}</FormLabel>
                  <FormControl>
                    <Input
-                      placeholder="请输入邮箱"
+                      placeholder={t('setting.email.placeholder')}
                      {...field}
                      type="email"
                      onChange={(e) => {
@@ -92,10 +94,10 @@ const Account = () => {

            <div className="flex justify-end">
              {changed ? (
-                <Button type="submit">确认修改</Button>
+                <Button type="submit">{t('setting.submit')}</Button>
              ) : (
                <Button type="submit" disabled variant={"secondary"}>
-                  确认修改
+                  {t('setting.submit')}
                </Button>
              )}
            </div>
--- a/ui/src/pages/setting/Notify.tsx
+++ b/ui/src/pages/setting/Notify.tsx
@@ -9,15 +9,18 @@ import {
  AccordionTrigger,
 } from "@/components/ui/accordion";
 import { NotifyProvider } from "@/providers/notify";
+import { useTranslation } from "react-i18next";

 const Notify = () => {
+  const { t } = useTranslation();
+
  return (
    <>
      <NotifyProvider>
        <div className="border rounded-sm p-5 shadow-lg">
          <Accordion type={"multiple"} className="dark:text-stone-200">
            <AccordionItem value="item-1" className="dark:border-stone-200">
-              <AccordionTrigger>模板</AccordionTrigger>
+              <AccordionTrigger>{t('template')}</AccordionTrigger>
              <AccordionContent>
                <NotifyTemplate />
              </AccordionContent>
@@ -27,21 +30,21 @@ const Notify = () => {
        <div className="border rounded-md p-5 mt-7 shadow-lg">
          <Accordion type={"single"} className="dark:text-stone-200">
            <AccordionItem value="item-2" className="dark:border-stone-200">
-              <AccordionTrigger>钉钉</AccordionTrigger>
+              <AccordionTrigger>{t('ding.talk')}</AccordionTrigger>
              <AccordionContent>
                <DingTalk />
              </AccordionContent>
            </AccordionItem>

            <AccordionItem value="item-4" className="dark:border-stone-200">
-              <AccordionTrigger>Telegram</AccordionTrigger>
+              <AccordionTrigger>{t('telegram')}</AccordionTrigger>
              <AccordionContent>
                <Telegram />
              </AccordionContent>
            </AccordionItem>

            <AccordionItem value="item-5" className="dark:border-stone-200">
-              <AccordionTrigger>Webhook</AccordionTrigger>
+              <AccordionTrigger>{t('webhook')}</AccordionTrigger>
              <AccordionContent>
                <Webhook />
              </AccordionContent>
--- a/ui/src/pages/setting/Password.tsx
+++ b/ui/src/pages/setting/Password.tsx
@@ -14,29 +14,31 @@ import { getPb } from "@/repository/api";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useForm } from "react-hook-form";
 import { useNavigate } from "react-router-dom";
+import { useTranslation } from "react-i18next";

 import { z } from "zod";

 const formSchema = z
  .object({
    oldPassword: z.string().min(10, {
-      message: "密码至少10个字符",
+      message: "setting.password.length.message",
    }),
    newPassword: z.string().min(10, {
-      message: "密码至少10个字符",
+      message: "setting.password.length.message",
    }),
    confirmPassword: z.string().min(10, {
-      message: "密码至少10个字符",
+      message: "setting.password.length.message",
    }),
  })
  .refine((data) => data.newPassword === data.confirmPassword, {
-    message: "两次密码不一致",
+    message: "setting.password.not.match",
    path: ["confirmPassword"],
  });

 const Password = () => {
  const { toast } = useToast();
  const navigate = useNavigate();
+  const { t } = useTranslation();

  const form = useForm<z.infer<typeof formSchema>>({
    resolver: zodResolver(formSchema),
@@ -66,8 +68,8 @@ const Password = () => {

      getPb().authStore.clear();
      toast({
-        title: "修改密码成功",
-        description: "请重新登录",
+        title: t('setting.password.change.succeed'),
+        description: t("setting.account.log.back.in"),
      });
      setTimeout(() => {
        navigate("/login");
@@ -75,7 +77,7 @@ const Password = () => {
    } catch (e) {
      const message = getErrMessage(e);
      toast({
-        title: "修改密码失败",
+        title: t('setting.password.change.failed'),
        description: message,
        variant: "destructive",
      });
@@ -95,9 +97,9 @@ const Password = () => {
              name="oldPassword"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>当前密码</FormLabel>
+                  <FormLabel>{t('setting.password.current.password')}</FormLabel>
                  <FormControl>
-                    <Input placeholder="当前密码" {...field} type="password" />
+                    <Input placeholder={t('setting.password.current.password')} {...field} type="password" />
                  </FormControl>

                  <FormMessage />
@@ -110,7 +112,7 @@ const Password = () => {
              name="newPassword"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>新密码</FormLabel>
+                  <FormLabel>{t('setting.password.new.password')}</FormLabel>
                  <FormControl>
                    <Input
                      placeholder="newPassword"
@@ -129,7 +131,7 @@ const Password = () => {
              name="confirmPassword"
              render={({ field }) => (
                <FormItem>
-                  <FormLabel>确认密码</FormLabel>
+                  <FormLabel>{t('setting.password.confirm.password')}</FormLabel>
                  <FormControl>
                    <Input
                      placeholder="confirmPassword"
@@ -143,7 +145,7 @@ const Password = () => {
              )}
            />
            <div className="flex justify-end">
-              <Button type="submit">确认修改</Button>
+              <Button type="submit">{t('setting.submit')}</Button>
            </div>
          </form>
        </Form>
--- a/ui/src/pages/setting/SSLProvider.tsx
+++ b/ui/src/pages/setting/SSLProvider.tsx
@@ -0,0 +1,250 @@
+import { Button } from "@/components/ui/button";
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+
+import { Label } from "@/components/ui/label";
+import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
+import { useToast } from "@/components/ui/use-toast";
+
+import {
+  SSLProvider as SSLProviderType,
+  SSLProviderSetting,
+  Setting,
+} from "@/domain/settings";
+import { getErrMessage } from "@/lib/error";
+import { cn } from "@/lib/utils";
+
+import { getSetting, update } from "@/repository/settings";
+import { zodResolver } from "@hookform/resolvers/zod";
+
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { useTranslation } from "react-i18next";
+
+import { z } from "zod";
+
+const SSLProvider = () => {
+  const { t } = useTranslation();
+
+  const formSchema = z.object({
+    provider: z.enum(["letsencrypt", "zerossl"], {
+      message: t("setting.ca.not.empty"),
+    }),
+    eabKid: z.string().optional(),
+    eabHmacKey: z.string().optional(),
+  });
+
+  const form = useForm<z.infer<typeof formSchema>>({
+    resolver: zodResolver(formSchema),
+    defaultValues: {
+      provider: "letsencrypt",
+    },
+  });
+
+  const [provider, setProvider] = useState("letsencrypt");
+
+  const [config, setConfig] = useState<Setting>();
+
+  const { toast } = useToast();
+
+  useEffect(() => {
+    const fetchData = async () => {
+      const setting = await getSetting("ssl-provider");
+
+      if (setting) {
+        setConfig(setting);
+        const content = setting.content as SSLProviderSetting;
+
+        form.setValue("provider", content.provider);
+        form.setValue("eabKid", content.config[content.provider].eabKid);
+        form.setValue(
+          "eabHmacKey",
+          content.config[content.provider].eabHmacKey
+        );
+        setProvider(content.provider);
+      } else {
+        form.setValue("provider", "letsencrypt");
+        setProvider("letsencrypt");
+      }
+    };
+    fetchData();
+  }, []);
+
+  const getOptionCls = (val: string) => {
+    if (provider === val) {
+      return "border-primary";
+    }
+
+    return "";
+  };
+
+  const onSubmit = async (values: z.infer<typeof formSchema>) => {
+    if (values.provider === "zerossl") {
+      if (!values.eabKid) {
+        form.setError("eabKid", {
+          message: t("setting.ca.eab_kid_hmac_key.not.empty"),
+        });
+      }
+      if (!values.eabHmacKey) {
+        form.setError("eabHmacKey", {
+          message: t("setting.ca.eab_kid_hmac_key.not.empty"),
+        });
+      }
+      if (!values.eabKid || !values.eabHmacKey) {
+        return;
+      }
+    }
+
+    const setting: Setting = {
+      id: config?.id,
+      name: "ssl-provider",
+      content: {
+        provider: values.provider,
+        config: {
+          letsencrypt: {},
+          zerossl: {
+            eabKid: values.eabKid ?? "",
+            eabHmacKey: values.eabHmacKey ?? "",
+          },
+        },
+      },
+    };
+
+    try {
+      await update(setting);
+      toast({
+        title: t("update.succeed"),
+        description: t("update.succeed"),
+      });
+    } catch (e) {
+      const message = getErrMessage(e);
+      toast({
+        title: t("update.failed"),
+        description: message,
+        variant: "destructive",
+      });
+    }
+  };
+
+  return (
+    <>
+      <div className="w-full md:max-w-[35em]">
+        <Form {...form}>
+          <form
+            onSubmit={form.handleSubmit(onSubmit)}
+            className="space-y-8 dark:text-stone-200"
+          >
+            <FormField
+              control={form.control}
+              name="provider"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>{t("ca")}</FormLabel>
+                  <FormControl>
+                    <RadioGroup
+                      {...field}
+                      className="flex"
+                      onValueChange={(val) => {
+                        setProvider(val);
+                        form.setValue("provider", val as SSLProviderType);
+                      }}
+                      value={provider}
+                    >
+                      <div className="flex items-center space-x-2">
+                        <RadioGroupItem value="letsencrypt" id="letsencrypt" />
+                        <Label htmlFor="letsencrypt">
+                          <div
+                            className={cn(
+                              "flex items-center space-x-2 border p-2 rounded cursor-pointer",
+                              getOptionCls("letsencrypt")
+                            )}
+                          >
+                            <img
+                              src={"/imgs/providers/letsencrypt.svg"}
+                              className="h-6"
+                            />
+                            <div>{"Let's Encrypt"}</div>
+                          </div>
+                        </Label>
+                      </div>
+                      <div className="flex items-center space-x-2">
+                        <RadioGroupItem value="zerossl" id="zerossl" />
+                        <Label htmlFor="zerossl">
+                          <div
+                            className={cn(
+                              "flex items-center space-x-2 border p-2 rounded cursor-pointer",
+                              getOptionCls("zerossl")
+                            )}
+                          >
+                            <img
+                              src={"/imgs/providers/zerossl.svg"}
+                              className="h-6"
+                            />
+                            <div>{"ZeroSSL"}</div>
+                          </div>
+                        </Label>
+                      </div>
+                    </RadioGroup>
+                  </FormControl>
+
+                  <FormField
+                    control={form.control}
+                    name="eabKid"
+                    render={({ field }) => (
+                      <FormItem hidden={provider !== "zerossl"}>
+                        <FormLabel>EAB_KID</FormLabel>
+                        <FormControl>
+                          <Input
+                            placeholder={t("setting.ca.eab_kid.not.empty")}
+                            {...field}
+                            type="text"
+                          />
+                        </FormControl>
+
+                        <FormMessage />
+                      </FormItem>
+                    )}
+                  />
+
+                  <FormField
+                    control={form.control}
+                    name="eabHmacKey"
+                    render={({ field }) => (
+                      <FormItem hidden={provider !== "zerossl"}>
+                        <FormLabel>EAB_HMAC_KEY</FormLabel>
+                        <FormControl>
+                          <Input
+                            placeholder={t("setting.ca.eab_hmac_key.not.empty")}
+                            {...field}
+                            type="text"
+                          />
+                        </FormControl>
+
+                        <FormMessage />
+                      </FormItem>
+                    )}
+                  />
+
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <div className="flex justify-end">
+              <Button type="submit">{t("setting.submit")}</Button>
+            </div>
+          </form>
+        </Form>
+      </div>
+    </>
+  );
+};
+
+export default SSLProvider;
--- a/ui/src/router.tsx
+++ b/ui/src/router.tsx
@@ -12,6 +12,7 @@ import SettingLayout from "./pages/SettingLayout";
 import Dashboard from "./pages/dashboard/Dashboard";
 import Account from "./pages/setting/Account";
 import Notify from "./pages/setting/Notify";
+import SSLProvider from "./pages/setting/SSLProvider";

 export const router = createHashRouter([
  {
@@ -54,6 +55,10 @@ export const router = createHashRouter([
            path: "/setting/notify",
            element: <Notify />,
          },
+          {
+            path: "/setting/ssl-provider",
+            element: <SSLProvider />,
+          },
        ],
      },
    ],
Author	SHA1	Message	Date
yoan	30ef5841d6	dark mode style fix	2024-10-09 09:26:39 +08:00
yoan	217ba85ff8	v0.1.16	2024-10-09 09:04:23 +08:00
yoan	71e2555391	multiple domain support	2024-10-08 22:02:00 +08:00
yoan	f036eb1cf2	Add the functionality to authorize copying	2024-10-04 08:19:46 +08:00
usual2970	1347066549	Merge pull request #131 from liburdi/hotfix/access_copy_word fix: update en.json	2024-10-03 07:55:09 +08:00
liburdi	7fc149f67d	fix: update en.json	2024-10-02 12:55:24 +08:00
yoan	dfba5ee638	Merge branch 'liburdi-feature/copy_access'	2024-10-01 07:04:56 +08:00
yoan	9ba79f996f	fix conflict	2024-10-01 07:04:40 +08:00
yoan	cd85000908	Merge branch 'JonathanSimon123-main'	2024-10-01 06:59:18 +08:00
liburdi	995349ab3e	feat: add issues 124	2024-09-30 18:22:16 +08:00
simon	4fa8031318	feat:Add star sequence diagram	2024-09-30 14:08:11 +08:00
simon	3f45bb1629	Merge branch 'main' of https://github.com/JonathanSimon123/certimate	2024-09-30 11:46:08 +08:00
蒋驰磊	0e139e6284	feat:Add star sequence diagram	2024-09-30 11:44:37 +08:00
JonathanSimon123	82dbfc6de3	Update README.md feature:Add start sequence diagram	2024-09-30 11:04:41 +08:00
JonathanSimon123	9b2937d601	Update README_EN.md feature:Add start sequence diagram	2024-09-30 11:02:06 +08:00
yoan	3375839a40	Merge branch 'l123wx-local_deployment_translate'	2024-09-30 07:35:26 +08:00
yoan	7f5ff6fab5	build ui	2024-09-30 07:34:44 +08:00
usual2970	5160b4c3d9	Merge pull request #120 from yanlc39/dev/fix_docker_deploy_way 簡化 Docker 部署的方式	2024-09-30 07:33:27 +08:00
Elvis Liao	85234b21c7	chore: translate local deployment form	2024-09-29 20:43:42 +08:00
yanlc39	223af9e09d	feat: let docker deploy way simpley	2024-09-29 17:42:05 +08:00
usual2970	49fdf8213a	Merge pull request #117 from sgpublic-forks/feat/pre_command fix: wrong pre command reference	2024-09-29 08:30:04 +08:00
Madray Haven	7a48101015	fix: wrong pre command reference	2024-09-28 17:28:55 +08:00
yoan	6b85b4a0c9	Merge branch 'l123wx-i18n'	2024-09-28 07:47:11 +08:00
yoan	3c56a53e91	translate new element to English	2024-09-28 07:46:55 +08:00
yoan	9797a0835d	Merge branch 'sgpublic-forks-feat/pre_command'	2024-09-28 07:05:02 +08:00
yoan	b6dc57f3e4	ui build	2024-09-28 07:04:17 +08:00
yoan	78ac21c767	Merge branch 'feat/pre_command' of github.com:sgpublic-forks/certimate into sgpublic-forks-feat/pre_command	2024-09-28 07:01:46 +08:00
elvis liao	1e2d8fa027	chore: abstract resources configure	2024-09-27 16:31:24 +08:00
Madray Haven	e7e2e4786d	chore: create a func for running ssh command	2024-09-27 16:14:35 +08:00
Madray Haven	9acdd15c1e	feat: pre command for ssh deploy	2024-09-27 15:12:04 +08:00
elvis liao	fcc0dd93fd	refactor(DeployProgress): 重构逻辑，修复样式问题	2024-09-27 13:42:58 +08:00
elvis liao	5eba437732	feat: english translation	2024-09-27 13:41:40 +08:00
elvis liao	0d0fcfccf3	feat: i18n transformation completed	2024-09-27 13:01:37 +08:00
yoan	993ef7bf57	Add contributing guide	2024-09-27 07:26:11 +08:00
yoan	46080b311a	v0.1.12	2024-09-27 06:59:16 +08:00
yoan	1fbe6b55c1	v0.1.12	2024-09-27 06:43:31 +08:00
yoan	07795568bf	v0.1.12	2024-09-27 06:42:52 +08:00
Elvis Liao	e820e5599b	wip: i18n - Change locales json to one-dimensional format	2024-09-27 00:42:40 +08:00
usual2970	cb8636faec	Merge pull request #109 from liburdi/feature/optimize_placeholder Feature/optimize placeholder	2024-09-26 20:33:13 +08:00
yoan	aa1046c39a	fixconflict	2024-09-26 20:31:04 +08:00
usual2970	7e94ba0875	Merge branch 'main' into feature/optimize_placeholder	2024-09-26 20:28:23 +08:00
yoan	077b365458	fix conflict	2024-09-26 20:25:31 +08:00
Elvis Liao	b3f1e1e444	chore: import i18n	2024-09-26 19:47:50 +08:00
liburdi	ead8e1fec5	feat: npm run build	2024-09-26 19:13:48 +08:00
liburdi	5be1139c1a	docs: update readme	2024-09-26 18:55:19 +08:00
liburdi	45e218dd5b	feat: optimize placeholder	2024-09-26 18:50:50 +08:00
elvis liao	0abb030889	wip: i18n chinese	2024-09-26 17:57:30 +08:00
elvis liao	85df8eb09d	feat: Add i18n	2024-09-26 17:53:44 +08:00
usual2970	c6291b42fc	Merge pull request #106 from usual2970/feat/local_deploy Add local deployer	2024-09-26 17:05:18 +08:00
yoan	2634789769	Add local deployer	2024-09-26 17:04:49 +08:00
usual2970	253075e7c0	Merge pull request #105 from usual2970/feat/zerossl Add zerossl provider	2024-09-26 16:09:20 +08:00
yoan	363fbdee00	Add zerossl provider	2024-09-26 16:07:51 +08:00
yoan	a9fdceca6f	Update readme	2024-09-25 19:50:45 +08:00
usual2970	f9cb605eb4	Update README.md	2024-09-25 19:41:51 +08:00
yoan	d5867d0971	Add an English Version of the README	2024-09-25 19:40:01 +08:00
yoan	f0faee34a4	Add an English readme	2024-09-25 19:37:56 +08:00
				`@@ -0,0 +1 @@`
				<svg height="500" width="500" xmlns="http://www.w3.org/2000/svg"><path d="m0 0h500v500c-165 0-330 0-500 0 0-165 0-330 0-500z" fill="#4d70d5"/><path d="m0 0h86v85h85v85h85v86c-28.05 0-56.1 0-85 0v85c-28.05 0-56.1 0-85 0 0-28.05 0-56.1 0-85-28.05 0-56.1 0-85 0v85c-28.38 0-56.76 0-86 0 0-28.38 0-56.76 0-86h85c0-28.05 0-56.1 0-85-27.72 0-55.44 0-84 0 0-28.05 0-56.1 0-85h84c0-28.05 0-56.1 0-85z" fill="#fefefe" transform="translate(175 76)"/><path d="m0 0h1v84h85v1c-28.05 0-56.1 0-85 0v85c-28.38 0-56.76 0-86 0 0-28.38 0-56.76 0-86h85c0-27.72 0-55.44 0-84zm-84 85v84h84c0-27.72 0-55.44 0-84-27.72 0-55.44 0-84 0z" fill="#bcc9ef" transform="translate(175 247)"/></svg>