petercat-ai · xingwanying · Dec 6, 2024 · Dec 4, 2024 · Dec 4, 2024 · Dec 5, 2024
diff --git a/client/.kiwi/en/components.ts b/client/.kiwi/en/components.ts
@@ -54,6 +54,9 @@ export default {
     gengXinZhiShi: 'Update Knowledge',
     gengXinZhiShiKu: 'Update Knowledge Base (Coming Soon)',
     tiaoShi: 'Debug',
+    yiZaiTEX: 'Already deployed on {val1}',
+    guanWang: 'Official website',
+    gITHU: ' GitHub platform',
   },
   CreateButton: {
     chuangJianTOK: 'Create Token',

diff --git a/client/.kiwi/ja/components.ts b/client/.kiwi/ja/components.ts
@@ -53,6 +53,9 @@ export default {
     gengXinZhiShi: '知識を更新',
     gengXinZhiShiKu: 'ナレッジベースを更新（近日公開）',
     tiaoShi: 'デバッグ',
+    yiZaiTEX: '{val1} に展開済み',
+    guanWang: '公式ウェブサイト',
+    gITHU: ' GitHubプラットフォーム',
   },
   CreateButton: {
     chuangJianTOK: 'トークンを作成',

diff --git a/client/.kiwi/ko/components.ts b/client/.kiwi/ko/components.ts
@@ -53,6 +53,9 @@ export default {
     gengXinZhiShi: '지식 업데이트',
     gengXinZhiShiKu: '지식 베이스 업데이트(Coming Soon)',
     tiaoShi: '디버그',
+    yiZaiTEX: '{val1}에서 이미 배포됨',
+    guanWang: '공식 웹사이트',
+    gITHU: ' GitHub 플랫폼',
   },
   CreateButton: {
     chuangJianTOK: '토큰 생성',

diff --git a/client/.kiwi/zh-CN/components.ts b/client/.kiwi/zh-CN/components.ts
@@ -53,6 +53,9 @@ export default {
     gengXinZhiShi: '更新知识',
     gengXinZhiShiKu: '更新知识库(Coming Soon)',
     tiaoShi: '调试',
+    yiZaiTEX: '已在{val1}部署',
+    guanWang: '官网',
+    gITHU: ' GitHub 平台',
   },
   CreateButton: {
     chuangJianTOK: '创建 Token',

diff --git a/client/.kiwi/zh-TW/components.ts b/client/.kiwi/zh-TW/components.ts
@@ -53,6 +53,9 @@ export default {
     gengXinZhiShi: '更新知識',
     gengXinZhiShiKu: '更新知識庫(Coming Soon)',
     tiaoShi: '調試',
+    yiZaiTEX: '已在{val1}部署',
+    guanWang: '官網',
+    gITHU: ' GitHub 平台',
   },
   CreateButton: {
     chuangJianTOK: '創建 Token',

diff --git a/client/app/factory/edit/components/Knowledge.tsx b/client/app/factory/edit/components/Knowledge.tsx
@@ -59,7 +59,9 @@ const ChunkCard = ({ update_timestamp, content, file_path }: RAGDoc) => {
               <ModalHeader className="flex flex-col gap-1">
                 {file_path}
               </ModalHeader>
-              <ModalBody>{content}</ModalBody>
+              <ModalBody>
+                <div className="w-full break-words">{content}</div>
+              </ModalBody>
             </>
           )}
         </ModalContent>
@@ -83,11 +85,7 @@ export default function Knowledge({ repoName, goBack }: IProps) {
   const [pageSize, setPageSize] = React.useState(12);
   const [pageNumber, setPageNumber] = React.useState(1);
   const { taskProfile } = useBotTask();
-  const {
-    data: RagDocData,
-    isPending,
-    isLoading: isListLoading,
-  } = useBotRAGChunkList(
+  const { data: RagDocData, isFetching } = useBotRAGChunkList(
     repoName,
     pageSize,
     pageNumber,
@@ -123,8 +121,8 @@ export default function Knowledge({ repoName, goBack }: IProps) {
         </div>
       </div>
       <div className="pt-[40px] py-[40px] overflow-y-auto">
-        <MySpinner loading={isPending || isListLoading}>
-          {list.length > 0 || isPending ? (
+        <MySpinner loading={isFetching}>
+          {list.length > 0 || isFetching ? (
             <ChunkList data={list}></ChunkList>
           ) : (
             <div className="flex justify-center items-center h-full">
@@ -144,6 +142,9 @@ export default function Knowledge({ repoName, goBack }: IProps) {
             page={pageNumber}
             size="lg"
             onChange={(page) => setPageNumber(page)}
+            classNames={{
+              cursor: 'bg-gray-700',
+            }}
           />
         ) : null}
       </div>

diff --git a/client/app/factory/edit/components/KnowledgeBtn.tsx b/client/app/factory/edit/components/KnowledgeBtn.tsx
@@ -26,8 +26,6 @@ const KnowledgeBtn = (props: IProps) => {
 
   const { data: taskList } = useGetBotRagTask(
     repoName,
-    // if repoName is not empty, query taskList
-    !!repoName,
     // if task is running, query every 5s
     // if task is completed, query once
     taskLoading,

diff --git a/client/app/factory/list/components/BotCard.tsx b/client/app/factory/list/components/BotCard.tsx
@@ -17,23 +17,68 @@ import {
   Tooltip,
 } from '@nextui-org/react';
 import { useRouter } from 'next/navigation';
-import { useBotDelete, useGetBotRagTask } from '@/app/hooks/useBot';
-import CloudIcon from '@/public/icons/CloudIcon';
-import MinusCircleIcon from '@/public/icons/MinusCircleIcon';
+import {
+  useBotDelete,
+  useGetBotBoundRepos,
+  useGetBotRagTask,
+} from '@/app/hooks/useBot';
 import { TaskStatus } from '@/types/task';
 import ErrorBadgeIcon from '@/public/icons/ErrorBadgeIcon';
-import CheckBadgeIcon from '@/public/icons/CheckBadgeIcon';
-import LoadingIcon from '@/public/icons/LoadingIcon';
+import KnowledgeTaskCompleteIcon from '@/public/icons/CheckBadgeIcon';
+import KnowledgeTaskRunningIcon from '@/public/icons/LoadingIcon';
 import { RagTask } from '@/app/services/BotsController';
+import CardGithubIcon from '@/public/icons/CardGithubIcon';
+import CardHomeIcon from '@/public/icons/CardHomeIcon';
+import CardCartIcon from '@/public/icons/CardCartIcon';
 
 declare type Bot = Tables<'bots'>;
 
+const BotInfoIconList = (props: { bot: Bot }) => {
+  const { bot } = props;
+  const { data } = useGetBotBoundRepos(bot.id);
+  const showHomeIcon = bot.domain_whitelist && bot.domain_whitelist.length > 0;
+  const showCartIcon = bot.public;
+  const showGithubIcon = data && Array.isArray(data) && data.length > 0;
+  const texts = [
+    showGithubIcon ? I18N.components.BotCard.gITHU : '',
+    showHomeIcon ? I18N.components.BotCard.guanWang : undefined,
+    showCartIcon ? I18N.components.Navbar.shiChang : undefined,
+  ].filter(Boolean);
+  const toolTipText = I18N.template?.(I18N.components.BotCard.yiZaiTEX, {
+    val1: texts.join('、'),
+  });
+  const isSingle = texts.length === 1;
+  return (
+    <Tooltip
+      content={toolTipText}
+      classNames={{
+        base: [
+          // arrow color
+          'before:bg-[#3F3F46] dark:before:bg-white',
+        ],
+        content: ['py-2 px-4 rounded-lg  shadow-xl text-white', 'bg-[#3F3F46]'],
+      }}
+    >
+      <div className="flex flex-row">
+        <div className="z-[9]">{showGithubIcon && <CardGithubIcon />}</div>
+        <div className={`${isSingle ? '' : '-ml-1.5'} z-[8]`}>
+          {showHomeIcon && <CardHomeIcon />}
+        </div>
+        <div className={`${isSingle ? '' : '-ml-1.5'} z-[7]`}>
+          {showCartIcon && <CardCartIcon />}
+        </div>
+      </div>
+    </Tooltip>
+  );
+};
+
 const BotCard = (props: { bot: Bot }) => {
+  const [isHovered, setIsHovered] = useState(false);
   const { isOpen, onOpen, onOpenChange, onClose } = useDisclosure();
   const { bot } = props;
   const router = useRouter();
   const { deleteBot, isLoading, isSuccess } = useBotDelete();
-  const { data: taskInfo } = useGetBotRagTask(bot.id, true, false);
+  const { data: taskInfo } = useGetBotRagTask(bot.repo_name!, false);
 
   useEffect(() => {
     if (isSuccess) {
@@ -57,14 +102,14 @@ const BotCard = (props: { bot: Bot }) => {
       ? TaskStatus.COMPLETED
       : 'others';
     if (status === TaskStatus.COMPLETED) {
-      return <CheckBadgeIcon />;
+      return <KnowledgeTaskCompleteIcon />;
     }
     if (status === TaskStatus.ERROR) {
       return <ErrorBadgeIcon />;
     }
     return (
       <span className="animate-spinner-ease-spin">
-        <LoadingIcon />
+        <KnowledgeTaskRunningIcon />
       </span>
     );
   };
@@ -82,7 +127,13 @@ const BotCard = (props: { bot: Bot }) => {
             className="relative overflow-hidden w-full h-full bg-cover bg-center rounded-[8px]"
             style={{ backgroundImage: `url(${bot.avatar})` }}
           >
-            <div className="absolute inset-0 bg-white bg-opacity-70 backdrop-blur-[70px] rounded-[8px]"></div>
+            <div
+              className="absolute inset-0 bg-white backdrop-blur-[150px] rounded-[8px]"
+              style={{
+                background:
+                  'linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, #FFFFFF 100%)',
+              }}
+            ></div>
             <div className="flex justify-center items-center h-full">
               <Image
                 shadow="none"
@@ -94,9 +145,21 @@ const BotCard = (props: { bot: Bot }) => {
                 src={bot.avatar!}
               />
             </div>
+            <div
+              className={`${
+                isHovered ? 'opacity-0' : 'hover:opacity-100'
+              } transition-all absolute bottom-0 w-full flex items-center justify-center`}
+            >
+              <BotInfoIconList bot={bot}></BotInfoIconList>
+            </div>
           </div>
-          <div className="z-10 opacity-0 rounded-[8px] hover:opacity-100 w-full h-full backdrop-blur-xl transition-all bg-gradient-to-b from-[rgba(255,255,255,0.65)] to-white absolute flex items-center justify-center">
-            <div className="flex items-center gap-10">
+          <div
+            className="z-10 opacity-0 rounded-[8px] hover:opacity-100 w-full backdrop-blur-xl transition-all bg-gradient-to-b from-[rgba(255,255,255,0.65)] to-white absolute flex items-center justify-center"
+            style={{ height: 'calc(100% - 24px)' }}
+            onMouseEnter={() => setIsHovered(true)}
+            onMouseLeave={() => setIsHovered(false)}
+          >
+            <div className="flex items-center gap-10 mt-[12px]">
               <Tooltip
                 showArrow
                 placement="top"
@@ -149,9 +212,6 @@ const BotCard = (props: { bot: Bot }) => {
               {bot.name}
             </span>
             <div className="flex items-center gap-2 shrink-0">
-              <div className="w-[32px] h-[32px] p-[7px] flex items-center rounded-[16px] bg-[#F4F4F5]">
-                {bot.public ? <CloudIcon /> : <MinusCircleIcon />}
-              </div>
               <div className="w-[32px] h-[32px] p-[7px] flex items-center rounded-[16px] bg-[#F4F4F5]">
                 {renderTaskStatusIcon(taskInfo ?? [])}
               </div>

diff --git a/client/app/hooks/useBot.ts b/client/app/hooks/useBot.ts
@@ -4,6 +4,7 @@ import {
   deleteBot,
   deployWebsite,
   getBotApprovalList,
+  getBotBoundRepos,
   getBotConfig,
   getBotDetail,
   getBotInfoByRepoName,
@@ -32,6 +33,16 @@ export const useBotDetail = (id: string) => {
   });
 };
 
+export const useGetBotBoundRepos =(id:string)=>{
+  return useQuery({
+    queryKey: [`bot.boundRepos.${id}`, id],
+    queryFn: async () => getBotBoundRepos(id),
+    select: (data) => data,
+    enabled: !!id,
+    retry: false,
+  });
+}
+
 export const useBotConfig = (id: string, enabled: boolean) => {
   return useQuery({
     queryKey: [`bot.config.${id}`, id],
@@ -135,14 +146,13 @@ export const useBotRAGChunkList = (
 
 export const useGetBotRagTask = (
   repoName: string,
-  enabled: boolean = true,
   refetchInterval: boolean = true,
 ) => {
   return useQuery({
     queryKey: [`rag.task`, repoName],
     queryFn: async () => getRagTask(repoName),
     select: (data) => data,
-    enabled,
+    enabled:!!repoName,
     retry: true,
     refetchInterval: refetchInterval ? 3 * 1000 : undefined,
   });

diff --git a/client/app/services/BotsController.ts b/client/app/services/BotsController.ts
@@ -16,6 +16,13 @@ export async function getBotDetail(id: string): Promise<Bot[]> {
   return response.data.data;
 }
 
+export async function getBotBoundRepos(id: string): Promise<GithubRepoConfig[]> {
+  const response = await axios.get(
+    `${apiDomain}/api/bot/bound_to_repository?bot_id=${id}`,
+  );
+  return response.data.data;
+}
+
 // Get current user's bot profile by id
 export async function getBotConfig(id: string): Promise<Bot[]> {
   const response = await axios.get(`${apiDomain}/api/bot/config?id=${id}`);

diff --git a/client/components/BotCard.tsx b/client/components/BotCard.tsx
@@ -27,7 +27,13 @@ const BotCard = (props: {
           className="relative overflow-hidden w-full h-full bg-cover bg-center rounded-[8px]"
           style={{ backgroundImage: `url(${bot.avatar})` }}
         >
-          <div className="absolute inset-0 bg-white bg-opacity-70 backdrop-blur-[70px] rounded-[8px]"></div>
+          <div
+            className="absolute inset-0 bg-white backdrop-blur-[150px] rounded-[8px]"
+            style={{
+              background:
+                'linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, #FFFFFF 100%)',
+            }}
+          ></div>
           <div className="flex justify-center items-center h-full">
             <Image
               shadow="none"
@@ -50,7 +56,6 @@ const BotCard = (props: {
             {bot.name}
           </span>
         </div>
-
         <div className="flex-1 w-full border-zinc-100/50 text-left text-gray-400 font-[400] text-[14px] leading-[22px]">
           <p className="my-0 overflow-hidden text-ellipsis line-clamp-2">
             {bot.description}

diff --git a/client/public/icons/CardCartIcon.tsx b/client/public/icons/CardCartIcon.tsx
@@ -0,0 +1,43 @@
+const CardCartIcon = () => (
+  <svg
+    width="26"
+    height="24"
+    viewBox="0 0 26 24"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M0.833496 12C0.833496 18.9036 6.42994 24.5 13.3335 24.5C20.2371 24.5 25.8335 18.9036 25.8335 12C25.8335 5.09644 20.2371 -0.5 13.3335 -0.5C6.42994 -0.5 0.833496 5.09644 0.833496 12Z"
+      fill="#059669"
+    />
+    <path
+      d="M0.833496 12C0.833496 18.9036 6.42994 24.5 13.3335 24.5C20.2371 24.5 25.8335 18.9036 25.8335 12C25.8335 5.09644 20.2371 -0.5 13.3335 -0.5C6.42994 -0.5 0.833496 5.09644 0.833496 12Z"
+      stroke="white"
+    />
+    <g clip-path="url(#clip0_4390_1921)">
+      <path
+        d="M6.70068 5.89146C6.70068 5.60151 6.93573 5.36646 7.22568 5.36646H8.36561C8.97748 5.36646 9.49551 5.81794 9.57912 6.42407L9.62637 6.76662C12.8321 6.77529 15.9603 7.11556 18.9785 7.75511C19.2583 7.8144 19.4392 8.08675 19.3853 8.36763C19.1008 9.85029 18.7209 11.2991 18.2521 12.7073C18.1807 12.9218 17.98 13.0665 17.754 13.0665H10.2007C10.1207 13.0665 10.0421 13.0718 9.96543 13.0821C9.3505 13.1645 8.83633 13.5672 8.59626 14.1165H18.0757C18.3656 14.1165 18.6007 14.3515 18.6007 14.6415C18.6007 14.9314 18.3656 15.1665 18.0757 15.1665H7.93232C7.78616 15.1665 7.64662 15.1055 7.54726 14.9983C7.44791 14.8911 7.39774 14.7474 7.40883 14.6016C7.49564 13.4604 8.26536 12.5113 9.31048 12.1611L8.53897 6.56754C8.52702 6.48095 8.45302 6.41646 8.36561 6.41646H7.22568C6.93573 6.41646 6.70068 6.1814 6.70068 5.89146Z"
+        fill="white"
+      />
+      <path
+        d="M10.2007 16.9165C10.2007 17.4964 9.73058 17.9665 9.15068 17.9665C8.57078 17.9665 8.10068 17.4964 8.10068 16.9165C8.10068 16.3366 8.57078 15.8665 9.15068 15.8665C9.73058 15.8665 10.2007 16.3366 10.2007 16.9165Z"
+        fill="white"
+      />
+      <path
+        d="M16.8507 17.9665C17.4306 17.9665 17.9007 17.4964 17.9007 16.9165C17.9007 16.3366 17.4306 15.8665 16.8507 15.8665C16.2708 15.8665 15.8007 16.3366 15.8007 16.9165C15.8007 17.4964 16.2708 17.9665 16.8507 17.9665Z"
+        fill="white"
+      />
+    </g>
+    <defs>
+      <clipPath id="clip0_4390_1921">
+        <rect
+          width="14"
+          height="14"
+          fill="white"
+          transform="translate(6.00049 4.6665)"
+        />
+      </clipPath>
+    </defs>
+  </svg>
+);
+export default CardCartIcon;
diff --git a/client/public/icons/CardGithubIcon.tsx b/client/public/icons/CardGithubIcon.tsx
@@ -0,0 +1,23 @@
+const CardGithubIcon = () => (
+  <svg
+    width="25"
+    height="24"
+    viewBox="0 0 25 24"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M-0.5 12C-0.5 18.9036 5.09644 24.5 12 24.5C18.9036 24.5 24.5 18.9036 24.5 12C24.5 5.09644 18.9036 -0.5 12 -0.5C5.09644 -0.5 -0.5 5.09644 -0.5 12Z"
+      fill="#3F3F46"
+    />
+    <path
+      d="M-0.5 12C-0.5 18.9036 5.09644 24.5 12 24.5C18.9036 24.5 24.5 18.9036 24.5 12C24.5 5.09644 18.9036 -0.5 12 -0.5C5.09644 -0.5 -0.5 5.09644 -0.5 12Z"
+      stroke="white"
+    />
+    <path
+      d="M14.7809 19.5483C14.3338 19.6349 14.1751 19.3599 14.1751 19.1253C14.1751 19.029 14.1762 18.8604 14.1777 18.635L14.1777 18.6344V18.6343C14.1808 18.1795 14.1853 17.4938 14.1853 16.7052C14.1853 15.8826 13.9035 15.3459 13.5872 15.0722C15.5509 14.8539 17.6138 14.1081 17.6138 10.7211C17.6138 9.75832 17.2717 8.97167 16.7063 8.35413C16.7978 8.13199 17.0998 7.2351 16.6198 6.02042C16.6198 6.02042 15.8803 5.7834 14.1972 6.92436C13.4924 6.72891 12.7374 6.63098 11.988 6.62766C11.2386 6.63098 10.4842 6.72891 9.78079 6.92436C8.0956 5.7834 7.35509 6.02042 7.35509 6.02042C6.87628 7.2351 7.1781 8.13199 7.26967 8.35413C6.70553 8.97167 6.36103 9.75839 6.36103 10.7211C6.36103 14.1001 8.4201 14.8562 10.3788 15.0792C10.1266 15.2995 9.89801 15.6884 9.81889 16.2584C9.31568 16.4837 8.03923 16.8735 7.25273 15.5253C7.25273 15.5253 6.78644 14.6788 5.9009 14.6166C5.9009 14.6166 5.04053 14.6054 5.84059 15.1527C5.84059 15.1527 6.41857 15.4237 6.81971 16.443C6.81971 16.443 7.33738 18.0169 9.79075 17.4834C9.79279 17.8861 9.79617 18.2763 9.79882 18.5816L9.79882 18.5823L9.79883 18.5832C9.80102 18.8358 9.80271 19.0301 9.80271 19.1253C9.80271 19.3582 9.64087 19.6311 9.20018 19.5495C9.20018 19.5495 9.78079 20 11.9905 20C14.1751 20 14.7809 19.5483 14.7809 19.5483Z"
+      fill="white"
+    />
+  </svg>
+);
+export default CardGithubIcon;