From de9d1b4b74428293fd2e0e1d5651ceede0f89af5 Mon Sep 17 00:00:00 2001
From: FatttSnake <fatttsnake@gmail.com>
Date: Wed, 1 May 2024 18:09:37 +0800
Subject: [PATCH] Feat(Menu): Support multi-platform

Support add multi-platform tool to menu
---
 src/components/tools/RepositoryCard.tsx |  7 ++++-
 src/components/tools/StoreCard.tsx      | 15 +++++++---
 src/global.d.ts                         |  1 +
 src/pages/Tools/index.tsx               |  1 +
 src/pages/ToolsFramework.tsx            | 37 +++++++++++++++----------
 5 files changed, 41 insertions(+), 20 deletions(-)

diff --git a/src/components/tools/RepositoryCard.tsx b/src/components/tools/RepositoryCard.tsx
index 31d57a1..656bcc4 100644
--- a/src/components/tools/RepositoryCard.tsx
+++ b/src/components/tools/RepositoryCard.tsx
@@ -12,6 +12,7 @@ interface RepositoryCardProps
     toolName: string
     toolId: string
     ver: string
+    platform: Platform
     options?: TiltOptions
     onOpen?: () => void
     onEdit?: () => void
@@ -29,6 +30,7 @@ const RepositoryCard = ({
     toolName,
     toolId,
     ver,
+    platform,
     options = {
         reverse: true,
         max: 8,
@@ -52,7 +54,10 @@ const RepositoryCard = ({
     }, [options])
 
     return (
-        <Draggable id={toolId} data={{ icon, toolName, toolId, authorUsername: '!', ver }}>
+        <Draggable
+            id={`!:${toolId}:${ver}:${platform}`}
+            data={{ icon, toolName, toolId, authorUsername: '!', ver, platform }}
+        >
             <Card
                 data-component={'component-repository-card'}
                 style={{ overflow: 'visible', ...style }}
diff --git a/src/components/tools/StoreCard.tsx b/src/components/tools/StoreCard.tsx
index 63bd8d9..66b57b0 100644
--- a/src/components/tools/StoreCard.tsx
+++ b/src/components/tools/StoreCard.tsx
@@ -179,19 +179,26 @@ const StoreCard = ({
             )
             return
         }
-        navigateToView(navigate, author.username, toolId, platform)
+        navigateToView(navigate, author.username, toolId, 'DESKTOP')
     }
 
     const handleOnWebBtnClick = (e: MouseEvent<HTMLDivElement>) => {
         e.stopPropagation()
-        navigateToView(navigate, author.username, toolId, platform)
+        navigateToView(navigate, author.username, toolId, 'WEB')
     }
 
     return (
         <>
             <Draggable
-                id={`${author.username}:${toolId}:${ver}`}
-                data={{ icon, toolName, toolId, authorUsername: author.username, ver: '' }}
+                id={`${author.username}:${toolId}:${ver}:${platform}`}
+                data={{
+                    icon,
+                    toolName,
+                    toolId,
+                    authorUsername: author.username,
+                    ver: '',
+                    platform: platform
+                }}
             >
                 <Card
                     data-component={'component-store-card'}
diff --git a/src/global.d.ts b/src/global.d.ts
index 15496ad..41b47cc 100644
--- a/src/global.d.ts
+++ b/src/global.d.ts
@@ -661,4 +661,5 @@ interface ToolMenuItem {
     toolId: string
     authorUsername: string
     ver: string
+    platform: Platform
 }
diff --git a/src/pages/Tools/index.tsx b/src/pages/Tools/index.tsx
index 78aef88..a2bae0c 100644
--- a/src/pages/Tools/index.tsx
+++ b/src/pages/Tools/index.tsx
@@ -170,6 +170,7 @@ const ToolCard = ({ tools, onDelete, onUpgrade, onSubmit, onCancel }: ToolCardPr
             toolName={selectedTool.name}
             toolId={selectedTool.toolId}
             ver={selectedTool.ver}
+            platform={selectedTool.platform}
             onOpen={handleOnOpenTool}
             onEdit={handleOnEditTool()}
             onSource={handleOnSourceTool()}
diff --git a/src/pages/ToolsFramework.tsx b/src/pages/ToolsFramework.tsx
index 698698a..8217fd2 100644
--- a/src/pages/ToolsFramework.tsx
+++ b/src/pages/ToolsFramework.tsx
@@ -3,7 +3,7 @@ import { arrayMove, SortableContext } from '@dnd-kit/sortable'
 import type { DragEndEvent } from '@dnd-kit/core/dist/types'
 import '@/assets/css/pages/tools-framework.scss'
 import { tools } from '@/router/tools'
-import { getToolMenuItem, saveToolMenuItem } from '@/util/common'
+import { checkDesktop, getToolMenuItem, saveToolMenuItem } from '@/util/common'
 import { getViewPath } from '@/util/navigation'
 import FitFullscreen from '@/components/common/FitFullscreen'
 import Sidebar from '@/components/common/Sidebar'
@@ -34,12 +34,12 @@ const ToolsFramework = () => {
     const handleOnDragEnd = ({ active, over }: DragEndEvent) => {
         if (over && active.id !== over?.id) {
             const activeIndex = toolMenuItem.findIndex(
-                ({ authorUsername, toolId, ver }) =>
-                    `${authorUsername}:${toolId}:${ver}` === active.id
+                ({ authorUsername, toolId, ver, platform }) =>
+                    `${authorUsername}:${toolId}:${ver}:${platform}` === active.id
             )
             const overIndex = toolMenuItem.findIndex(
-                ({ authorUsername, toolId, ver }) =>
-                    `${authorUsername}:${toolId}:${ver}` === over.id
+                ({ authorUsername, toolId, ver, platform }) =>
+                    `${authorUsername}:${toolId}:${ver}:${platform}` === over.id
             )
             setToolMenuItem(arrayMove(toolMenuItem, activeIndex, overIndex))
         }
@@ -47,8 +47,8 @@ const ToolsFramework = () => {
         if (!over) {
             setToolMenuItem(
                 toolMenuItem.filter(
-                    ({ authorUsername, toolId, ver }) =>
-                        `${authorUsername}:${toolId}:${ver}` !== active?.id
+                    ({ authorUsername, toolId, ver, platform }) =>
+                        `${authorUsername}:${toolId}:${ver}:${platform}` !== active?.id
                 )
             )
         }
@@ -63,7 +63,12 @@ const ToolsFramework = () => {
                         ver === newItem.ver
                 ) === -1
             ) {
-                setToolMenuItem([...toolMenuItem, newItem])
+                if (!checkDesktop() && newItem.platform === 'DESKTOP') {
+                    void message.warning('暂不支持添加桌面端应用')
+                    setToolMenuItem(toolMenuItem)
+                } else {
+                    setToolMenuItem([...toolMenuItem, newItem])
+                }
             }
         }
 
@@ -110,8 +115,8 @@ const ToolsFramework = () => {
                                     <Sidebar.ItemList>
                                         <SortableContext
                                             items={toolMenuItem.map(
-                                                ({ authorUsername, toolId, ver }) =>
-                                                    `${authorUsername}:${toolId}:${ver}`
+                                                ({ authorUsername, toolId, ver, platform }) =>
+                                                    `${authorUsername}:${toolId}:${ver}:${platform}`
                                             )}
                                         >
                                             {toolMenuItem.map(
@@ -120,16 +125,18 @@ const ToolsFramework = () => {
                                                     toolName,
                                                     toolId,
                                                     authorUsername,
-                                                    ver
+                                                    ver,
+                                                    platform
                                                 }) => (
                                                     <Sortable
-                                                        id={`${authorUsername}:${toolId}:${ver}`}
+                                                        id={`${authorUsername}:${toolId}:${ver}:${platform}`}
                                                         data={{
                                                             icon,
                                                             toolName,
                                                             toolId,
                                                             authorUsername,
-                                                            ver
+                                                            ver,
+                                                            platform
                                                         }}
                                                         isDelete={isDelete}
                                                     >
@@ -137,12 +144,12 @@ const ToolsFramework = () => {
                                                             path={getViewPath(
                                                                 authorUsername,
                                                                 toolId,
-                                                                import.meta.env.VITE_PLATFORM,
+                                                                platform,
                                                                 ver
                                                             )}
                                                             icon={icon}
                                                             text={toolName}
-                                                            key={`${authorUsername}:${toolId}`}
+                                                            key={`${authorUsername}:${toolId}:${ver}:${platform}`}
                                                             extend={<DragHandle padding={10} />}
                                                         />
                                                     </Sortable>