From ebeee92e5136427d0caa6f6353d3f0f4db487feb Mon Sep 17 00:00:00 2001
From: yyh <yuanyouhuilyz@gmail.com>
Date: Mon, 19 Jan 2026 10:50:57 +0800
Subject: [PATCH] fix(sandbox-provider): align frontend types with backend API
 after refactor

Remove label, description, and icon fields from SandboxProvider type
as they are no longer returned by the backend API. Use i18n translations
to display provider labels instead of relying on API response data.
---
 .../sandbox-provider-page/config-modal.tsx                | 8 +++++---
 .../account-setting/sandbox-provider-page/constants.ts    | 7 +++++++
 .../sandbox-provider-page/provider-card.tsx               | 4 ++--
 .../sandbox-provider-page/switch-modal.tsx                | 3 ++-
 web/types/sandbox-provider.ts                             | 3 ---
 5 files changed, 16 insertions(+), 9 deletions(-)

diff --git a/web/app/components/header/account-setting/sandbox-provider-page/config-modal.tsx b/web/app/components/header/account-setting/sandbox-provider-page/config-modal.tsx
index 72445bbf804..35ffed52604 100644
--- a/web/app/components/header/account-setting/sandbox-provider-page/config-modal.tsx
+++ b/web/app/components/header/account-setting/sandbox-provider-page/config-modal.tsx
@@ -14,7 +14,7 @@ import {
   useDeleteSandboxProviderConfig,
   useSaveSandboxProviderConfig,
 } from '@/service/use-sandbox-provider'
-import { PROVIDER_DOC_LINKS, SANDBOX_FIELD_CONFIGS } from './constants'
+import { PROVIDER_DOC_LINKS, PROVIDER_LABEL_KEYS, SANDBOX_FIELD_CONFIGS } from './constants'
 import ProviderIcon from './provider-icon'
 
 type ConfigModalProps = {
@@ -98,7 +98,9 @@ const ConfigModal = ({
         </h3>
         <div className="flex items-center gap-2">
           <ProviderIcon providerType={provider.provider_type} size="sm" withBorder />
-          <span className="system-md-regular text-text-secondary">{provider.label}</span>
+          <span className="system-md-regular text-text-secondary">
+            {t(PROVIDER_LABEL_KEYS[provider.provider_type as keyof typeof PROVIDER_LABEL_KEYS] ?? 'sandboxProvider.e2b.label', { ns: 'common' })}
+          </span>
         </div>
       </div>
 
@@ -119,7 +121,7 @@ const ConfigModal = ({
               rel="noopener noreferrer"
               className="system-xs-regular inline-flex items-center gap-1 text-text-accent hover:underline"
             >
-              {t('sandboxProvider.configModal.readDocLink', { ns: 'common', provider: provider.label })}
+              {t('sandboxProvider.configModal.readDocLink', { ns: 'common', provider: t(PROVIDER_LABEL_KEYS[provider.provider_type as keyof typeof PROVIDER_LABEL_KEYS] ?? 'sandboxProvider.e2b.label', { ns: 'common' }) })}
               <RiExternalLinkLine className="h-3 w-3" />
             </a>
           )}
diff --git a/web/app/components/header/account-setting/sandbox-provider-page/constants.ts b/web/app/components/header/account-setting/sandbox-provider-page/constants.ts
index eefd98356d2..a5d60aad880 100644
--- a/web/app/components/header/account-setting/sandbox-provider-page/constants.ts
+++ b/web/app/components/header/account-setting/sandbox-provider-page/constants.ts
@@ -7,6 +7,13 @@ export const PROVIDER_ICONS: Record<string, string> = {
   local: '/sandbox-providers/local.svg',
 }
 
+export const PROVIDER_LABEL_KEYS = {
+  e2b: 'sandboxProvider.e2b.label',
+  daytona: 'sandboxProvider.daytona.label',
+  docker: 'sandboxProvider.docker.label',
+  local: 'sandboxProvider.local.label',
+} as const
+
 export const PROVIDER_DESCRIPTION_KEYS = {
   e2b: 'sandboxProvider.e2b.description',
   daytona: 'sandboxProvider.daytona.description',
diff --git a/web/app/components/header/account-setting/sandbox-provider-page/provider-card.tsx b/web/app/components/header/account-setting/sandbox-provider-page/provider-card.tsx
index c1a529402f3..fac890ef155 100644
--- a/web/app/components/header/account-setting/sandbox-provider-page/provider-card.tsx
+++ b/web/app/components/header/account-setting/sandbox-provider-page/provider-card.tsx
@@ -7,7 +7,7 @@ import { useTranslation } from 'react-i18next'
 import Button from '@/app/components/base/button'
 import Indicator from '@/app/components/header/indicator'
 import { cn } from '@/utils/classnames'
-import { PROVIDER_DESCRIPTION_KEYS } from './constants'
+import { PROVIDER_DESCRIPTION_KEYS, PROVIDER_LABEL_KEYS } from './constants'
 import ProviderIcon from './provider-icon'
 
 type ProviderCardProps = {
@@ -45,7 +45,7 @@ const ProviderCard = ({
       <div className="min-w-0 flex-1">
         <div className="flex items-center gap-1">
           <span className="system-md-semibold text-text-primary">
-            {provider.label}
+            {t(PROVIDER_LABEL_KEYS[provider.provider_type as keyof typeof PROVIDER_LABEL_KEYS] ?? 'sandboxProvider.e2b.label', { ns: 'common' })}
           </span>
           {provider.is_system_configured && !provider.is_tenant_configured && (
             <span className="system-2xs-medium rounded-[5px] border border-divider-deep px-[5px] py-[3px] text-text-tertiary">
diff --git a/web/app/components/header/account-setting/sandbox-provider-page/switch-modal.tsx b/web/app/components/header/account-setting/sandbox-provider-page/switch-modal.tsx
index d423dd91150..c15049b2e20 100644
--- a/web/app/components/header/account-setting/sandbox-provider-page/switch-modal.tsx
+++ b/web/app/components/header/account-setting/sandbox-provider-page/switch-modal.tsx
@@ -7,6 +7,7 @@ import Button from '@/app/components/base/button'
 import Modal from '@/app/components/base/modal'
 import { useToastContext } from '@/app/components/base/toast'
 import { useActivateSandboxProvider } from '@/service/use-sandbox-provider'
+import { PROVIDER_LABEL_KEYS } from './constants'
 
 type SwitchModalProps = {
   provider: SandboxProvider
@@ -57,7 +58,7 @@ const SwitchModal = ({
           <Trans
             i18nKey="sandboxProvider.switchModal.confirmText"
             ns="common"
-            values={{ provider: provider.label }}
+            values={{ provider: t(PROVIDER_LABEL_KEYS[provider.provider_type as keyof typeof PROVIDER_LABEL_KEYS] ?? 'sandboxProvider.e2b.label', { ns: 'common' }) }}
             components={{ bold: <span className="system-sm-semibold" /> }}
           />
         </div>
diff --git a/web/types/sandbox-provider.ts b/web/types/sandbox-provider.ts
index 7c8478e2c91..178db2fba0e 100644
--- a/web/types/sandbox-provider.ts
+++ b/web/types/sandbox-provider.ts
@@ -5,9 +5,6 @@ export type ConfigSchema = {
 
 export type SandboxProvider = {
   provider_type: string
-  label: string
-  description: string
-  icon: string
   is_system_configured: boolean
   is_tenant_configured: boolean
   is_active: boolean