From ecde12ec23e8170ea65b7583d23bf86646b0c529 Mon Sep 17 00:00:00 2001
From: Fu Diwei <fudiwei@sina.com>
Date: Sat, 18 Jan 2025 05:45:38 +0800
Subject: [PATCH] feat(ui): improve ssl providers switch warning

---
 ui/src/i18n/locales/en/nls.settings.json      |  2 +-
 ui/src/i18n/locales/zh/nls.settings.json      |  2 +-
 ui/src/pages/settings/SettingsSSLProvider.tsx | 12 ++++++++----
 3 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/ui/src/i18n/locales/en/nls.settings.json b/ui/src/i18n/locales/en/nls.settings.json
index 68b93ec5..7a12b408 100644
--- a/ui/src/i18n/locales/en/nls.settings.json
+++ b/ui/src/i18n/locales/en/nls.settings.json
@@ -77,8 +77,8 @@
   "settings.sslprovider.form.provider.option.letsencrypt_staging.label": "Let's Encrypt Staging Environment",
   "settings.sslprovider.form.provider.option.zerossl.label": "ZeroSSL",
   "settings.sslprovider.form.provider.option.gts.label": "Google Trust Services",
+  "settings.sslprovider.form.provider.alert": "Attention: The certificate validity lifetime, certificate algorithm, domain names count, and support for wildcard domain names are allowed may vary among different providers. After switching service providers, please check whether the configuration of the workflows needs to be adjusted.",
   "settings.sslprovider.form.letsencrypt_staging_alert": "The staging environment can reduce the chance of your running up against rate limits.<br><br>Learn more:<br><a href=\"https://letsencrypt.org/docs/staging-environment/\" target=\"_blank\">https://letsencrypt.org/docs/staging-environment/</a>",
-  "settings.sslprovider.form.letsencrypt_staging_warning": "Attention: Certificates from the staging environment are only for testing purposes.",
   "settings.sslprovider.form.zerossl_eab_kid.label": "EAB KID",
   "settings.sslprovider.form.zerossl_eab_kid.placeholder": "Please enter EAB KID",
   "settings.sslprovider.form.zerossl_eab_kid.tooltip": "For more information, see <a href=\"https://zerossl.com/documentation/acme/\" target=\"_blank\">https://zerossl.com/documentation/acme/</a>",
diff --git a/ui/src/i18n/locales/zh/nls.settings.json b/ui/src/i18n/locales/zh/nls.settings.json
index c8d4703a..a3958e80 100644
--- a/ui/src/i18n/locales/zh/nls.settings.json
+++ b/ui/src/i18n/locales/zh/nls.settings.json
@@ -77,8 +77,8 @@
   "settings.sslprovider.form.provider.option.letsencrypt_staging.label": "Let's Encrypt 测试环境",
   "settings.sslprovider.form.provider.option.zerossl.label": "ZeroSSL",
   "settings.sslprovider.form.provider.option.gts.label": "Google Trust Services",
+  "settings.sslprovider.form.provider.alert": "注意：不同服务商所支持的证书有效期、证书算法、多域名数量上限、是否允许泛域名等可能不同，切换服务商后请注意检查已有工作流的配置是否需要调整。",
   "settings.sslprovider.form.letsencrypt_staging_alert": "测试环境比生产环境有更宽松的速率限制，可进行测试性部署。<br><br>点击下方链接了解更多：<br><a href=\"https://letsencrypt.org/zh-cn/docs/staging-environment/\" target=\"_blank\">https://letsencrypt.org/zh-cn/docs/staging-environment/</a>",
-  "settings.sslprovider.form.letsencrypt_staging_warning": "警告：测试环境证书仅能用于测试目的。",
   "settings.sslprovider.form.zerossl_eab_kid.label": "EAB KID",
   "settings.sslprovider.form.zerossl_eab_kid.placeholder": "请输入 EAB KID",
   "settings.sslprovider.form.zerossl_eab_kid.tooltip": "这是什么？请参阅 <a href=\"https://zerossl.com/documentation/acme/\" target=\"_blank\">https://zerossl.com/documentation/acme/</a>",
diff --git a/ui/src/pages/settings/SettingsSSLProvider.tsx b/ui/src/pages/settings/SettingsSSLProvider.tsx
index c3a550f0..c082c4e7 100644
--- a/ui/src/pages/settings/SettingsSSLProvider.tsx
+++ b/ui/src/pages/settings/SettingsSSLProvider.tsx
@@ -97,10 +97,6 @@ const SSLProviderEditFormLetsEncryptStagingConfig = () => {
         <Alert type="info" message={<span dangerouslySetInnerHTML={{ __html: t("settings.sslprovider.form.letsencrypt_staging_alert") }}></span>} />
       </Form.Item>
 
-      <Form.Item>
-        <Alert type="warning" message={<span dangerouslySetInnerHTML={{ __html: t("settings.sslprovider.form.letsencrypt_staging_warning") }}></span>} />
-      </Form.Item>
-
       <Form.Item>
         <Button type="primary" htmlType="submit" disabled={!formChanged} loading={pending}>
           {t("common.button.save")}
@@ -324,28 +320,36 @@ const SettingsSSLProvider = () => {
                 avatar={<img src={"/imgs/acme/letsencrypt.svg"} className="size-8" />}
                 size="small"
                 title={t("settings.sslprovider.form.provider.option.letsencrypt.label")}
+                description="letsencrypt.org"
                 value={SSLPROVIDERS.LETS_ENCRYPT}
               />
               <CheckCard
                 avatar={<img src={"/imgs/acme/letsencrypt.svg"} className="size-8" />}
                 size="small"
                 title={t("settings.sslprovider.form.provider.option.letsencrypt_staging.label")}
+                description="letsencrypt.org"
                 value={SSLPROVIDERS.LETS_ENCRYPT_STAGING}
               />
               <CheckCard
                 avatar={<img src={"/imgs/acme/zerossl.svg"} className="size-8" />}
                 size="small"
                 title={t("settings.sslprovider.form.provider.option.zerossl.label")}
+                description="zerossl.com"
                 value={SSLPROVIDERS.ZERO_SSL}
               />
               <CheckCard
                 avatar={<img src={"/imgs/acme/google.svg"} className="size-8" />}
                 size="small"
                 title={t("settings.sslprovider.form.provider.option.gts.label")}
+                description="pki.goog"
                 value={SSLPROVIDERS.GOOGLE_TRUST_SERVICES}
               />
             </CheckCard.Group>
           </Form.Item>
+
+          <Form.Item>
+            <Alert type="warning" message={<span dangerouslySetInnerHTML={{ __html: t("settings.sslprovider.form.provider.alert") }}></span>} />
+          </Form.Item>
         </Form>
 
         <div className="md:max-w-[40rem]">{providerFormEl}</div>