chore: updates

src/routes/setting/BotConfig/TestAPIKeyModal.tsx

@@ -50,7 +50,7 @@ const TestAPIKeyModal = ({ closeModal }: Props) => {
     return (
         <Modal id="modal-modal">
             <StyledModal
-                title={`Input API Key`}
+                title={key ? "" : `Input API Key`}
                 buttons={
                     <>
                         <Button className="cancel" onClick={closeModal}>

src/routes/setting/BotConfig/index.tsx

@@ -11,7 +11,7 @@ import IconDelete from '../../../assets/icons/delete.svg';
 import CreateModal from './CreateModal';
 import WebhookEdit from './WebhookEdit';
 import WebhookModal from './WebhookModal';
-import TestAPIKeyModal from './TestAPIKeyModal';
+// import TestAPIKeyModal from './TestAPIKeyModal';
 import DeleteModal from './DeleteModal';
 import BotAPIKeys from './BotAPIKeys';
 import { toast } from 'react-hot-toast';
@@ -28,7 +28,7 @@ const tdClass = "p-6 whitespace-nowrap text-sm font-medium text-gray-900 align-t
 type WebhookParams = { webhook?: string, uid: number };
 type DeleteParams = { name: string, uid: number };
 export default function BotConfig() {
-  const [testAPIKeyModalVisible, setTestAPIKeyModalVisible] = useState(false);
+  // const [testAPIKeyModalVisible, setTestAPIKeyModalVisible] = useState(false);
   const [updateAvatar, { isSuccess: updateAvatarSuccess }] = useUpdateAvatarByAdminMutation();
   const [createModalVisible, setCreateModalVisible] = useState(false);
   const [currWebhookParams, setCurrWebhookParams] = useState<WebhookParams | undefined>(undefined);
@@ -37,9 +37,9 @@ export default function BotConfig() {
   const { t } = useTranslation("setting", { keyPrefix: "bot" });
   const { t: ct } = useTranslation();
 
-  const toggleTestAPIKeyModalVisible = () => {
-    setTestAPIKeyModalVisible(prev => !prev);
-  };
+  // const toggleTestAPIKeyModalVisible = () => {
+  //   setTestAPIKeyModalVisible(prev => !prev);
+  // };
   const toggleCreateModalVisible = () => {
     setCreateModalVisible(prev => !prev);
   };
@@ -65,10 +65,14 @@ export default function BotConfig() {
           <Tip title={t("webhook_tip_title")} desc={t("webhook_tip_desc")} />
         </div>
         <div className="flex flex-col gap-1">
-          <h2 className='font-semibold'>{t("manage")}</h2>
+          <h2 className='font-semibold flex gap-4 items-center'>
+            {t("manage")}
+            <a href="https://doc.voce.chat/bot-and-webhook" target="_blank" className="text-sm text-blue-400 underline-offset-1 underline" rel="noopener noreferrer">
+              🔗 {t("how_to_use")}
+            </a>
+          </h2>
           <p className='text-gray-500 text-xs'>{t("manage_desc")}</p>
         </div>
-
         <div className="w-fit  overflow-hidden">
           <table className="min-w-full table-auto">
             <thead className="border-b bg-gray-50">
@@ -114,14 +118,14 @@ export default function BotConfig() {
         {/* <Button onClick={toggleCreateModalVisible} className="ghost small">{ct("action.add")}</Button> */}
         <div className="flex gap-4">
           <Button onClick={toggleCreateModalVisible} className="small">{ct("action.add")}</Button>
-          <Button onClick={toggleTestAPIKeyModalVisible} className="ghost small stroke-slate-200 fill-gray-200"> Test API Key</Button>
+          {/* {bots.length > 0 && <Button onClick={toggleTestAPIKeyModalVisible} className="ghost small stroke-slate-200 fill-gray-200"> Test API Key</Button>} */}
         </div>
 
       </div>
       {createModalVisible && <CreateModal closeModal={toggleCreateModalVisible} />}
       {currWebhookParams && <WebhookModal closeModal={toggleWebhookModalVisible} {...currWebhookParams} />}
       {currDeleteParams && <DeleteModal closeModal={toggleDeleteModalVisible} {...currDeleteParams} />}
-      {testAPIKeyModalVisible && <TestAPIKeyModal closeModal={toggleTestAPIKeyModalVisible} />}
+      {/* {testAPIKeyModalVisible && <TestAPIKeyModal closeModal={toggleTestAPIKeyModalVisible} />} */}
     </>
   );
 }