feat: i18n

www/components/base/client-selector.tsx

@@ -1,14 +1,23 @@
+"use client"
+
 import React from 'react'
 import { keepPreviousData, useQuery } from '@tanstack/react-query'
 import { listClient } from '@/api/client'
 import { Combobox } from './combobox'
+import { useTranslation } from 'react-i18next'
 
 export interface ClientSelectorProps {
   clientID?: string
   setClientID: (clientID: string) => void
   onOpenChange?: () => void
 }
-export const ClientSelector: React.FC<ClientSelectorProps> = ({ clientID, setClientID, onOpenChange }) => {
+
+export const ClientSelector: React.FC<ClientSelectorProps> = ({ 
+  clientID, 
+  setClientID, 
+  onOpenChange 
+}) => {
+  const { t } = useTranslation()
   const handleClientChange = (value: string) => { setClientID(value) }
   const [keyword, setKeyword] = React.useState('')
 
@@ -22,8 +31,11 @@ export const ClientSelector: React.FC<ClientSelectorProps> = ({ clientID, setCli
 
   return (
     <Combobox
-      placeholder='客户端名称'
-      dataList={clientList?.clients.map((client) => ({ value: client.id || '', label: client.id || '' })) || []}
+      placeholder={t('selector.client.placeholder')}
+      dataList={clientList?.clients.map((client) => ({ 
+        value: client.id || '', 
+        label: client.id || '' 
+      })) || []}
       setValue={handleClientChange}
       value={clientID}
       onKeyWordChange={setKeyword}