From e572f6645e9091b4b28c878baa8352825a5b14d0 Mon Sep 17 00:00:00 2001
From: Zeke Zhang <958414905@qq.com>
Date: Tue, 2 Apr 2024 21:38:40 +0800
Subject: [PATCH] refactor: change useProps to x-use-component-props (#3853)
* refactor: update TableV2 component props
* refactor: update Action component
* refactor: update Filter.Action
* refactor: update FormV2
* refactor: update TableV2.Selector
* refactor: update Details
* refactor: update Action.Link
* refactor: about acl
* refactor: useCustomizeUpdateActionProps
* refactor: update decrator FormV2
* refactor(plugin-data-visualization): useProps to x-use-component-props
* refactor: update Pagination
* refactor: update CalendarV2
* refactor: update TitleField
* refactor: useProps
* refactor: update AssociationFilter.Item
* feat(withDynamicSchemaProps): support function useComponentPropsStr
* refactor: update FormDataTemplates
* chore: fix unit tests
* chore: fix e2e
* refactor: update
* feat(withDynamicSchemaProps): support to use dot
* refactor: update
* refactor: update
* chore: avoid error
---
.../Configuration/schemas/roleCollections.ts | 262 ------------------
.../src/acl/Configuration/schemas/roles.ts | 1 -
.../src/acl/Configuration/schemas/scopes.ts | 50 ++--
.../hoc/withDynamicSchemaProps.test.tsx | 52 ++++
.../hoc/withDynamicSchemaProps.tsx | 34 ++-
.../collection-manager/interfaces/subTable.ts | 2 +-
.../BulkDestroyActionInitializer.tsx | 14 +-
.../delete/DestroyActionInitializer.tsx | 2 +-
.../DisassociateActionInitializer.tsx | 2 +-
.../filter/FilterActionInitializer.tsx | 2 +-
.../refresh/RefreshActionInitializer.tsx | 2 +-
.../SaveRecordActionInitializer.tsx | 4 +-
.../submit/CreateSubmitActionInitializer.tsx | 2 +-
.../submit/UpdateSubmitActionInitializer.tsx | 2 +-
.../UpdateRecordActionInitializer.tsx | 4 +-
.../table/__e2e__/dragAndDrop.test.ts | 2 +-
.../table/hooks/useTableBlockProps.tsx | 6 +-
.../data-blocks/table/tableBlockSettings.tsx | 2 +-
.../filterCollapseItemFieldSettings.ts | 2 +-
.../filterCollapseItemInitializer.tsx | 18 +-
.../antd/action/Action.Link.tsx | 7 +-
.../schema-component/antd/action/Action.tsx | 9 +-
.../antd/action/demos/demo3.tsx | 3 +-
.../antd/association-field/FileManager.tsx | 4 +-
.../antd/association-field/schema.ts | 2 +-
.../AssociationFilter.Initializer.tsx | 3 +-
.../AssociationFilter.Item.Designer.tsx | 2 +-
.../AssociationFilter.Item.tsx | 258 ++++++++---------
.../schema-component/antd/filter/Filter.tsx | 10 +-
.../antd/filter/FilterAction.tsx | 10 +-
.../antd/filter/demos/demo6.tsx | 16 +-
.../antd/form-v2/demos/demo2.tsx | 4 +-
.../antd/form-v2/demos/demo3.tsx | 4 +-
.../antd/g2plot/G2PlotDesigner.tsx | 7 +-
.../src/schema-component/antd/grid/Grid.tsx | 5 +-
.../antd/record-picker/demos/demo1.tsx | 4 +-
.../antd/table-v2/Table.Column.Designer.tsx | 5 +-
.../schema-component/antd/table-v2/Table.tsx | 3 +
.../antd/table-v2/demos/demo1.tsx | 6 +-
.../antd/table/Table.Column.Designer.tsx | 5 +-
.../schema-component/antd/upload/Upload.tsx | 74 ++---
.../schema-component/antd/upload/type.d.ts | 1 +
.../items/CreateFilterActionInitializer.tsx | 2 +-
.../items/CreateResetActionInitializer.tsx | 4 +-
.../items/SelectActionInitializer.tsx | 2 +-
.../items/SubmitActionInitializer.tsx | 1 -
.../client/src/schema-initializer/utils.ts | 24 +-
.../DataTemplates/FormDataTemplates.tsx | 14 +-
.../schema-settings/DataTemplates/utils.tsx | 2 +-
.../EnableChildCollections/index.tsx | 14 +-
.../LinkageRules/LinkageRuleActionGroup.tsx | 67 ++---
.../schema-settings/LinkageRules/index.tsx | 44 +--
.../src/schema-settings/SchemaSettings.tsx | 58 ++--
.../SchemaSettingsDefaultValue.tsx | 2 +-
.../schemas/uiSchemaTemplates.ts | 12 +-
.../plugin-acl/src/client/schemas/roles.ts | 2 +-
.../plugin-acl/src/client/schemas/scopes.ts | 50 ++--
.../BulkEditSubmitActionInitializer.tsx | 2 +-
.../src/client/createBulkEditBlockUISchema.ts | 4 +-
.../client/BulkUpdateActionInitializer.tsx | 2 +-
.../src/client/DuplicateAction.Settings.tsx | 2 +-
.../src/client/PrintActionInitializer.tsx | 2 +-
.../src/client/Configuration/schema.tsx | 2 +-
.../AuditLogsViewActionInitializer.tsx | 6 +-
.../src/client/createAuditLogsBlockSchema.tsx | 2 +-
.../src/client/deplicated/AuditLogs.tsx | 8 +-
.../src/client/calendar/demos/demo2.tsx | 4 +-
.../CalendarFormActionInitializers.tsx | 4 +-
.../src/client/ChartBlockEngineDesigner.tsx | 3 +-
.../migrations/20230623145414-number-step.ts | 3 +-
.../components/TitleField.tsx | 79 +++---
.../schema/collectionFields.ts | 4 +-
.../CollectionsManager/schema/collections.ts | 4 +-
.../Configuration/schemas/collections.ts | 2 +-
.../schemas/roleCollections.ts | 2 +-
.../PermissionManager/schemas/scopes.ts | 50 ++--
.../src/client/schema/index.ts | 2 +-
.../client/__tests__/chart-renderer.test.tsx | 30 --
.../filter/FilterActionInitializers.tsx | 8 +-
.../src/client/hooks/filter.ts | 3 +-
.../src/client/ExportActionInitializer.tsx | 2 +-
.../initializers/UploadActionInitializer.tsx | 3 +-
.../20230831160742-fix-attachment-field.ts | 1 +
.../src/client/GanttActionInitializers.tsx | 64 -----
.../plugin-gantt/src/client/demos/demo1.tsx | 2 +-
.../SnapshotBlockInitializersDetailItem.tsx | 4 +-
.../migrations/20230510235247-form-field.ts | 3 +-
.../plugin-users/src/client/schemas/users.ts | 6 +-
.../src/client/index.ts | 8 +-
.../src/client/AggregateInstruction.tsx | 26 +-
.../src/client/WorkflowTodo.tsx | 6 +-
.../src/client/instruction/forms/custom.tsx | 5 +-
.../src/client/instruction/forms/update.tsx | 14 +-
.../components/CollectionBlockInitializer.tsx | 4 +-
.../src/client/nodes/index.tsx | 5 +-
.../src/client/schemas/collection.ts | 26 +-
.../src/client/schemas/workflows.ts | 2 +-
.../src/client/triggers/collection.tsx | 4 +-
.../src/client/triggers/index.tsx | 5 +-
.../20230411034722-manual-multi-form.ts | 4 +-
.../20230612021134-manual-collection-block.ts | 4 +-
101 files changed, 676 insertions(+), 955 deletions(-)
delete mode 100644 packages/core/client/src/acl/Configuration/schemas/roleCollections.ts
delete mode 100644 packages/plugins/@nocobase/plugin-data-visualization/src/client/__tests__/chart-renderer.test.tsx
diff --git a/packages/core/client/src/acl/Configuration/schemas/roleCollections.ts b/packages/core/client/src/acl/Configuration/schemas/roleCollections.ts
deleted file mode 100644
index 60f448dbeb..0000000000
--- a/packages/core/client/src/acl/Configuration/schemas/roleCollections.ts
+++ /dev/null
@@ -1,262 +0,0 @@
-import { ISchema } from '@formily/react';
-import { uid } from '@formily/shared';
-import { useRoleResourceValues } from './useRoleResourceValues';
-import { useSaveRoleResourceAction } from './useSaveRoleResourceAction';
-
-const collection = {
- name: 'collections',
- targetKey: 'name',
- filterTargetKey: 'name',
- fields: [
- {
- type: 'integer',
- name: 'title',
- interface: 'input',
- uiSchema: {
- title: '{{t("Collection display name")}}',
- type: 'number',
- 'x-component': 'Input',
- required: true,
- } as ISchema,
- },
- {
- type: 'string',
- name: 'name',
- interface: 'input',
- uiSchema: {
- title: '{{t("Collection name")}}',
- type: 'string',
- 'x-component': 'Input',
- } as ISchema,
- },
- {
- type: 'string',
- name: 'type',
- interface: 'input',
- uiSchema: {
- title: '{{t("Resource type")}}',
- type: 'string',
- 'x-component': 'Select',
- enum: [
- { label: '{{t("Collection")}}', value: 'collection', color: 'green' },
- { label: '{{t("Association")}}', value: 'association', color: 'blue' },
- ],
- } as ISchema,
- },
- {
- type: 'string',
- name: 'usingConfig',
- interface: 'input',
- uiSchema: {
- title: '{{t("Permission policy")}}',
- type: 'string',
- 'x-component': 'Select',
- enum: [
- { label: '{{t("Individual")}}', value: 'resourceAction', color: 'orange' },
- { label: '{{t("General")}}', value: 'strategy', color: 'default' },
- ],
- } as ISchema,
- },
- {
- type: 'hasMany',
- name: 'fields',
- target: 'fields',
- collectionName: 'collections',
- sourceKey: 'name',
- targetKey: 'name',
- uiSchema: {},
- },
- ],
-};
-
-export const roleCollectionsSchema: ISchema = {
- type: 'void',
- 'x-decorator': 'ResourceActionProvider',
- 'x-decorator-props': {
- collection,
- association: {
- sourceKey: 'name',
- targetKey: 'name',
- },
- resourceName: 'roles.collections',
- request: {
- resource: 'roles.collections',
- action: 'list',
- params: {
- pageSize: 20,
- filter: { hidden: { $isFalsy: true } },
- sort: ['sort'],
- appends: [],
- },
- },
- },
- properties: {
- [uid()]: {
- type: 'void',
- 'x-component': 'ActionBar',
- 'x-component-props': {
- style: {
- marginBottom: 16,
- },
- },
- properties: {
- filter: {
- type: 'void',
- title: '{{ t("Filter") }}',
- default: {
- $and: [{ title: { $includes: '' } }, { name: { $includes: '' } }],
- },
- 'x-action': 'filter',
- 'x-component': 'Filter.Action',
- 'x-component-props': {
- icon: 'FilterOutlined',
- useProps: '{{ cm.useFilterActionProps }}',
- },
- 'x-align': 'left',
- },
- },
- },
- table1: {
- type: 'void',
- 'x-uid': 'input',
- 'x-component': 'Table.Void',
- 'x-component-props': {
- rowKey: 'name',
- // rowSelection: {
- // type: 'checkbox',
- // },
- useDataSource: '{{ cm.useDataSourceFromRAC }}',
- },
- properties: {
- column0: {
- type: 'void',
- 'x-decorator': 'Table.Column.Decorator',
- 'x-component': 'Table.Column',
- properties: {
- title: {
- type: 'number',
- 'x-component': 'CollectionField',
- 'x-read-pretty': true,
- },
- },
- },
- // column1: {
- // type: 'void',
- // 'x-decorator': 'Table.Column.Decorator',
- // 'x-component': 'Table.Column',
- // properties: {
- // type: {
- // type: 'string',
- // 'x-component': 'CollectionField',
- // 'x-read-pretty': true,
- // },
- // },
- // },
- column2: {
- type: 'void',
- 'x-decorator': 'Table.Column.Decorator',
- 'x-component': 'Table.Column',
- properties: {
- name: {
- type: 'string',
- 'x-component': 'CollectionField',
- 'x-read-pretty': true,
- },
- },
- },
- column3: {
- type: 'void',
- 'x-decorator': 'Table.Column.Decorator',
- 'x-component': 'Table.Column',
- properties: {
- usingConfig: {
- type: 'string',
- 'x-component': 'CollectionField',
- 'x-read-pretty': true,
- },
- },
- },
- column4: {
- type: 'void',
- title: '{{t("Actions")}}',
- 'x-component': 'Table.Column',
- properties: {
- actions: {
- type: 'void',
- 'x-component': 'Space',
- 'x-component-props': {
- split: '|',
- },
- properties: {
- configure: {
- type: 'void',
- title: '{{t("Configure")}}',
- 'x-component': 'Action.Link',
- 'x-component-props': {
- type: 'primary',
- },
- properties: {
- drawer: {
- type: 'void',
- 'x-component': 'Action.Drawer',
- 'x-decorator': 'Form',
- 'x-decorator-props': {
- useValues: useRoleResourceValues,
- },
- title: '{{t("Configure permission")}}',
- properties: {
- usingActionsConfig: {
- title: '{{t("Permission policy")}}',
- 'x-component': 'Radio.Group',
- 'x-decorator': 'FormItem',
- default: false,
- enum: [
- { value: false, label: '{{t("General")}}' },
- { value: true, label: '{{t("Individual")}}' },
- ],
- 'x-reactions': {
- target: 'actions',
- fulfill: {
- state: {
- hidden: '{{!$self.value}}',
- },
- },
- },
- },
- actions: {
- 'x-component': 'RolesResourcesActions',
- 'x-decorator': 'FormItem',
- },
- footer: {
- type: 'void',
- 'x-component': 'Action.Drawer.Footer',
- properties: {
- cancel: {
- title: '{{t("Cancel")}}',
- 'x-component': 'Action',
- 'x-component-props': {
- useAction: '{{ cm.useCancelAction }}',
- },
- },
- submit: {
- title: '{{t("Submit")}}',
- 'x-component': 'Action',
- 'x-component-props': {
- type: 'primary',
- useAction: useSaveRoleResourceAction,
- },
- },
- },
- },
- },
- },
- },
- },
- },
- },
- },
- },
- },
- },
- },
-};
diff --git a/packages/core/client/src/acl/Configuration/schemas/roles.ts b/packages/core/client/src/acl/Configuration/schemas/roles.ts
index b06999c1d4..cb78b2cf3f 100644
--- a/packages/core/client/src/acl/Configuration/schemas/roles.ts
+++ b/packages/core/client/src/acl/Configuration/schemas/roles.ts
@@ -5,7 +5,6 @@ import { useEffect } from 'react';
import { useRequest } from '../../../api-client';
import { useRecord } from '../../../record-provider';
import { useActionContext } from '../../../schema-component';
-import { roleCollectionsSchema } from './roleCollections';
const collection = {
name: 'roles',
diff --git a/packages/core/client/src/acl/Configuration/schemas/scopes.ts b/packages/core/client/src/acl/Configuration/schemas/scopes.ts
index 1960c28fca..40ac7a4cd6 100644
--- a/packages/core/client/src/acl/Configuration/schemas/scopes.ts
+++ b/packages/core/client/src/acl/Configuration/schemas/scopes.ts
@@ -124,9 +124,7 @@ export const scopesSchema: ISchema = {
form: {
type: 'void',
'x-component': 'FormV2',
- 'x-component-props': {
- useProps: useFormBlockProps,
- },
+ 'x-use-component-props': useFormBlockProps,
properties: {
name: {
type: 'string',
@@ -139,15 +137,17 @@ export const scopesSchema: ISchema = {
name: 'filter',
'x-decorator': 'FormItem',
'x-component': 'Filter',
+ 'x-use-component-props': () => {
+ // eslint-disable-next-line react-hooks/rules-of-hooks
+ const ctx = useContext(RoleResourceCollectionContext);
+ // eslint-disable-next-line react-hooks/rules-of-hooks
+ const options = useFilterOptions(ctx.name);
+ return {
+ options,
+ };
+ },
'x-component-props': {
dynamicComponent: VariableInput,
- useProps() {
- const ctx = useContext(RoleResourceCollectionContext);
- const options = useFilterOptions(ctx.name);
- return {
- options,
- };
- },
},
},
actions: {
@@ -164,10 +164,10 @@ export const scopesSchema: ISchema = {
title: '{{ t("Submit") }}',
'x-action': 'submit',
'x-component': 'Action',
+ 'x-use-component-props': 'useCreateActionProps',
'x-component-props': {
type: 'primary',
htmlType: 'submit',
- useProps: '{{ useCreateActionProps }}',
},
},
},
@@ -185,12 +185,12 @@ export const scopesSchema: ISchema = {
value: {
type: 'array',
'x-component': 'TableV2.Selector',
+ 'x-use-component-props': 'useTableSelectorProps',
'x-component-props': {
rowKey: 'id',
rowSelection: {
type: 'checkbox',
},
- useProps: '{{ useTableSelectorProps }}',
},
properties: {
column1: {
@@ -252,9 +252,7 @@ export const scopesSchema: ISchema = {
form: {
type: 'void',
'x-component': 'FormV2',
- 'x-component-props': {
- useProps: '{{ useFormBlockProps }}',
- },
+ 'x-use-component-props': 'useFormBlockProps',
properties: {
name: {
type: 'string',
@@ -267,15 +265,17 @@ export const scopesSchema: ISchema = {
name: 'filter',
'x-decorator': 'FormItem',
'x-component': 'Filter',
+ 'x-use-component-props': () => {
+ // eslint-disable-next-line react-hooks/rules-of-hooks
+ const ctx = useContext(RoleResourceCollectionContext);
+ // eslint-disable-next-line react-hooks/rules-of-hooks
+ const options = useFilterOptions(ctx.name);
+ return {
+ options,
+ };
+ },
'x-component-props': {
dynamicComponent: VariableInput,
- useProps() {
- const ctx = useContext(RoleResourceCollectionContext);
- const options = useFilterOptions(ctx.name);
- return {
- options,
- };
- },
},
},
actions: {
@@ -292,10 +292,10 @@ export const scopesSchema: ISchema = {
title: '{{ t("Submit") }}',
'x-action': 'submit',
'x-component': 'Action',
+ 'x-use-component-props': 'useUpdateActionProps',
'x-component-props': {
type: 'primary',
htmlType: 'submit',
- useProps: '{{ useUpdateActionProps }}',
},
},
},
@@ -313,13 +313,13 @@ export const scopesSchema: ISchema = {
'x-action': 'destroy',
'x-decorator': 'ACLActionProvider',
'x-component': 'Action.Link',
+ 'x-use-component-props': 'useDestroyActionProps',
'x-component-props': {
icon: 'DeleteOutlined',
confirm: {
title: "{{t('Delete record')}}",
content: "{{t('Are you sure you want to delete it?')}}",
},
- useProps: '{{ useDestroyActionProps }}',
},
},
},
@@ -343,10 +343,10 @@ export const scopesSchema: ISchema = {
title: '{{ t("Submit") }}',
'x-action': 'submit',
'x-component': 'Action',
+ 'x-use-component-props': 'usePickActionProps',
'x-component-props': {
type: 'primary',
htmlType: 'submit',
- useProps: '{{ usePickActionProps }}',
},
},
},
diff --git a/packages/core/client/src/application/__tests__/hoc/withDynamicSchemaProps.test.tsx b/packages/core/client/src/application/__tests__/hoc/withDynamicSchemaProps.test.tsx
index 374beae633..1fa07abdfb 100644
--- a/packages/core/client/src/application/__tests__/hoc/withDynamicSchemaProps.test.tsx
+++ b/packages/core/client/src/application/__tests__/hoc/withDynamicSchemaProps.test.tsx
@@ -161,4 +161,56 @@ describe('withDynamicSchemaProps', () => {
const { getByTestId } = render();
expect(getByTestId('component')).toHaveTextContent(JSON.stringify({ a: 'a' }));
});
+
+ test('x-use-component-props is function', () => {
+ const schema = {
+ 'x-use-component-props': () => ({ a: 'a' }),
+ };
+ const Demo = withTestDemo(schema);
+ const { getByTestId } = render();
+ expect(getByTestId('component')).toHaveTextContent(JSON.stringify({ a: 'a' }));
+ });
+
+ test('x-use-decorator-props is function', () => {
+ const schema = {
+ 'x-use-decorator-props': () => ({ a: 'a' }),
+ };
+ const Demo = withTestDemo(schema);
+ const { getByTestId } = render();
+ expect(getByTestId('decorator')).toHaveTextContent(JSON.stringify({ a: 'a' }));
+ });
+
+ test('x-use-component-props with dot', () => {
+ function useComponentProps() {
+ return {
+ a: 'a',
+ };
+ }
+ const schema = {
+ 'x-use-component-props': 'cm.useComponentProps',
+ };
+
+ const scopes = { cm: { useComponentProps } };
+
+ const Demo = withTestDemo(schema, scopes);
+ const { getByTestId } = render();
+ expect(getByTestId('component')).toHaveTextContent(JSON.stringify({ a: 'a' }));
+ });
+
+ test('x-use-decorator-props with dot', () => {
+ function useDecoratorProps() {
+ return {
+ b: 'b',
+ };
+ }
+ const schema = {
+ 'x-use-decorator-props': 'cm.useDecoratorProps',
+ };
+
+ const scopes = { cm: { useDecoratorProps } };
+
+ const Demo = withTestDemo(schema, scopes);
+ const { getByTestId } = render();
+ expect(getByTestId('decorator')).toHaveTextContent(JSON.stringify({ b: 'b' }));
+ });
});
diff --git a/packages/core/client/src/application/hoc/withDynamicSchemaProps.tsx b/packages/core/client/src/application/hoc/withDynamicSchemaProps.tsx
index 0f80d88854..2125216614 100644
--- a/packages/core/client/src/application/hoc/withDynamicSchemaProps.tsx
+++ b/packages/core/client/src/application/hoc/withDynamicSchemaProps.tsx
@@ -1,6 +1,7 @@
import { useExpressionScope } from '@formily/react';
import React, { ComponentType, useMemo } from 'react';
import { useDesignable } from '../../schema-component';
+import _ from 'lodash';
const useDefaultSchemaProps = () => undefined;
@@ -28,14 +29,35 @@ export function withDynamicSchemaProps(Component: any, options: WithSch
}
}, [dn]);
const useSchemaProps = useMemo(() => {
- let res = undefined;
- if (useComponentPropsStr) {
- res = scope[useComponentPropsStr];
- if (!res) {
- console.error(`${useComponentPropsStr} is not registered`);
+ const getHook = (str: string, scope: Record, allText: string) => {
+ let res = undefined;
+ if (_.isFunction(str)) {
+ res = str;
+ } else {
+ res = scope[str];
+ if (!res) {
+ console.error(`${allText} is not registered`);
+ }
}
+ return res || useDefaultSchemaProps;
+ };
+
+ if (!useComponentPropsStr) {
+ return useDefaultSchemaProps;
}
- return res || useDefaultSchemaProps;
+
+ if (_.isFunction(useComponentPropsStr)) {
+ return useComponentPropsStr;
+ }
+
+ const pathList = useComponentPropsStr.split('.');
+ let result;
+
+ for (const item of pathList) {
+ result = getHook(item, result || scope, useComponentPropsStr);
+ }
+
+ return result;
}, [scope, useComponentPropsStr]);
const schemaProps = useSchemaProps(props);
diff --git a/packages/core/client/src/collection-manager/interfaces/subTable.ts b/packages/core/client/src/collection-manager/interfaces/subTable.ts
index 3000836cbb..985cb0c53d 100644
--- a/packages/core/client/src/collection-manager/interfaces/subTable.ts
+++ b/packages/core/client/src/collection-manager/interfaces/subTable.ts
@@ -50,11 +50,11 @@ export class SubTableFieldInterface extends CollectionFieldInterface {
type: 'array',
'x-initializer': 'table:configureColumns',
'x-component': 'TableV2',
+ 'x-use-component-props': 'useTableFieldProps',
'x-component-props': {
rowSelection: {
type: 'checkbox',
},
- useProps: '{{ useTableFieldProps }}',
},
},
},
diff --git a/packages/core/client/src/modules/actions/bulk-destroy/BulkDestroyActionInitializer.tsx b/packages/core/client/src/modules/actions/bulk-destroy/BulkDestroyActionInitializer.tsx
index 96158d8854..4238a9134d 100644
--- a/packages/core/client/src/modules/actions/bulk-destroy/BulkDestroyActionInitializer.tsx
+++ b/packages/core/client/src/modules/actions/bulk-destroy/BulkDestroyActionInitializer.tsx
@@ -9,19 +9,19 @@ export const BulkDestroyActionInitializer = (props) => {
title: '{{ t("Delete") }}',
'x-action': 'destroy',
'x-component': 'Action',
- 'x-toolbar': 'ActionSchemaToolbar',
- 'x-settings': 'actionSettings:bulkDelete',
- 'x-decorator': 'ACLActionProvider',
- 'x-acl-action-props': {
- skipScopeCheck: true,
- },
+ 'x-use-component-props': 'useBulkDestroyActionProps',
'x-component-props': {
icon: 'DeleteOutlined',
confirm: {
title: "{{t('Delete record')}}",
content: "{{t('Are you sure you want to delete it?')}}",
},
- useProps: '{{ useBulkDestroyActionProps }}',
+ },
+ 'x-toolbar': 'ActionSchemaToolbar',
+ 'x-settings': 'actionSettings:bulkDelete',
+ 'x-decorator': 'ACLActionProvider',
+ 'x-acl-action-props': {
+ skipScopeCheck: true,
},
'x-action-settings': {
triggerWorkflows: [],
diff --git a/packages/core/client/src/modules/actions/delete/DestroyActionInitializer.tsx b/packages/core/client/src/modules/actions/delete/DestroyActionInitializer.tsx
index c1ae72bfad..7f8447a525 100644
--- a/packages/core/client/src/modules/actions/delete/DestroyActionInitializer.tsx
+++ b/packages/core/client/src/modules/actions/delete/DestroyActionInitializer.tsx
@@ -7,6 +7,7 @@ export const DestroyActionInitializer = (props) => {
title: '{{ t("Delete") }}',
'x-action': 'destroy',
'x-component': 'Action',
+ 'x-use-component-props': 'useDestroyActionProps',
'x-toolbar': 'ActionSchemaToolbar',
'x-settings': 'actionSettings:delete',
'x-component-props': {
@@ -15,7 +16,6 @@ export const DestroyActionInitializer = (props) => {
title: "{{t('Delete record')}}",
content: "{{t('Are you sure you want to delete it?')}}",
},
- useProps: '{{ useDestroyActionProps }}',
},
'x-action-settings': {
triggerWorkflows: [],
diff --git a/packages/core/client/src/modules/actions/disassociate/DisassociateActionInitializer.tsx b/packages/core/client/src/modules/actions/disassociate/DisassociateActionInitializer.tsx
index 2065e4f6d0..d50377e286 100644
--- a/packages/core/client/src/modules/actions/disassociate/DisassociateActionInitializer.tsx
+++ b/packages/core/client/src/modules/actions/disassociate/DisassociateActionInitializer.tsx
@@ -7,6 +7,7 @@ export const DisassociateActionInitializer = (props) => {
title: '{{ t("Disassociate") }}',
'x-action': 'disassociate',
'x-component': 'Action',
+ 'x-use-component-props': 'useDisassociateActionProps',
'x-toolbar': 'ActionSchemaToolbar',
'x-settings': 'actionSettings:disassociate',
'x-component-props': {
@@ -15,7 +16,6 @@ export const DisassociateActionInitializer = (props) => {
title: "{{t('Disassociate record')}}",
content: "{{t('Are you sure you want to disassociate it?')}}",
},
- useProps: '{{ useDisassociateActionProps }}',
},
'x-action-settings': {
triggerWorkflows: [],
diff --git a/packages/core/client/src/modules/actions/filter/FilterActionInitializer.tsx b/packages/core/client/src/modules/actions/filter/FilterActionInitializer.tsx
index 3d93a3935e..cae54d7fa8 100644
--- a/packages/core/client/src/modules/actions/filter/FilterActionInitializer.tsx
+++ b/packages/core/client/src/modules/actions/filter/FilterActionInitializer.tsx
@@ -10,9 +10,9 @@ export const FilterActionInitializer = (props) => {
'x-toolbar': 'ActionSchemaToolbar',
'x-settings': 'actionSettings:filter',
'x-component': 'Filter.Action',
+ 'x-use-component-props': 'useFilterActionProps',
'x-component-props': {
icon: 'FilterOutlined',
- useProps: '{{ useFilterActionProps }}',
},
};
return ;
diff --git a/packages/core/client/src/modules/actions/refresh/RefreshActionInitializer.tsx b/packages/core/client/src/modules/actions/refresh/RefreshActionInitializer.tsx
index e3548838d5..308313a058 100644
--- a/packages/core/client/src/modules/actions/refresh/RefreshActionInitializer.tsx
+++ b/packages/core/client/src/modules/actions/refresh/RefreshActionInitializer.tsx
@@ -6,11 +6,11 @@ export const RefreshActionInitializer = (props) => {
title: '{{ t("Refresh") }}',
'x-action': 'refresh',
'x-component': 'Action',
+ 'x-use-component-props': 'useRefreshActionProps',
'x-toolbar': 'ActionSchemaToolbar',
'x-settings': 'actionSettings:refresh',
'x-component-props': {
icon: 'ReloadOutlined',
- useProps: '{{ useRefreshActionProps }}',
},
};
return ;
diff --git a/packages/core/client/src/modules/actions/save-record/SaveRecordActionInitializer.tsx b/packages/core/client/src/modules/actions/save-record/SaveRecordActionInitializer.tsx
index 22c3356d0c..561016b07a 100644
--- a/packages/core/client/src/modules/actions/save-record/SaveRecordActionInitializer.tsx
+++ b/packages/core/client/src/modules/actions/save-record/SaveRecordActionInitializer.tsx
@@ -7,6 +7,7 @@ export const SaveRecordActionInitializer = () => {
title: '{{ t("Save record") }}',
'x-action': 'customize:save',
'x-component': 'Action',
+ 'x-use-component-props': 'useCreateActionProps',
'x-toolbar': 'ActionSchemaToolbar',
'x-settings': 'actionSettings:saveRecord',
'x-designer-props': {
@@ -23,9 +24,6 @@ export const SaveRecordActionInitializer = () => {
},
triggerWorkflows: [],
},
- 'x-component-props': {
- useProps: '{{ useCreateActionProps }}',
- },
};
const itemConfig = useSchemaInitializerItem();
diff --git a/packages/core/client/src/modules/actions/submit/CreateSubmitActionInitializer.tsx b/packages/core/client/src/modules/actions/submit/CreateSubmitActionInitializer.tsx
index e233ab9f2c..e06d23e122 100644
--- a/packages/core/client/src/modules/actions/submit/CreateSubmitActionInitializer.tsx
+++ b/packages/core/client/src/modules/actions/submit/CreateSubmitActionInitializer.tsx
@@ -6,12 +6,12 @@ export const CreateSubmitActionInitializer = (props) => {
title: '{{ t("Submit") }}',
'x-action': 'submit',
'x-component': 'Action',
+ 'x-use-component-props': 'useCreateActionProps',
'x-toolbar': 'ActionSchemaToolbar',
'x-settings': 'actionSettings:createSubmit',
'x-component-props': {
type: 'primary',
htmlType: 'submit',
- useProps: '{{ useCreateActionProps }}',
},
'x-action-settings': {
triggerWorkflows: [],
diff --git a/packages/core/client/src/modules/actions/submit/UpdateSubmitActionInitializer.tsx b/packages/core/client/src/modules/actions/submit/UpdateSubmitActionInitializer.tsx
index 0bd0cb872c..9083d1b2fc 100644
--- a/packages/core/client/src/modules/actions/submit/UpdateSubmitActionInitializer.tsx
+++ b/packages/core/client/src/modules/actions/submit/UpdateSubmitActionInitializer.tsx
@@ -7,13 +7,13 @@ export const UpdateSubmitActionInitializer = (props) => {
title: '{{ t("Submit") }}',
'x-action': 'submit',
'x-component': 'Action',
+ 'x-use-component-props': 'useUpdateActionProps',
// 'x-designer': 'Action.Designer',
'x-toolbar': 'ActionSchemaToolbar',
'x-settings': 'actionSettings:updateSubmit',
'x-component-props': {
type: 'primary',
htmlType: 'submit',
- useProps: '{{ useUpdateActionProps }}',
},
'x-action-settings': {
triggerWorkflows: [],
diff --git a/packages/core/client/src/modules/actions/update-record/UpdateRecordActionInitializer.tsx b/packages/core/client/src/modules/actions/update-record/UpdateRecordActionInitializer.tsx
index 47153ecb82..3671e390d0 100644
--- a/packages/core/client/src/modules/actions/update-record/UpdateRecordActionInitializer.tsx
+++ b/packages/core/client/src/modules/actions/update-record/UpdateRecordActionInitializer.tsx
@@ -6,6 +6,7 @@ export const UpdateRecordActionInitializer = (props) => {
const schema = {
title: '{{ t("Update record") }}',
'x-component': props?.['x-component'] || 'Action.Link',
+ 'x-use-component-props': 'useCustomizeUpdateActionProps',
'x-action': 'customize:update',
'x-decorator': 'ACLActionProvider',
'x-acl-action': 'update',
@@ -21,9 +22,6 @@ export const UpdateRecordActionInitializer = (props) => {
},
triggerWorkflows: [],
},
- 'x-component-props': {
- useProps: '{{ useCustomizeUpdateActionProps }}',
- },
};
const itemConfig = useSchemaInitializerItem();
diff --git a/packages/core/client/src/modules/blocks/data-blocks/table/__e2e__/dragAndDrop.test.ts b/packages/core/client/src/modules/blocks/data-blocks/table/__e2e__/dragAndDrop.test.ts
index 47d60a86de..8bbf0d4796 100644
--- a/packages/core/client/src/modules/blocks/data-blocks/table/__e2e__/dragAndDrop.test.ts
+++ b/packages/core/client/src/modules/blocks/data-blocks/table/__e2e__/dragAndDrop.test.ts
@@ -3,7 +3,7 @@ import { expect, oneEmptyTableBlockBasedOnUsers, test } from '@nocobase/test/e2e
test('actions', async ({ page, mockPage }) => {
await mockPage(oneEmptyTableBlockBasedOnUsers).goto();
await page.getByLabel('schema-initializer-ActionBar-table:configureActions-users').hover();
- // 添加按钮
+ // 添加按钮
await page.getByRole('menuitem', { name: 'Add new' }).click();
await page.getByRole('menuitem', { name: 'Delete' }).click();
await page.getByRole('menuitem', { name: 'Refresh' }).click();
diff --git a/packages/core/client/src/modules/blocks/data-blocks/table/hooks/useTableBlockProps.tsx b/packages/core/client/src/modules/blocks/data-blocks/table/hooks/useTableBlockProps.tsx
index 3e69d3e4ee..3376261958 100644
--- a/packages/core/client/src/modules/blocks/data-blocks/table/hooks/useTableBlockProps.tsx
+++ b/packages/core/client/src/modules/blocks/data-blocks/table/hooks/useTableBlockProps.tsx
@@ -49,9 +49,9 @@ export const useTableBlockProps = () => {
pagination: useMemo(() => {
return params?.paginate !== false
? {
- defaultCurrent: params?.page || 1,
- defaultPageSize: params?.pageSize,
- }
+ defaultCurrent: params?.page || 1,
+ defaultPageSize: params?.pageSize,
+ }
: false;
}, [params?.page, params?.pageSize, params?.paginate]),
onRowSelectionChange: useCallback((selectedRowKeys) => {
diff --git a/packages/core/client/src/modules/blocks/data-blocks/table/tableBlockSettings.tsx b/packages/core/client/src/modules/blocks/data-blocks/table/tableBlockSettings.tsx
index 155e61dccd..9f30c8abf7 100644
--- a/packages/core/client/src/modules/blocks/data-blocks/table/tableBlockSettings.tsx
+++ b/packages/core/client/src/modules/blocks/data-blocks/table/tableBlockSettings.tsx
@@ -15,7 +15,7 @@ import {
SchemaSettingsConnectDataBlocks,
SchemaSettingsTemplate,
} from '../../../../schema-settings/SchemaSettings';
-import { SchemaSettingsDataScope } from '../../../../schema-settings/SchemaSettingsDataScope'
+import { SchemaSettingsDataScope } from '../../../../schema-settings/SchemaSettingsDataScope';
import { useCallback } from 'react';
import { useTranslation } from 'react-i18next';
import { ArrayItems } from '@formily/antd-v5';
diff --git a/packages/core/client/src/modules/blocks/filter-blocks/collapse/filterCollapseItemFieldSettings.ts b/packages/core/client/src/modules/blocks/filter-blocks/collapse/filterCollapseItemFieldSettings.ts
index 8a88cf1418..79ea353863 100644
--- a/packages/core/client/src/modules/blocks/filter-blocks/collapse/filterCollapseItemFieldSettings.ts
+++ b/packages/core/client/src/modules/blocks/filter-blocks/collapse/filterCollapseItemFieldSettings.ts
@@ -80,7 +80,7 @@ export const filterCollapseItemFieldSettings = new SchemaSettings({
checked: field.componentProps.defaultCollapse,
onChange: (v) => {
field.componentProps.defaultCollapse = v;
- fieldSchema['x-component-props']['defaultCollapse'] = v;
+ _.set(fieldSchema, 'x-component-props.defaultCollapse', v);
dn.emit('patch', {
schema: {
['x-uid']: fieldSchema['x-uid'],
diff --git a/packages/core/client/src/modules/blocks/filter-blocks/collapse/filterCollapseItemInitializer.tsx b/packages/core/client/src/modules/blocks/filter-blocks/collapse/filterCollapseItemInitializer.tsx
index 01ae307748..e292bca17c 100644
--- a/packages/core/client/src/modules/blocks/filter-blocks/collapse/filterCollapseItemInitializer.tsx
+++ b/packages/core/client/src/modules/blocks/filter-blocks/collapse/filterCollapseItemInitializer.tsx
@@ -19,7 +19,6 @@ export const associationFilterFilterBlockInitializer = new SchemaInitializer({
title: '{{t("Association fields")}}',
useChildren() {
const associatedFields = useAssociatedFields();
- const useProps = '{{useAssociationFilterBlockProps}}';
const children = associatedFields.map((field) => ({
name: field.key,
title: field.uiSchema?.title,
@@ -32,11 +31,11 @@ export const associationFilterFilterBlockInitializer = new SchemaInitializer({
'x-toolbar': 'CollapseItemSchemaToolbar',
'x-settings': 'fieldSettings:FilterCollapseItem',
'x-component': 'AssociationFilter.Item',
+ 'x-use-component-props': 'useAssociationFilterBlockProps',
'x-component-props': {
fieldNames: {
label: field.targetKey || 'id',
},
- useProps,
},
properties: {},
},
@@ -51,7 +50,6 @@ export const associationFilterFilterBlockInitializer = new SchemaInitializer({
hideIfNoChildren: true,
useChildren() {
const optionalList = useOptionalFieldList();
- const useProps = '{{useAssociationFilterBlockProps}}';
const optionalChildren = optionalList.map((field) => ({
name: field.key,
title: field.uiSchema.title,
@@ -65,11 +63,11 @@ export const associationFilterFilterBlockInitializer = new SchemaInitializer({
'x-toolbar': 'CollapseItemSchemaToolbar',
'x-settings': 'fieldSettings:FilterCollapseItem',
'x-component': 'AssociationFilter.Item',
+ 'x-use-component-props': 'useAssociationFilterBlockProps',
'x-component-props': {
fieldNames: {
label: field.name,
},
- useProps,
},
properties: {},
},
@@ -96,7 +94,6 @@ export const filterCollapseItemInitializer_deprecated = new CompatibleSchemaInit
title: '{{t("Association fields")}}',
useChildren() {
const associatedFields = useAssociatedFields();
- const useProps = '{{useAssociationFilterBlockProps}}';
const cm = useCollectionManager_deprecated();
const children = associatedFields.map((field) => ({
name: field.key,
@@ -110,11 +107,11 @@ export const filterCollapseItemInitializer_deprecated = new CompatibleSchemaInit
'x-toolbar': 'CollapseItemSchemaToolbar',
'x-settings': 'fieldSettings:FilterCollapseItem',
'x-component': 'AssociationFilter.Item',
+ 'x-use-component-props': 'useAssociationFilterBlockProps',
'x-component-props': {
fieldNames: {
label: cm.getCollection(field.target)?.getPrimaryKey() || 'id',
},
- useProps,
},
properties: {},
},
@@ -129,7 +126,6 @@ export const filterCollapseItemInitializer_deprecated = new CompatibleSchemaInit
hideIfNoChildren: true,
useChildren() {
const optionalList = useOptionalFieldList();
- const useProps = '{{useAssociationFilterBlockProps}}';
const optionalChildren = optionalList.map((field) => ({
name: field.key,
title: field.uiSchema.title,
@@ -143,11 +139,11 @@ export const filterCollapseItemInitializer_deprecated = new CompatibleSchemaInit
'x-toolbar': 'CollapseItemSchemaToolbar',
'x-settings': 'fieldSettings:FilterCollapseItem',
'x-component': 'AssociationFilter.Item',
+ 'x-use-component-props': 'useAssociationFilterBlockProps',
'x-component-props': {
fieldNames: {
label: field.name,
},
- useProps,
},
properties: {},
},
@@ -172,7 +168,6 @@ export const filterCollapseItemInitializer = new CompatibleSchemaInitializer(
title: '{{t("Association fields")}}',
useChildren() {
const associatedFields = useAssociatedFields();
- const useProps = '{{useAssociationFilterBlockProps}}';
const cm = useCollectionManager_deprecated();
const children = associatedFields.map((field) => ({
name: field.key,
@@ -186,11 +181,11 @@ export const filterCollapseItemInitializer = new CompatibleSchemaInitializer(
'x-toolbar': 'CollapseItemSchemaToolbar',
'x-settings': 'fieldSettings:FilterCollapseItem',
'x-component': 'AssociationFilter.Item',
+ 'x-use-component-props': 'useAssociationFilterBlockProps',
'x-component-props': {
fieldNames: {
label: cm.getCollection(field.target)?.getPrimaryKey() || 'id',
},
- useProps,
},
properties: {},
},
@@ -205,7 +200,6 @@ export const filterCollapseItemInitializer = new CompatibleSchemaInitializer(
hideIfNoChildren: true,
useChildren() {
const optionalList = useOptionalFieldList();
- const useProps = '{{useAssociationFilterBlockProps}}';
const optionalChildren = optionalList.map((field) => ({
name: field.key,
title: field.uiSchema.title,
@@ -219,11 +213,11 @@ export const filterCollapseItemInitializer = new CompatibleSchemaInitializer(
'x-toolbar': 'CollapseItemSchemaToolbar',
'x-settings': 'fieldSettings:FilterCollapseItem',
'x-component': 'AssociationFilter.Item',
+ 'x-use-component-props': 'useAssociationFilterBlockProps',
'x-component-props': {
fieldNames: {
label: field.name,
},
- useProps,
},
properties: {},
},
diff --git a/packages/core/client/src/schema-component/antd/action/Action.Link.tsx b/packages/core/client/src/schema-component/antd/action/Action.Link.tsx
index 84a9253d90..33c8834970 100644
--- a/packages/core/client/src/schema-component/antd/action/Action.Link.tsx
+++ b/packages/core/client/src/schema-component/antd/action/Action.Link.tsx
@@ -3,12 +3,13 @@ import React from 'react';
import classnames from 'classnames';
import Action from './Action';
import { ComposedAction } from './types';
+import { withDynamicSchemaProps } from '../../../application/hoc/withDynamicSchemaProps';
-export const ActionLink: ComposedAction = observer(
- (props: any) => {
+export const ActionLink: ComposedAction = withDynamicSchemaProps(
+ observer((props: any) => {
return (
);
- },
+ }),
{ displayName: 'ActionLink' },
);
diff --git a/packages/core/client/src/schema-component/antd/action/Action.tsx b/packages/core/client/src/schema-component/antd/action/Action.tsx
index aa7b61fbf3..9b713fa88a 100644
--- a/packages/core/client/src/schema-component/antd/action/Action.tsx
+++ b/packages/core/client/src/schema-component/antd/action/Action.tsx
@@ -26,9 +26,10 @@ import { useA } from './hooks';
import { useGetAriaLabelOfAction } from './hooks/useGetAriaLabelOfAction';
import { ComposedAction } from './types';
import { linkageAction } from './utils';
+import { withDynamicSchemaProps } from '../../../application/hoc/withDynamicSchemaProps';
-export const Action: ComposedAction = observer(
- (props: any) => {
+export const Action: ComposedAction = withDynamicSchemaProps(
+ observer((props: any) => {
const {
popover,
confirm,
@@ -48,7 +49,7 @@ export const Action: ComposedAction = observer(
addChild,
onMouseEnter,
...others
- } = useProps(props);
+ } = useProps(props); // 新版 UISchema（1.0 之后）中已经废弃了 useProps，这里之所以继续保留是为了兼容旧版的 UISchema
const aclCtx = useACLActionParamsContext();
const { wrapSSR, componentCls, hashId } = useStyles();
const { t } = useTranslation();
@@ -209,7 +210,7 @@ export const Action: ComposedAction = observer(
}
return wrapSSR(result);
- },
+ }),
{ displayName: 'Action' },
);
diff --git a/packages/core/client/src/schema-component/antd/action/demos/demo3.tsx b/packages/core/client/src/schema-component/antd/action/demos/demo3.tsx
index 04cae185af..9a4e2dd796 100644
--- a/packages/core/client/src/schema-component/antd/action/demos/demo3.tsx
+++ b/packages/core/client/src/schema-component/antd/action/demos/demo3.tsx
@@ -2,6 +2,7 @@ import { Field } from '@formily/core';
import { ISchema, observer, useField, useFieldSchema } from '@formily/react';
import { Action, SchemaComponent, SchemaComponentProvider, useActionContext } from '@nocobase/client';
import { Radio } from 'antd';
+import _ from 'lodash';
import React, { useRef } from 'react';
const useCloseAction = () => {
@@ -25,7 +26,7 @@ const Editable = observer(
value={field.componentProps.openMode}
onChange={(e) => {
field.componentProps.openMode = e.target.value;
- schema['x-component-props']['openMode'] = e.target.value;
+ _.set(schema, 'x-component-props.openMode', e.target.value);
}}
>
Drawer
diff --git a/packages/core/client/src/schema-component/antd/association-field/FileManager.tsx b/packages/core/client/src/schema-component/antd/association-field/FileManager.tsx
index 7bf0ba43d0..382cba2a2a 100644
--- a/packages/core/client/src/schema-component/antd/association-field/FileManager.tsx
+++ b/packages/core/client/src/schema-component/antd/association-field/FileManager.tsx
@@ -145,8 +145,8 @@ const InternalFileManager = (props) => {
({
type: 'item',
name: field.key,
@@ -33,11 +32,11 @@ export const associationFilterInitializer = new SchemaInitializer({
'x-toolbar': 'CollapseItemSchemaToolbar',
'x-settings': 'fieldSettings:FilterCollapseItem',
'x-component': 'AssociationFilter.Item',
+ 'x-use-component-props': 'useAssociationFilterProps',
'x-component-props': {
fieldNames: {
label: field.targetKey || 'id',
},
- useProps,
},
properties: {},
},
diff --git a/packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.Designer.tsx b/packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.Designer.tsx
index d43290533f..95ef3b41c1 100644
--- a/packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.Designer.tsx
+++ b/packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.Designer.tsx
@@ -95,7 +95,7 @@ export const AssociationFilterItemDesigner = (props) => {
checked={field.componentProps.defaultCollapse}
onChange={(v) => {
field.componentProps.defaultCollapse = v;
- fieldSchema['x-component-props']['defaultCollapse'] = v;
+ _.set(fieldSchema, 'x-component-props.defaultCollapse', v);
dn.emit('patch', {
schema: {
['x-uid']: fieldSchema['x-uid'],
diff --git a/packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.tsx b/packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.tsx
index 22b07a13d0..63e4b7a01a 100644
--- a/packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.tsx
+++ b/packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.tsx
@@ -10,148 +10,152 @@ import { EllipsisWithTooltip } from '../input';
import { getLabelFormatValue, useLabelUiSchema } from '../record-picker';
import { AssociationFilter } from './AssociationFilter';
import useStyles from './AssociationFilter.Item.style';
+import { withDynamicSchemaProps } from '../../../application/hoc/withDynamicSchemaProps';
const { Panel } = Collapse;
-export const AssociationFilterItem = (props) => {
- const { wrapSSR, componentCls, hashId } = useStyles();
- const { token } = useToken();
- const collectionField = AssociationFilter.useAssociationField();
+export const AssociationFilterItem = withDynamicSchemaProps(
+ (props) => {
+ const { wrapSSR, componentCls, hashId } = useStyles();
+ const { token } = useToken();
+ const collectionField = AssociationFilter.useAssociationField();
- // 把一些可定制的状态通过 hook 提取出去了，为了兼容之前添加的 Table 区块，这里加了个默认值
- const fieldSchema = useFieldSchema();
- const Designer = useDesigner();
- const compile = useCompile();
- const {
- list,
- onSelected,
- handleSearchInput: _handleSearchInput,
- params,
- run,
- valueKey: _valueKey,
- labelKey: _labelKey,
- defaultCollapse,
- } = useProps(props);
+ // 把一些可定制的状态通过 hook 提取出去了，为了兼容之前添加的 Table 区块，这里加了个默认值
+ const fieldSchema = useFieldSchema();
+ const Designer = useDesigner();
+ const compile = useCompile();
+ const {
+ list,
+ onSelected,
+ handleSearchInput: _handleSearchInput,
+ params,
+ run,
+ valueKey: _valueKey,
+ labelKey: _labelKey,
+ defaultCollapse,
+ } = useProps(props); // 新版 UISchema（1.0 之后）中已经废弃了 useProps，这里之所以继续保留是为了兼容旧版的 UISchema
- const [searchVisible, setSearchVisible] = useState(false);
+ const [searchVisible, setSearchVisible] = useState(false);
- const defaultActiveKeyCollapse = useMemo(
- () => (defaultCollapse && collectionField?.name ? [collectionField.name] : []),
- [],
- );
- const valueKey = _valueKey || collectionField?.targetKey || 'id';
- const labelKey = _labelKey || fieldSchema['x-component-props']?.fieldNames?.label || valueKey;
+ const defaultActiveKeyCollapse = useMemo(
+ () => (defaultCollapse && collectionField?.name ? [collectionField.name] : []),
+ [],
+ );
+ const valueKey = _valueKey || collectionField?.targetKey || 'id';
+ const labelKey = _labelKey || fieldSchema['x-component-props']?.fieldNames?.label || valueKey;
- const fieldNames = {
- title: labelKey || valueKey,
- key: valueKey,
- };
+ const fieldNames = {
+ title: labelKey || valueKey,
+ key: valueKey,
+ };
- const [expandedKeys, setExpandedKeys] = useState([]);
- const [selectedKeys, setSelectedKeys] = useState([]);
- const [autoExpandParent, setAutoExpandParent] = useState(true);
+ const [expandedKeys, setExpandedKeys] = useState([]);
+ const [selectedKeys, setSelectedKeys] = useState([]);
+ const [autoExpandParent, setAutoExpandParent] = useState(true);
- const labelUiSchema = useLabelUiSchema(collectionField, fieldNames?.title || 'label');
+ const labelUiSchema = useLabelUiSchema(collectionField, fieldNames?.title || 'label');
- if (!collectionField) {
- return null;
- }
-
- const onExpand = (expandedKeysValue: React.Key[]) => {
- setExpandedKeys(expandedKeysValue);
- setAutoExpandParent(false);
- };
-
- const onSelect = (selectedKeysValue: React.Key[]) => {
- setSelectedKeys(selectedKeysValue);
- onSelected(selectedKeysValue);
- };
-
- const handleSearchToggle = (e: MouseEvent) => {
- const filter = params?.[0]?.filter;
- if (searchVisible || filter) {
- run({
- ...params?.[0],
- filter: undefined,
- });
+ if (!collectionField) {
+ return null;
}
- setSearchVisible(!searchVisible);
- e.stopPropagation();
- };
- const handleSearchClick = (e: MouseEvent) => {
- e.stopPropagation();
- };
+ const onExpand = (expandedKeysValue: React.Key[]) => {
+ setExpandedKeys(expandedKeysValue);
+ setAutoExpandParent(false);
+ };
- const handleSearchInput = (e: ChangeEvent) => {
- _handleSearchInput(e);
- };
+ const onSelect = (selectedKeysValue: React.Key[]) => {
+ setSelectedKeys(selectedKeysValue);
+ onSelected(selectedKeysValue);
+ };
- const title = fieldSchema.title ?? collectionField?.uiSchema?.title;
+ const handleSearchToggle = (e: MouseEvent) => {
+ const filter = params?.[0]?.filter;
+ if (searchVisible || filter) {
+ run({
+ ...params?.[0],
+ filter: undefined,
+ });
+ }
+ setSearchVisible(!searchVisible);
+ e.stopPropagation();
+ };
- return wrapSSR(
-
-
- null : undefined}>
-
-
- {searchVisible ? (
-
- ) : (
- compile(title)
- )}
-
- {
+ e.stopPropagation();
+ };
+
+ const handleSearchInput = (e: ChangeEvent) => {
+ _handleSearchInput(e);
+ };
+
+ const title = fieldSchema.title ?? collectionField?.uiSchema?.title;
+
+ return wrapSSR(
+
+
+ null : undefined}>
+
- {searchVisible ? (
-
- ) : (
-
- )}
-
-
- }
- key={defaultActiveKeyCollapse[0]}
- >
- {
- return (
-
- {getLabelFormatValue(labelUiSchema, compile(node[labelKey]))}
-
- );
- }}
- selectedKeys={selectedKeys}
- blockNode
- />
-
-
- ,
- );
-};
+
+ {searchVisible ? (
+
+ ) : (
+ compile(title)
+ )}
+
+
+ {searchVisible ? (
+
+ ) : (
+
+ )}
+
+
+ }
+ key={defaultActiveKeyCollapse[0]}
+ >
+ {
+ return (
+
+ {getLabelFormatValue(labelUiSchema, compile(node[labelKey]))}
+
+ );
+ }}
+ selectedKeys={selectedKeys}
+ blockNode
+ />
+
+
+ ,
+ );
+ },
+ { displayName: 'AssociationFilterItem' },
+);
diff --git a/packages/core/client/src/schema-component/antd/filter/Filter.tsx b/packages/core/client/src/schema-component/antd/filter/Filter.tsx
index 9bc62f45f1..627ae2d4aa 100644
--- a/packages/core/client/src/schema-component/antd/filter/Filter.tsx
+++ b/packages/core/client/src/schema-component/antd/filter/Filter.tsx
@@ -8,16 +8,20 @@ import { FilterAction } from './FilterAction';
import { FilterGroup } from './FilterGroup';
import { SaveDefaultValue } from './SaveDefaultValue';
import { FilterContext } from './context';
+import { withDynamicSchemaProps } from '../../../application/hoc/withDynamicSchemaProps';
const useDef = (options) => {
const field = useField();
return useRequest(() => Promise.resolve({ data: field.dataSource }), options);
};
-export const Filter: any = observer(
- (props: any) => {
+export const Filter: any = withDynamicSchemaProps(
+ observer((props: any) => {
const { useDataSource = useDef } = props;
+
+ // 新版 UISchema（1.0 之后）中已经废弃了 useProps，这里之所以继续保留是为了兼容旧版的 UISchema
const { options, dynamicComponent, className, collectionName } = useProps(props);
+
const field = useField();
const fieldSchema: any = useFieldSchema();
useDataSource({
@@ -47,7 +51,7 @@ export const Filter: any = observer(
);
- },
+ }),
{ displayName: 'Filter' },
);
diff --git a/packages/core/client/src/schema-component/antd/filter/FilterAction.tsx b/packages/core/client/src/schema-component/antd/filter/FilterAction.tsx
index 271ac8adff..76d6ecc44c 100644
--- a/packages/core/client/src/schema-component/antd/filter/FilterAction.tsx
+++ b/packages/core/client/src/schema-component/antd/filter/FilterAction.tsx
@@ -10,19 +10,23 @@ import { useDesignable } from '../../hooks';
import { useProps } from '../../hooks/useProps';
import { Action } from '../action';
import { StablePopover } from '../popover';
+import { withDynamicSchemaProps } from '../../../application/hoc/withDynamicSchemaProps';
export const FilterActionContext = createContext(null);
FilterActionContext.displayName = 'FilterActionContext';
-export const FilterAction = observer(
- (props: any) => {
+export const FilterAction = withDynamicSchemaProps(
+ observer((props: any) => {
const { t } = useTranslation();
const field = useField();
const [visible, setVisible] = useState(false);
const { designable, dn } = useDesignable();
const fieldSchema = useFieldSchema();
const form = useMemo