@nocobase/client 0.7.0-alpha.9 → 0.7.1-alpha.6

package/src/collection-manager/CollectionManagerProvider.tsx

@@ -1,61 +0,0 @@
-import { Spin } from 'antd';
-import React, { useState } from 'react';
-import { useAPIClient, useRequest } from '../api-client';
-import { CollectionManagerSchemaComponentProvider } from './CollectionManagerSchemaComponentProvider';
-import { CollectionManagerContext } from './context';
-import * as defaultInterfaces from './interfaces';
-import { CollectionManagerOptions } from './types';
-
-export const CollectionManagerProvider: React.FC<CollectionManagerOptions> = (props) => {
-  const { service, interfaces, collections = [], refreshCM } = props;
-  return (
-    <CollectionManagerContext.Provider
-      value={{
-        service,
-        interfaces: { ...defaultInterfaces, ...interfaces },
-        collections,
-        refreshCM: async () => {
-          if (refreshCM) {
-            await refreshCM();
-          }
-        },
-      }}
-    >
-      <CollectionManagerSchemaComponentProvider>{props.children}</CollectionManagerSchemaComponentProvider>
-    </CollectionManagerContext.Provider>
-  );
-};
-
-export const RemoteCollectionManagerProvider = (props: any) => {
-  const api = useAPIClient();
-  const [contentLoading, setContentLoading] = useState(false);
-  const options = {
-    resource: 'collections',
-    action: 'list',
-    params: {
-      paginate: false,
-      appends: ['fields', 'fields.uiSchema'],
-      filter: {
-        // inherit: false,
-      },
-      sort: ['sort'],
-    },
-  };
-  const service = useRequest(options);
-  if (service.loading) {
-    return <Spin />;
-  }
-  return (
-    <CollectionManagerProvider
-      service={{...service, contentLoading, setContentLoading}}
-      collections={service?.data?.data}
-      refreshCM={async () => {
-        setContentLoading(true);
-        const { data } = await api.request(options);
-        service.mutate(data);
-        setContentLoading(false);
-      }}
-      {...props}
-    />
-  );
-};

package/src/collection-manager/CollectionManagerSchemaComponentProvider.tsx

@@ -1,29 +0,0 @@
-import React from 'react';
-import { SchemaComponentOptions } from '../';
-import {
-  CollectionField,
-  CollectionFieldProvider,
-  CollectionProvider,
-  ResourceActionProvider,
-  useDataSourceFromRAC
-} from './';
-import * as hooks from './action-hooks';
-import { DataSourceProvider, ds, SubFieldDataSourceProvider } from './sub-table';
-
-export const CollectionManagerSchemaComponentProvider: React.FC = (props) => {
-  return (
-    <SchemaComponentOptions
-      scope={{ cm: { ...hooks, useDataSourceFromRAC }, ds }}
-      components={{
-        SubFieldDataSourceProvider,
-        DataSourceProvider,
-        CollectionField,
-        CollectionFieldProvider,
-        CollectionProvider,
-        ResourceActionProvider,
-      }}
-    >
-      {props.children}
-    </SchemaComponentOptions>
-  );
-};

package/src/collection-manager/CollectionManagerShortcut.tsx

@@ -1,41 +0,0 @@
-import { DatabaseOutlined } from '@ant-design/icons';
-import { ISchema } from '@formily/react';
-import { uid } from '@formily/shared';
-import React, { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { PluginManager } from '../plugin-manager';
-import { ActionContext, SchemaComponent } from '../schema-component';
-import { AddFieldAction, ConfigurationTable, EditFieldAction } from './Configuration';
-
-const schema: ISchema = {
-  type: 'object',
-  properties: {
-    [uid()]: {
-      'x-component': 'Action.Drawer',
-      type: 'void',
-      title: '{{t("Collections & Fields")}}',
-      properties: {
-        configuration: {
-          'x-component': 'ConfigurationTable',
-        },
-      },
-    },
-  },
-};
-
-export const CollectionManagerShortcut = () => {
-  const [visible, setVisible] = useState(false);
-  const { t } = useTranslation();
-  return (
-    <ActionContext.Provider value={{ visible, setVisible }}>
-      <PluginManager.Toolbar.Item
-        icon={<DatabaseOutlined />}
-        title={t('Collections & Fields')}
-        onClick={() => {
-          setVisible(true);
-        }}
-      />
-      <SchemaComponent schema={schema} components={{ ConfigurationTable, AddFieldAction, EditFieldAction }} />
-    </ActionContext.Provider>
-  );
-};

package/src/collection-manager/CollectionProvider.tsx

@@ -1,14 +0,0 @@
-import React from 'react';
-import { CollectionContext } from './context';
-import { useCollectionManager } from './hooks';
-import { CollectionOptions } from './types';
-
-export const CollectionProvider: React.FC<{ allowNull?: boolean; name?: string; collection?: CollectionOptions }> = (props) => {
-  const { allowNull, name, collection, children } = props;
-  const { getCollection } = useCollectionManager();
-  const value = getCollection(collection || name);
-  if (!value && !allowNull) {
-    return null;
-  }
-  return <CollectionContext.Provider value={value}>{children}</CollectionContext.Provider>;
-};

package/src/collection-manager/Configuration/AddFieldAction.tsx

@@ -1,148 +0,0 @@
-import { PlusOutlined } from '@ant-design/icons';
-import { ArrayTable } from '@formily/antd';
-import { ISchema, useForm } from '@formily/react';
-import { uid } from '@formily/shared';
-import { Button, Dropdown, Menu } from 'antd';
-import { cloneDeep } from 'lodash';
-import React, { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useRequest } from '../../api-client';
-import { useRecord } from '../../record-provider';
-import { ActionContext, SchemaComponent, useCompile } from '../../schema-component';
-import { useCreateAction } from '../action-hooks';
-import { useCollectionManager } from '../hooks';
-import { IField } from '../interfaces/types';
-import { options } from './interfaces';
-
-const getSchema = (schema: IField): ISchema => {
-  if (!schema) {
-    return;
-  }
-  const properties = cloneDeep(schema.properties) as any;
-  const initialValue = {
-    name: `f_${uid()}`,
-    ...cloneDeep(schema.default),
-    interface: schema.name,
-  };
-  // initialValue.uiSchema.title = schema.title;
-  return {
-    type: 'object',
-    properties: {
-      [uid()]: {
-        type: 'void',
-        'x-component': 'Action.Drawer',
-        'x-decorator': 'Form',
-        'x-decorator-props': {
-          useValues(options) {
-            return useRequest(
-              () =>
-                Promise.resolve({
-                  data: initialValue,
-                }),
-              options,
-            );
-          },
-        },
-        title: '{{ t("Add field") }}',
-        properties: {
-          // @ts-ignore
-          ...properties,
-          footer: {
-            type: 'void',
-            'x-component': 'Action.Drawer.Footer',
-            properties: {
-              action1: {
-                title: '{{ t("Cancel") }}',
-                'x-component': 'Action',
-                'x-component-props': {
-                  useAction: '{{ cm.useCancelAction }}',
-                },
-              },
-              action2: {
-                title: '{{ t("Submit") }}',
-                'x-component': 'Action',
-                'x-component-props': {
-                  type: 'primary',
-                  useAction: '{{ useCreateCollectionField }}',
-                },
-              },
-            },
-          },
-        },
-      },
-    },
-  };
-};
-
-const useCreateCollectionField = () => {
-  const form = useForm();
-  const { run } = useCreateAction();
-  const { refreshCM } = useCollectionManager();
-  const { title } = useRecord();
-  return {
-    async run() {
-      await form.submit();
-      const options = form?.values?.uiSchema?.enum?.slice() || [];
-      if (options?.length) {
-        form.setValuesIn(
-          'uiSchema.enum',
-          options.map((option) => {
-            return {
-              value: uid(),
-              ...option,
-            };
-          }),
-        );
-      }
-      if (form?.values?.interface === 'linkTo' && title) {
-        form.setValuesIn('reverseField.uiSchema.title', title);
-      }
-      await run();
-      await refreshCM();
-    },
-  };
-};
-
-export const AddFieldAction = () => {
-  const { getInterface } = useCollectionManager();
-  const [visible, setVisible] = useState(false);
-  const [schema, setSchema] = useState({});
-  const compile = useCompile();
-  const { t } = useTranslation();
-  return (
-    <ActionContext.Provider value={{ visible, setVisible }}>
-      <Dropdown
-        overlay={
-          <Menu
-            style={{
-              maxHeight: '60vh',
-              overflow: 'auto',
-            }}
-            onClick={(info) => {
-              const schema = getSchema(getInterface(info.key));
-              setSchema(schema);
-              setVisible(true);
-            }}
-          >
-            {options.map((option) => {
-              return (
-                option.children.length > 0 && (
-                  <Menu.ItemGroup key={option.label} title={compile(option.label)}>
-                    {option.children.map((child) => {
-                      return <Menu.Item key={child.name}>{compile(child.title)}</Menu.Item>;
-                    })}
-                  </Menu.ItemGroup>
-                )
-              );
-            })}
-          </Menu>
-        }
-      >
-        <Button icon={<PlusOutlined />} type={'primary'}>
-          {t('Add field')}
-        </Button>
-      </Dropdown>
-      <SchemaComponent schema={schema} components={{ ArrayTable }} scope={{ createOnly: true, useCreateCollectionField }} />
-    </ActionContext.Provider>
-  );
-};

package/src/collection-manager/Configuration/AddSubFieldAction.tsx

@@ -1,140 +0,0 @@
-import { PlusOutlined } from '@ant-design/icons';
-import { ArrayTable } from '@formily/antd';
-import { ISchema } from '@formily/react';
-import { uid } from '@formily/shared';
-import { Button, Dropdown, Menu } from 'antd';
-import { cloneDeep } from 'lodash';
-import React, { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useRequest } from '../../api-client';
-import { RecordProvider } from '../../record-provider';
-import { ActionContext, SchemaComponent, useActionContext, useCompile } from '../../schema-component';
-import { useCollectionManager } from '../hooks';
-import { IField } from '../interfaces/types';
-import { options } from './interfaces';
-
-const getSchema = (schema: IField): ISchema => {
-  if (!schema) {
-    return;
-  }
-  const properties = cloneDeep(schema.properties) as any;
-  const initialValue = {
-    name: `f_${uid()}`,
-    ...cloneDeep(schema.default),
-    interface: schema.name,
-  };
-  // initialValue.uiSchema.title = schema.title;
-  return {
-    type: 'object',
-    properties: {
-      [uid()]: {
-        type: 'void',
-        'x-component': 'Action.Drawer',
-        'x-decorator': 'Form',
-        'x-decorator-props': {
-          useValues(options) {
-            return useRequest(
-              () =>
-                Promise.resolve({
-                  data: initialValue,
-                }),
-              options,
-            );
-          },
-        },
-        title: '{{ t("Add field") }}',
-        properties: {
-          // @ts-ignore
-          ...properties,
-          footer: {
-            type: 'void',
-            'x-component': 'Action.Drawer.Footer',
-            properties: {
-              action1: {
-                title: '{{ t("Cancel") }}',
-                'x-component': 'Action',
-                'x-component-props': {
-                  useAction: '{{ cm.useCancelAction }}',
-                },
-              },
-              action2: {
-                title: '{{ t("Submit") }}',
-                'x-component': 'Action',
-                'x-component-props': {
-                  type: 'primary',
-                  useAction: '{{ ds.useCreateAction }}',
-                },
-              },
-            },
-          },
-        },
-      },
-    },
-  };
-};
-
-const useCreateSubField = () => {
-  const ctx = useActionContext();
-  return {
-    async run() {
-      // const options = form?.values?.uiSchema?.enum?.slice() || [];
-      // form.setValuesIn(
-      //   'uiSchema.enum',
-      //   options.map((option) => {
-      //     return {
-      //       value: uid(),
-      //       ...option,
-      //     };
-      //   }),
-      // );
-      // await run();
-      // await refreshCM();
-    },
-  };
-};
-
-export const AddSubFieldAction = () => {
-  const { getInterface } = useCollectionManager();
-  const [visible, setVisible] = useState(false);
-  const [schema, setSchema] = useState({});
-  const compile = useCompile();
-  const { t } = useTranslation();
-  return (
-    <ActionContext.Provider value={{ visible, setVisible }}>
-      <Dropdown
-        overlay={
-          <Menu
-            style={{
-              maxHeight: '60vh',
-              overflow: 'auto',
-            }}
-            onClick={(info) => {
-              const schema = getSchema(getInterface(info.key));
-              setSchema(schema);
-              setVisible(true);
-            }}
-          >
-            {options.map((option) => {
-              return (
-                option.children.length > 0 && (
-                  <Menu.ItemGroup title={compile(option.label)}>
-                    {option.children.map((child) => {
-                      return <Menu.Item key={child.name}>{compile(child.title)}</Menu.Item>;
-                    })}
-                  </Menu.ItemGroup>
-                )
-              );
-            })}
-          </Menu>
-        }
-      >
-        <Button icon={<PlusOutlined />} type={'primary'}>
-          {t('Add field')}
-        </Button>
-      </Dropdown>
-      <RecordProvider record={{}}>
-        <SchemaComponent schema={schema} components={{ ArrayTable }} scope={{ createOnly: true, useCreateSubField }} />
-      </RecordProvider>
-    </ActionContext.Provider>
-  );
-};

package/src/collection-manager/Configuration/ConfigurationTable.tsx

@@ -1,180 +0,0 @@
-import { useForm } from '@formily/react';
-import { action } from '@formily/reactive';
-import { uid } from '@formily/shared';
-import React, { useEffect, useState } from 'react';
-import { useRequest } from '../../api-client';
-import { useRecord } from '../../record-provider';
-import { SchemaComponent, useActionContext, useCompile } from '../../schema-component';
-import { useCollectionManager } from '../hooks/useCollectionManager';
-import { AddSubFieldAction } from './AddSubFieldAction';
-import { EditSubFieldAction } from './EditSubFieldAction';
-import { collectionSchema } from './schemas/collections';
-
-const useAsyncDataSource = (service: any) => (field: any) => {
-  field.loading = true;
-  service(field).then(
-    action.bound((data: any) => {
-      field.dataSource = data;
-      field.loading = false;
-    }),
-  );
-};
-
-const useCollectionValues = (options) => {
-  const { visible } = useActionContext();
-  const result = useRequest(
-    () =>
-      Promise.resolve({
-        data: {
-          name: `t_${uid()}`,
-          createdBy: true,
-          updatedBy: true,
-          sortable: true,
-          fields: [
-            {
-              name: 'id',
-              type: 'integer',
-              autoIncrement: true,
-              primaryKey: true,
-              allowNull: false,
-              uiSchema: { type: 'number', title: '{{t("ID")}}', 'x-component': 'InputNumber', 'x-read-pretty': true },
-              interface: 'id',
-            },
-            {
-              interface: 'createdAt',
-              type: 'date',
-              field: 'createdAt',
-              name: 'createdAt',
-              uiSchema: {
-                type: 'datetime',
-                title: '{{t("Created at")}}',
-                'x-component': 'DatePicker',
-                'x-component-props': {},
-                'x-read-pretty': true,
-              },
-            },
-            {
-              interface: 'createdBy',
-              type: 'belongsTo',
-              target: 'users',
-              foreignKey: 'createdById',
-              name: 'createdBy',
-              uiSchema: {
-                type: 'object',
-                title: '{{t("Created by")}}',
-                'x-component': 'RecordPicker',
-                'x-component-props': {
-                  fieldNames: {
-                    value: 'id',
-                    label: 'nickname',
-                  },
-                },
-                'x-read-pretty': true,
-              },
-            },
-            {
-              type: 'date',
-              field: 'updatedAt',
-              name: 'updatedAt',
-              interface: 'updatedAt',
-              uiSchema: {
-                type: 'string',
-                title: '{{t("Last updated at")}}',
-                'x-component': 'DatePicker',
-                'x-component-props': {},
-                'x-read-pretty': true,
-              },
-            },
-            {
-              type: 'belongsTo',
-              target: 'users',
-              foreignKey: 'updatedById',
-              name: 'updatedBy',
-              interface: 'updatedBy',
-              uiSchema: {
-                type: 'object',
-                title: '{{t("Last updated by")}}',
-                'x-component': 'RecordPicker',
-                'x-component-props': {
-                  fieldNames: {
-                    value: 'id',
-                    label: 'nickname',
-                  },
-                },
-                'x-read-pretty': true,
-              },
-            },
-          ],
-        },
-      }),
-    {
-      ...options,
-      manual: true,
-    },
-  );
-
-  useEffect(() => {
-    if (visible) {
-      result.run();
-    }
-  }, [visible]);
-
-  return result;
-};
-
-const useSelectedRowKeys = () => {
-  const [selectedRowKeys, setSelectedRowKeys] = useState([]);
-  return [selectedRowKeys, setSelectedRowKeys];
-};
-
-const useDestroySubField = () => {
-  const record = useRecord();
-  const form = useForm();
-  return {
-    async run() {
-      const children = form.values?.children?.slice?.();
-      form.setValuesIn(
-        'children',
-        children.filter((child) => {
-          return child.name !== record.name;
-        }),
-      );
-    },
-  };
-};
-
-const useBulkDestroySubField = () => {
-  return {
-    async run() {},
-  };
-};
-
-export const ConfigurationTable = () => {
-  const { collections = [] } = useCollectionManager();
-  const compile = useCompile();
-  const loadCollections = async (field: any) => {
-    return collections?.map((item: any) => ({
-      label: compile(item.title),
-      value: item.name,
-    }));
-  };
-  return (
-    <div>
-      <SchemaComponent
-        schema={collectionSchema}
-        components={{
-          AddSubFieldAction,
-          EditSubFieldAction,
-        }}
-        scope={{
-          useDestroySubField,
-          useBulkDestroySubField,
-          useSelectedRowKeys,
-          useCollectionValues,
-          useAsyncDataSource,
-          loadCollections,
-        }}
-      />
-    </div>
-  );
-};