refactor(plugin-file-manager): move client code into plugin folder and enable path config (#913)

# Conflicts:
#	packages/app/client/src/pages/index.tsx
#	packages/core/client/src/application/Application.tsx
#	packages/core/client/src/file-manager/index.ts
#	packages/plugins/file-manager/package.json
#	packages/plugins/file-manager/src/client/FileStorage.tsx
#	packages/plugins/file-manager/src/client/FileStorageShortcut.tsx

packages/core/client/src/application/Application.tsx

@@ -9,7 +9,6 @@ import { APIClient, APIClientProvider } from '../api-client';
 import { BlockSchemaComponentProvider } from '../block-provider';
 import { CollectionManagerShortcut } from '../collection-manager';
 import { RemoteDocumentTitleProvider } from '../document-title';
-import { FileStorageShortcut } from '../file-manager';
 import { i18n } from '../i18n';
 import { PluginManagerProvider } from '../plugin-manager';
 import PMProvider, { PluginManagerLink, SettingsCenterDropdown } from '../pm';
@@ -101,7 +100,6 @@ export class Application {
         CollectionManagerShortcut,
         SystemSettingsShortcut,
         SchemaTemplateShortcut,
-        FileStorageShortcut,
         PluginManagerLink,
         SettingsCenterDropdown,
       },

packages/core/client/src/file-manager/FileStorage.tsx

@@ -1,26 +0,0 @@
-import { uid } from '@formily/shared';
-import { Card } from 'antd';
-import React, { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { SchemaComponent } from '../schema-component';
-import { storageSchema } from './schemas/storage';
-import { StorageOptions } from './StorageOptions';
-
-const schema = {
-  type: 'object',
-  properties: {
-    [uid()]: storageSchema,
-  },
-};
-
-export const FileStoragePane = () => {
-  const [visible, setVisible] = useState(false);
-  const { t } = useTranslation();
-  return (
-    <Card bordered={false}>
-      <SchemaComponent components={{ StorageOptions }} schema={schema} />
-    </Card>
-  );
-};
-
-// WZvC&6cR8@aAJu!

packages/core/client/src/file-manager/index.ts

@@ -1,3 +0,0 @@
-export * from './FileStorage';
-export * from './FileStorageShortcut';
-

packages/core/client/src/index.tsx

@@ -11,7 +11,6 @@ export * from './board';
 export * from './china-region';
 export * from './collection-manager';
 export * from './document-title';
-export * from './file-manager';
 export * from './i18n';
 export * from './icon';
 export * from './plugin-manager';

packages/core/client/src/locale/zh_CN.ts

@@ -497,11 +497,14 @@ export default {
   'Add storage': '添加文件存储',
   'Edit storage': '编辑文件存储',
   'Storage base URL': 'Base URL',
-  'Destination': '文件路径',
+  'Destination': '存储路径（绝对）',
   'Use the built-in static file server': '使用内置静态文件服务',
   'Local storage': '本地存储',
   'Aliyun OSS': '阿里云 OSS',
   'Amazon S3': '亚马逊 S3',
+  'Region': '区域',
+  'Bucket': '存储桶',
+  'Path': '路径（相对）',
 
   // plugins/workflow
   'Workflow': '工作流',

packages/plugins/file-manager/client.d.ts

@@ -0,0 +1,4 @@
+// @ts-nocheck
+export * from './lib/client';
+export { default } from './lib/client';
+

packages/plugins/file-manager/client.js

@@ -0,0 +1,30 @@
+"use strict";
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var _index = _interopRequireWildcard(require("./lib/client"));
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _index.default;
+  }
+});
+
+Object.keys(_index).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _index[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _index[key];
+    }
+  });
+});

packages/plugins/file-manager/package.json

@@ -12,6 +12,7 @@
   "dependencies": {
     "@koa/multer": "^3.0.0",
     "@nocobase/server": "0.8.0-alpha.1",
+    "@nocobase/client": "0.8.0-alpha.1",
     "aws-sdk": "^2.2.32",
     "koa-static": "^5.0.0",
     "mime-match": "^1.0.2",

packages/plugins/file-manager/server.d.ts

@@ -0,0 +1,4 @@
+// @ts-nocheck
+export * from './lib/server';
+export { default } from './lib/server';
+

packages/plugins/file-manager/server.js

@@ -0,0 +1,30 @@
+"use strict";
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var _index = _interopRequireWildcard(require("./lib/server"));
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _index.default;
+  }
+});
+
+Object.keys(_index).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _index[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _index[key];
+    }
+  });
+});

packages/plugins/file-manager/src/client/FileStorageShortcut.tsx

@@ -1,10 +1,8 @@
 import { FileOutlined } from '@ant-design/icons';
 import { uid } from '@formily/shared';
+import { ActionContext, PluginManager, SchemaComponent } from '@nocobase/client';
 import React, { useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { useHistory } from 'react-router-dom';
-import { PluginManager } from '..';
-import { ActionContext, SchemaComponent } from '../schema-component';
 import { storageSchema } from './schemas/storage';
 import { StorageOptions } from './StorageOptions';
 
@@ -23,20 +21,6 @@ const schema = {
 };
 
 export const FileStorageShortcut = () => {
-  const { t } = useTranslation();
-  const history = useHistory();
-  return (
-    <PluginManager.Toolbar.Item
-      icon={<FileOutlined />}
-      title={t('File storages')}
-      onClick={() => {
-        history.push('/admin/settings/file-manager/storages');
-      }}
-    />
-  );
-};
-
-export const FileStorageShortcut2 = () => {
   const [visible, setVisible] = useState(false);
   const { t } = useTranslation();
   return (
@@ -52,4 +36,4 @@ export const FileStorageShortcut2 = () => {
       <SchemaComponent components={{ StorageOptions }} schema={schema} />
     </ActionContext.Provider>
   );
-};
+};

packages/plugins/file-manager/src/client/StorageOptions.tsx

@@ -13,6 +13,12 @@ const schema = {
         'x-component': 'Input',
         default: 'uploads',
       },
+      path: {
+        title: '{{t("Path")}}',
+        type: 'string',
+        'x-decorator': 'FormItem',
+        'x-component': 'Input',
+      },
       serve: {
         type: 'string',
         'x-decorator': 'FormItem',
@@ -52,6 +58,44 @@ const schema = {
         'x-component': 'Input',
         required: true,
       },
+      path: {
+        title: '{{t("Path")}}',
+        type: 'string',
+        'x-decorator': 'FormItem',
+        'x-component': 'Input',
+      },
+    },
+  },
+  'tx-cos': {
+    properties: {
+      Region: {
+        title: '{{t("Region")}}',
+        type: 'string',
+        'x-decorator': 'FormItem',
+        'x-component': 'Input',
+        required: true,
+      },
+      SecretId: {
+        title: '{{t("SecretId")}}',
+        type: 'string',
+        'x-decorator': 'FormItem',
+        'x-component': 'Input',
+        required: true,
+      },
+      SecretKey: {
+        title: '{{t("SecretKey")}}',
+        type: 'string',
+        'x-decorator': 'FormItem',
+        'x-component': 'Password',
+        required: true,
+      },
+      Bucket: {
+        title: '{{t("Bucket")}}',
+        type: 'string',
+        'x-decorator': 'FormItem',
+        'x-component': 'Input',
+        required: true,
+      },
     },
   },
   s3: {
@@ -84,6 +128,12 @@ const schema = {
         'x-component': 'Input',
         required: true,
       },
+      path: {
+        title: '{{t("Path")}}',
+        type: 'string',
+        'x-decorator': 'FormItem',
+        'x-component': 'Input',
+      },
     },
   },
 };

packages/plugins/file-manager/src/client/index.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import { PluginManagerContext } from '@nocobase/client';
+import { useContext } from 'react';
+import { FileStorageShortcut } from './FileStorageShortcut';
+
+export default function(props) {
+  const ctx = useContext(PluginManagerContext);
+  return (
+    <PluginManagerContext.Provider
+      value={{
+        components: {
+          ...ctx?.components,
+          FileStorageShortcut,
+        },
+      }}
+    >
+      {props.children}
+    </PluginManagerContext.Provider>
+  );
+};

packages/plugins/file-manager/src/client/schemas/storage.ts

@@ -1,7 +1,6 @@
 import { ISchema } from '@formily/react';
 import { uid } from '@formily/shared';
-import { useRequest } from '../../api-client';
-import { useActionContext } from '../../schema-component';
+import { useRequest, useActionContext } from '@nocobase/client';
 
 const collection = {
   name: 'storages',

packages/plugins/file-manager/src/index.ts

@@ -1,3 +1 @@
-export * from './constants';
 export { default } from './server';
-

packages/plugins/file-manager/src/server/index.ts

@@ -0,0 +1,3 @@
+export * from './constants';
+export { default } from './server';
+