chore: update the update plugin from GitHub

web/app/components/plugins/install-plugin/install-from-github/steps/loaded.tsx

@@ -7,7 +7,7 @@ import Card from '../../../card'
 import Badge, { BadgeState } from '@/app/components/base/badge/index'
 import { pluginManifestToCardPluginProps } from '../../utils'
 import { useTranslation } from 'react-i18next'
-import { installPackageFromGitHub, uninstallPlugin } from '@/service/plugins'
+import { installPackageFromGitHub, updateFromGitHub } from '@/service/plugins'
 import { RiLoader2Line } from '@remixicon/react'
 import { usePluginTaskList } from '@/service/use-plugins'
 import checkTaskStatus from '../../base/check-task-status'
@@ -49,28 +49,49 @@ const Loaded: React.FC<LoadedProps> = ({
 
     try {
       const { owner, repo } = parseGitHubUrl(repoUrl)
-      const { all_installed: isInstalled, task_id: taskId } = await installPackageFromGitHub(
-        `${owner}/${repo}`,
-        selectedVersion,
-        selectedPackage,
-        uniqueIdentifier,
-      )
+      if (updatePayload) {
+        const { all_installed: isInstalled, task_id: taskId } = await updateFromGitHub(
+          `${owner}/${repo}`,
+          selectedVersion,
+          selectedPackage,
+          updatePayload.originalPackageInfo.id,
+          uniqueIdentifier,
+        )
 
-      if (updatePayload && isInstalled)
-        await uninstallPlugin(updatePayload.originalPackageInfo.id)
+        if (isInstalled) {
+          onInstalled()
+          return
+        }
+
+        handleRefetch()
+        await check({
+          taskId,
+          pluginUniqueIdentifier: uniqueIdentifier,
+        })
 
-      if (isInstalled) {
         onInstalled()
-        return
       }
+      else {
+        const { all_installed: isInstalled, task_id: taskId } = await installPackageFromGitHub(
+          `${owner}/${repo}`,
+          selectedVersion,
+          selectedPackage,
+          uniqueIdentifier,
+        )
+
+        if (isInstalled) {
+          onInstalled()
+          return
+        }
 
-      handleRefetch()
-      await check({
-        taskId,
-        pluginUniqueIdentifier: uniqueIdentifier,
-      })
+        handleRefetch()
+        await check({
+          taskId,
+          pluginUniqueIdentifier: uniqueIdentifier,
+        })
 
-      onInstalled()
+        onInstalled()
+      }
     }
     catch (e) {
       if (typeof e === 'string') {

web/app/components/plugins/plugin-item/action.tsx

@@ -21,6 +21,7 @@ const i18nPrefix = 'plugin.action'
 type Props = {
   author: string
   installationId: string
+  pluginUniqueIdentifier: string
   pluginName: string
   version: string
   usedInApps: number
@@ -33,6 +34,7 @@ type Props = {
 const Action: FC<Props> = ({
   author,
   installationId,
+  pluginUniqueIdentifier,
   pluginName,
   version,
   isShowFetchNewVersion,
@@ -70,7 +72,7 @@ const Action: FC<Props> = ({
             type: PluginSource.github,
             github: {
               originalPackageInfo: {
-                id: installationId,
+                id: pluginUniqueIdentifier,
                 repo: meta!.repo,
                 version: meta!.version,
                 package: meta!.package,

web/app/components/plugins/plugin-item/index.tsx

@@ -42,6 +42,7 @@ const PluginItem: FC<Props> = ({
     source,
     tenant_id,
     installation_id,
+    plugin_unique_identifier,
     endpoints_active,
     meta,
     plugin_id,
@@ -73,7 +74,7 @@ const PluginItem: FC<Props> = ({
             <img
               className='w-full h-full'
               src={`${API_PREFIX}/workspaces/current/plugin/icon?tenant_id=${tenant_id}&filename=${icon}`}
-              alt={`plugin-${installation_id}-logo`}
+              alt={`plugin-${plugin_unique_identifier}-logo`}
             />
           </div>
           <div className="ml-3 w-0 grow">
@@ -86,6 +87,7 @@ const PluginItem: FC<Props> = ({
               <Description text={description[locale]} descriptionLineRows={1}></Description>
               <div onClick={e => e.stopPropagation()}>
                 <Action
+                  pluginUniqueIdentifier={plugin_unique_identifier}
                   installationId={installation_id}
                   author={author}
                   pluginName={name}

web/app/components/plugins/types.ts

@@ -238,6 +238,11 @@ export type InstallPackageResponse = {
   task_id: string
 }
 
+export type updatePackageResponse = {
+  all_installed: boolean
+  task_id: string
+}
+
 export type uploadGitHubResponse = {
   unique_identifier: string
   manifest: PluginDeclaration

web/service/plugins.ts

@@ -8,6 +8,7 @@ import type {
   PluginTasksResponse,
   TaskStatusResponse,
   UninstallPluginResponse,
+  updatePackageResponse,
   uploadGitHubResponse,
 } from '@/app/components/plugins/types'
 import type {
@@ -30,6 +31,19 @@ export const updateFromMarketPlace = async (body: Record<string, string>) => {
   })
 }
 
+export const updateFromGitHub = async (repoUrl: string, selectedVersion: string, selectedPackage: string,
+  originalPlugin: string, newPlugin: string) => {
+  return post<updatePackageResponse>('/workspaces/current/plugin/upgrade/github', {
+    body: {
+      repo: repoUrl,
+      version: selectedVersion,
+      package: selectedPackage,
+      original_plugin_unique_identifier: originalPlugin,
+      new_plugin_unique_identifier: newPlugin,
+    },
+  })
+}
+
 export const uploadGitHub = async (repoUrl: string, selectedVersion: string, selectedPackage: string) => {
   return post<uploadGitHubResponse>('/workspaces/current/plugin/upload/github', {
     body: {