feat(openapi): add delete app action

client/web/plugins/com.msgbyte.openapi/src/MainPanel/AppInfo/Profile.tsx

@@ -1,7 +1,13 @@
 import { useOpenAppInfo } from '../context';
 import React from 'react';
-import { FullModalField, Divider, SensitiveText } from '@capital/component';
+import {
+  FullModalField,
+  Divider,
+  SensitiveText,
+  Button,
+} from '@capital/component';
 import { Translate } from '../../translate';
+import { useOpenAppAction } from './useOpenAppAction';
 import './Profile.less';
 
 /**
@@ -10,6 +16,8 @@ import './Profile.less';
 const Profile: React.FC = React.memo(() => {
   const { appId, appSecret } = useOpenAppInfo();
 
+  const { handleDeleteApp } = useOpenAppAction();
+
   return (
     <div className="plugin-openapi-app-info_profile">
       <h2>{Translate.app.appcret}</h2>
@@ -22,11 +30,11 @@ const Profile: React.FC = React.memo(() => {
         />
       </div>
 
-      {/* <Divider /> */}
+      <Divider />
-
-      {/* <h2>{Translate.app.basicInfo}</h2> */}
 
-      {/* TODO */}
+      <Button type="primary" danger={true} onClick={handleDeleteApp}>
+        {Translate.delete}
+      </Button>
     </div>
   );
 });

client/web/plugins/com.msgbyte.openapi/src/MainPanel/AppInfo/useOpenAppAction.tsx

@@ -1,4 +1,10 @@
-import { postRequest, useAsyncFn } from '@capital/common';
+import {
+  openReconfirmModal,
+  postRequest,
+  showErrorToasts,
+  useAsyncFn,
+  useEvent,
+} from '@capital/common';
 import { useOpenAppInfo } from '../context';
 import type { OpenAppBot, OpenAppCapability, OpenAppOAuth } from '../types';
 
@@ -6,7 +12,7 @@ import type { OpenAppBot, OpenAppCapability, OpenAppOAuth } from '../types';
  * 开放应用操作
  */
 export function useOpenAppAction() {
-  const { refresh, appId, capability } = useOpenAppInfo();
+  const { refresh, appId, capability, onSelectApp } = useOpenAppInfo();
 
   const [{ loading }, handleChangeAppCapability] = useAsyncFn(
     async (targetCapability: OpenAppCapability, checked: boolean) => {
@@ -56,8 +62,25 @@ export function useOpenAppAction() {
     [appId, refresh]
   );
 
+  const handleDeleteApp = useEvent(() => {
+    openReconfirmModal({
+      onConfirm: async () => {
+        try {
+          await postRequest('/openapi/app/delete', {
+            appId,
+          });
+          onSelectApp(null);
+          await refresh();
+        } catch (err) {
+          showErrorToasts(err);
+        }
+      },
+    });
+  });
+
   return {
     loading,
+    handleDeleteApp,
     handleChangeAppCapability,
     handleUpdateOAuthInfo,
     handleUpdateBotInfo,

client/web/plugins/com.msgbyte.openapi/src/MainPanel/context.tsx

@@ -3,6 +3,7 @@ import { OpenApp } from './types';
 
 interface OpenAppInfoContextProps extends OpenApp {
   refresh: () => Promise<void>;
+  onSelectApp: (appId: string | null) => void;
 }
 
 const OpenAppInfoContext = React.createContext<OpenAppInfoContextProps>(null);
@@ -12,6 +13,7 @@ export const OpenAppInfoProvider: React.FC<
   React.PropsWithChildren<{
     appInfo: OpenApp;
     refresh: OpenAppInfoContextProps['refresh'];
+    onSelectApp: OpenAppInfoContextProps['onSelectApp'];
   }>
 > = (props) => {
   return (
@@ -19,6 +21,7 @@ export const OpenAppInfoProvider: React.FC<
       value={{
         ...props.appInfo,
         refresh: props.refresh,
+        onSelectApp: props.onSelectApp,
       }}
     >
       {props.children}

client/web/plugins/com.msgbyte.openapi/src/MainPanel/index.tsx

@@ -50,7 +50,11 @@ const OpenApiMainPanel: React.FC = React.memo(() => {
     <Loading spinning={loading} style={{ height: '100%' }}>
       <div className="plugin-openapi-main-panel">
         {appInfo ? (
-          <OpenAppInfoProvider appInfo={appInfo} refresh={refresh}>
+          <OpenAppInfoProvider
+            appInfo={appInfo}
+            onSelectApp={handleSetSelectedApp}
+            refresh={refresh}
+          >
             <AppInfo />
           </OpenAppInfoProvider>
         ) : (

client/web/plugins/com.msgbyte.openapi/src/MainPanel/useOpenAppList.ts

@@ -47,7 +47,7 @@ export function useOpenAppList() {
     /**
      * 设置当前选中的开放app
      */
-    handleSetSelectedApp(appId: string) {
+    handleSetSelectedApp(appId: string | null) {
       navigate({
         search: appendUrlSearch({
           appId,

client/web/plugins/com.msgbyte.openapi/src/translate.ts

@@ -18,6 +18,10 @@ export const Translate = {
     'zh-CN': '操作',
     'en-US': 'Operation',
   }),
+  delete: localTrans({
+    'zh-CN': '删除',
+    'en-US': 'Delete',
+  }),
   enter: localTrans({
     'zh-CN': '进入',
     'en-US': 'Enter',

client/web/src/utils/url-helper.ts

@@ -15,10 +15,15 @@ export { urlSearchStringify, urlSearchParse };
  * 往当前的url search上追加
  */
 export function appendUrlSearch(obj: Record<string, string>): string {
-  return urlSearchStringify({
+  return urlSearchStringify(
+    {
       ...urlSearchParse(window.location.search, { ignoreQueryPrefix: true }),
       ...obj,
-  });
+    },
+    {
+      skipNulls: true,
+    }
+  );
 }
 
 /**

server/services/openapi/app.service.ts

@@ -4,10 +4,12 @@ import {
   TcDbService,
   TcContext,
   EntityError,
+  NoPermissionError,
 } from 'tailchat-server-sdk';
 import _ from 'lodash';
 import {
   filterAvailableAppCapability,
+  OpenApp,
   OpenAppBot,
   OpenAppDocument,
   OpenAppModel,
@@ -60,6 +62,11 @@ class OpenAppService extends TcService {
         appIcon: 'string',
       },
     });
+    this.registerAction('delete', this.delete, {
+      params: {
+        appId: 'string',
+      },
+    });
     this.registerAction('setAppCapability', this.setAppCapability, {
       params: {
         appId: 'string',
@@ -185,6 +192,36 @@ class OpenAppService extends TcService {
     return await this.transformDocuments(ctx, {}, doc);
   }
 
+  /**
+   * 删除开放平台应用
+   */
+  async delete(
+    ctx: TcContext<{
+      appId: string;
+    }>
+  ) {
+    const { appId } = ctx.params;
+    const userId = ctx.meta.userId;
+    const t = ctx.meta.t;
+
+    const appInfo: OpenApp = await this.localCall('get', {
+      appId,
+    });
+
+    if (String(appInfo.owner) !== userId) {
+      throw new NoPermissionError(t('没有操作权限'));
+    }
+
+    // 可能会出现ws机器人不会立即中断连接的问题，不重要暂时不处理
+
+    await this.adapter.model.remove({
+      appId,
+      owner: userId,
+    });
+
+    return true;
+  }
+
   /**
    * 设置应用开放的能力
    */