diff --git a/web/app/components/explore/item-operation/index.tsx b/web/app/components/explore/item-operation/index.tsx index 00b8f3cbc9..8675f9dce1 100644 --- a/web/app/components/explore/item-operation/index.tsx +++ b/web/app/components/explore/item-operation/index.tsx @@ -38,12 +38,12 @@ const ItemOperation: FC = ({ }}>
{PinIcon} - {isPinned ? t('explore.sideBar.action.unpin') : t('explore.sideBar.action.pin')} + {isPinned ? t('explore.sidebar.action.unpin') : t('explore.sidebar.action.pin')}
{isShowDelete && (
- {t('explore.sideBar.action.delete')} + {t('explore.sidebar.action.delete')}
)} diff --git a/web/app/components/explore/sidebar/index.tsx b/web/app/components/explore/sidebar/index.tsx index e5c058228e..ef4a07b8db 100644 --- a/web/app/components/explore/sidebar/index.tsx +++ b/web/app/components/explore/sidebar/index.tsx @@ -1,5 +1,5 @@ 'use client' -import React, { FC, useEffect } from 'react' +import React, { FC, useEffect, useState } from 'react' import { useTranslation } from 'react-i18next' import { useContext } from 'use-context-selector' import ExploreContext from '@/context/explore-context' @@ -9,6 +9,7 @@ import Link from 'next/link' import Item from './app-nav-item' import { fetchInstalledAppList as doFetchInstalledAppList, uninstallApp, updatePinStatus } from '@/service/explore' import Toast from '../../base/toast' +import Confirm from '@/app/components/base/confirm' const SelectedDiscoveryIcon = () => ( @@ -37,12 +38,16 @@ const SideBar: FC<{ const {installed_apps} : any = await doFetchInstalledAppList() setInstalledApps(installed_apps) } - - const handleDelete = async (id: string) => { + + const [showConfirm, setShowConfirm] = useState(false) + const [currId, setCurrId] = useState('') + const handleDelete = async () => { + const id = currId await uninstallApp(id) + setShowConfirm(false) Toast.notify({ type: 'success', - message: t('common.api.Removed') + message: t('common.api.remove') }) fetchInstalledAppList() } @@ -96,13 +101,26 @@ const SideBar: FC<{ isPinned={is_pinned} togglePin={() => handleUpdatePinStatus(id, !is_pinned)} uninstallable={uninstallable} - onDelete={handleDelete} + onDelete={(id) => { + setCurrId(id) + setShowConfirm(true) + }} /> ) })} )} + {showConfirm && ( + setShowConfirm(false)} + onConfirm={handleDelete} + onCancel={() => setShowConfirm(false)} + /> + )} ) } diff --git a/web/i18n/lang/explore.en.ts b/web/i18n/lang/explore.en.ts index 699e1725cb..b981a79fd2 100644 --- a/web/i18n/lang/explore.en.ts +++ b/web/i18n/lang/explore.en.ts @@ -2,6 +2,15 @@ const translation = { sidebar: { discovery: 'Discovery', workspace: 'Workspace', + action: { + pin: 'Pin', + unpin: 'Unpin', + delete: 'Delete', + }, + delete: { + title: 'Delete app', + content: 'Are you sure you want to delete this app?', + } }, apps: { title: 'Explore Apps by Dify', @@ -17,13 +26,6 @@ const translation = { subTitle: 'App icon & name', nameRequired: 'App name is required', }, - sideBar: { - action: { - pin: 'Pin', - unpin: 'Unpin', - delete: 'Delete', - } - } } export default translation diff --git a/web/i18n/lang/explore.zh.ts b/web/i18n/lang/explore.zh.ts index f8fcee793f..3152b7730d 100644 --- a/web/i18n/lang/explore.zh.ts +++ b/web/i18n/lang/explore.zh.ts @@ -2,6 +2,15 @@ const translation = { sidebar: { discovery: '发现', workspace: '工作区', + action: { + pin: '置顶', + unpin: '取消置顶', + delete: '删除', + }, + delete: { + title: '删除程序', + content: '您确定要删除此程序吗?', + } }, apps: { title: '探索 Dify 的应用', @@ -17,13 +26,6 @@ const translation = { subTitle: '应用程序图标和名称', nameRequired: '应用程序名称不能为空', }, - sideBar: { - action: { - pin: '置顶', - unpin: '取消置顶', - delete: '删除', - } - } } export default translation