ruiling/tachybase_todo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: 跟踪上游,(refactor: change useProps to x-use-component-props (#3853)) (#629)

Browse Source 
Reviewed-on: daoyoucloud/tachycode#629
Co-authored-by: bai.jingfeng <bai.jingfeng@foxmail.com>
Co-committed-by: bai.jingfeng <bai.jingfeng@foxmail.com>
This commit is contained in:
bai.jingfeng 2024-04-08 17:09:14 +08:00 committed by sealday
parent bab77e28ac
commit 799603f9f2
94 changed files with 796 additions and 1036 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

262
packages/core/client/src/acl/Configuration/schemas/roleCollections.ts
View File

@ -1,262 +0,0 @@
import { ISchema } from '@nocobase/schema';
import { uid } from '@nocobase/schema';
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,
},
},
},
},
},
},
},
},
},
},
},
},
},
},
},
};

1
packages/core/client/src/acl/Configuration/schemas/roles.ts
View File

@ -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',

34
packages/core/client/src/acl/Configuration/schemas/scopes.ts
View File

@ -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-component-props': {
dynamicComponent: VariableInput,
useProps() {
'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,
},
},
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-component-props': {
dynamicComponent: VariableInput,
useProps() {
'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,
},
},
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 }}',
},
},
},

29
packages/core/client/src/application/hoc/withDynamicSchemaProps.tsx
View File

@ -1,6 +1,7 @@
import { useExpressionScope } from '@nocobase/schema';
import React, { ComponentType, useMemo } from 'react';
import { useDesignable } from '../../schema-component';
import _ from 'lodash';
const useDefaultSchemaProps = () => undefined;
@ -28,14 +29,35 @@ export function withDynamicSchemaProps<T = any>(Component: any, options: WithSch
}
}, [dn]);
const useSchemaProps = useMemo(() => {
const getHook = (str: string, scope: Record<string, any>, allText: string) => {
let res = undefined;
if (useComponentPropsStr) {
res = scope[useComponentPropsStr];
if (_.isFunction(str)) {
res = str;
} else {
res = scope[str];
if (!res) {
console.error(`${useComponentPropsStr} is not registered`);
console.error(`${allText} is not registered`);
}
}
return res || useDefaultSchemaProps;
};
if (!useComponentPropsStr) {
return 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);
@ -43,6 +65,7 @@ export function withDynamicSchemaProps<T = any>(Component: any, options: WithSch
return { ...props, ...schemaProps };
}, [schemaProps, props]);
// @ts-ignore
return <Component {...memoProps}>{props.children}</Component>;
};

2
packages/core/client/src/collection-manager/interfaces/subTable.ts
View File

@ -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 }}',
},
},
},

2
packages/core/client/src/modules/actions/bulk-destroy/BulkDestroyActionInitializer.tsx
View File

@ -15,13 +15,13 @@ export const BulkDestroyActionInitializer = (props) => {
'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-action-settings': {
triggerWorkflows: [],

2
packages/core/client/src/modules/actions/delete/DestroyActionInitializer.tsx
View File

@ -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: [],

2
packages/core/client/src/modules/actions/disassociate/DisassociateActionInitializer.tsx
View File

@ -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: [],

2
packages/core/client/src/modules/actions/filter/FilterActionInitializer.tsx
View File

@ -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 <ActionInitializer {...props} schema={schema} />;

2
packages/core/client/src/modules/actions/refresh/RefreshActionInitializer.tsx
View File

@ -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 <ActionInitializer {...props} schema={schema} />;

4
packages/core/client/src/modules/actions/save-record/SaveRecordActionInitializer.tsx
View File

@ -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();

2
packages/core/client/src/modules/actions/submit/CreateSubmitActionInitializer.tsx
View File

@ -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: [],

2
packages/core/client/src/modules/actions/submit/UpdateSubmitActionInitializer.tsx
View File

@ -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: [],

4
packages/core/client/src/modules/actions/update-record/UpdateRecordActionInitializer.tsx
View File

@ -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();

2
packages/core/client/src/modules/blocks/filter-blocks/collapse/filterCollapseItemFieldSettings.ts
View File

@ -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'],

15
packages/core/client/src/modules/blocks/filter-blocks/collapse/filterCollapseItemInitializer.tsx
View File

@ -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: {},
},
@ -96,7 +95,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 +108,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 +127,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 +140,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 +169,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 +182,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 +201,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 +214,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: {},
},

7
packages/core/client/src/schema-component/antd/action/Action.Link.tsx
View File

@ -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 (
<Action {...props} component={props.component || 'a'} className={classnames('nb-action-link', props.className)} />
);
},
}),
{ displayName: 'ActionLink' },
);

9
packages/core/client/src/schema-component/antd/action/Action.tsx
View File

@ -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,
@ -47,7 +48,7 @@ export const Action: ComposedAction = observer(
/** 如果为 true 则说明该按钮是树表格的 Add child 按钮 */
addChild,
...others
} = useProps(props);
} = useProps(props); // 新版 UISchema（1.0 之后）中已经废弃了 useProps，这里之所以继续保留是为了兼容旧版的 UISchema
const aclCtx = useACLActionParamsContext();
const { wrapSSR, componentCls, hashId } = useStyles();
const { t } = useTranslation();
@ -181,7 +182,7 @@ export const Action: ComposedAction = observer(
}
return wrapSSR(result);
},
}),
{ displayName: 'Action' },
);

3
packages/core/client/src/schema-component/antd/action/demos/demo3.tsx
View File

@ -3,6 +3,7 @@ import { ISchema, observer, useField, useFieldSchema } from '@nocobase/schema';
import { Action, SchemaComponent, SchemaComponentProvider, useActionContext } from '@nocobase/client';
import { Radio } from 'antd';
import React, { useRef } from 'react';
import _ from 'lodash';
const useCloseAction = () => {
const { setVisible } = useActionContext();
@ -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);
}}
>
<Radio.Button value="drawer">Drawer</Radio.Button>

4
packages/core/client/src/schema-component/antd/association-field/FileManager.tsx
View File

@ -145,8 +145,8 @@ const InternalFileManager = (props) => {
<FileSelector
value={options}
multiple={multiple}
quickUpload={fieldSchema['x-component-props'].quickUpload !== false}
selectFile={fieldSchema['x-component-props'].selectFile !== false}
quickUpload={fieldSchema['x-component-props']?.quickUpload !== false}
selectFile={fieldSchema['x-component-props']?.selectFile !== false}
action={`${collectionField?.target}:create`}
onSelect={handleSelect}
onRemove={handleRemove}

2
packages/core/client/src/schema-component/antd/association-field/schema.ts
View File

@ -71,13 +71,13 @@ export default {
title: '{{ t("Submit") }}',
'x-action': 'submit',
'x-component': 'Action',
'x-use-component-props': 'usePickActionProps',
// 'x-designer': 'Action.Designer',
'x-toolbar': 'ActionSchemaToolbar',
'x-settings': 'actionSettings:submit',
'x-component-props': {
type: 'primary',
htmlType: 'submit',
useProps: '{{ usePickActionProps }}',
},
},
},

3
packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Initializer.tsx
View File

@ -19,7 +19,6 @@ export const associationFilterInitializer = new SchemaInitializer({
title: '{{t("Association fields")}}',
useChildren() {
const associatedFields = useAssociatedFields();
const useProps = '{{useAssociationFilterProps}}';
const children: SchemaInitializerItemType[] = associatedFields.map((field) => ({
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: {},
},

2
packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.Designer.tsx
View File

@ -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'],

8
packages/core/client/src/schema-component/antd/association-filter/AssociationFilter.Item.tsx
View File

@ -10,10 +10,12 @@ 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) => {
export const AssociationFilterItem = withDynamicSchemaProps(
(props) => {
const { wrapSSR, componentCls, hashId } = useStyles();
const { token } = useToken();
const collectionField = AssociationFilter.useAssociationField();
@ -154,4 +156,6 @@ export const AssociationFilterItem = (props) => {
</Collapse>
</SortableItem>,
);
};
},
{ displayName: 'AssociationFilterItem' },
);

9
packages/core/client/src/schema-component/antd/filter/Filter.tsx
View File

@ -8,15 +8,18 @@ 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<ObjectFieldModel>();
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<ObjectFieldModel>();
const fieldSchema: any = useFieldSchema();
@ -47,7 +50,7 @@ export const Filter: any = observer(
</FilterContext.Provider>
</div>
);
},
}),
{ displayName: 'Filter' },
);

9
packages/core/client/src/schema-component/antd/filter/FilterAction.tsx
View File

@ -10,18 +10,21 @@ 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<any>(null);
FilterActionContext.displayName = 'FilterActionContext';
export const FilterAction = observer(
(props: any) => {
export const FilterAction = withDynamicSchemaProps(
observer((props: any) => {
const { t } = useTranslation();
const field = useField<Field>();
const [visible, setVisible] = useState(false);
const { designable, dn } = useDesignable();
const fieldSchema = useFieldSchema();
const form = useMemo<Form>(() => props.form || createForm(), []);
// 新版 UISchema（1.0 之后）中已经废弃了 useProps，这里之所以继续保留是为了兼容旧版的 UISchema
const { options, onSubmit, onReset, ...others } = useProps(props);
const onOpenChange = useCallback((visible: boolean): void => {
setVisible(visible);
@ -93,7 +96,7 @@ export const FilterAction = observer(
</StablePopover>
</FilterActionContext.Provider>
);
},
}),
{ displayName: 'FilterAction' },
);

6
packages/core/client/src/schema-component/antd/filter/demos/demo6.tsx
View File

@ -60,9 +60,10 @@ const schema: any = {
name: 'filter',
type: 'object',
'x-component': 'Filter',
'x-component-props': {
useProps: () => {
'x-use-component-props': () => {
// eslint-disable-next-line react-hooks/rules-of-hooks
const { name } = useCollection_deprecated();
// eslint-disable-next-line react-hooks/rules-of-hooks
const options = useFilterOptions(name);
return {
options,
@ -70,7 +71,6 @@ const schema: any = {
},
},
},
},
};
const SwitchCollection = (props) => {

4
packages/core/client/src/schema-component/antd/form-v2/demos/demo2.tsx
View File

@ -74,9 +74,7 @@ const schema: ISchema = {
form: {
type: 'void',
'x-component': 'FormV2',
'x-component-props': {
useProps: '{{ useFormBlockProps }}',
},
'x-use-component-props': 'useFormBlockProps',
properties: {
nickname: {
type: 'string',

4
packages/core/client/src/schema-component/antd/form-v2/demos/demo3.tsx
View File

@ -51,9 +51,7 @@ const schema: ISchema = {
type: 'void',
'x-component': 'FormV2',
'x-read-pretty': true,
'x-component-props': {
useProps: '{{ useFormBlockProps }}',
},
'x-use-component-props': 'useFormBlockProps',
properties: {
grid: {
type: 'void',

7
packages/core/client/src/schema-component/antd/g2plot/G2PlotDesigner.tsx
View File

@ -9,6 +9,7 @@ import {
SchemaSettingsRemove,
} from '../../../schema-settings';
import { useCompile, useDesignable } from '../../hooks';
import _ from 'lodash';
const validateJSON = {
validator: `{{(value, rule)=> {
@ -94,9 +95,9 @@ export const G2PlotDesigner = () => {
} else {
field.componentProps.config = conf;
}
fieldSchema.title = title;
fieldSchema['x-component-props']['plot'] = plot;
fieldSchema['x-component-props']['config'] = JSON.parse(config);
_.set(fieldSchema, 'title', title);
_.set(fieldSchema, 'x-component-props.plot', plot);
_.set(fieldSchema, 'x-component-props.config', JSON.parse(config));
dn.emit('patch', {
schema: {
title,

5
packages/core/client/src/schema-component/antd/grid/Grid.tsx
View File

@ -9,6 +9,7 @@ import { useFormBlockType } from '../../../block-provider';
import { DndContext } from '../../common/dnd-context';
import { useToken } from '../__builtins__';
import useStyles from './Grid.style';
import _ from 'lodash';
const GridRowContext = createContext<any>({});
GridRowContext.displayName = 'GridRowContext';
@ -124,8 +125,8 @@ const ColDivider = (props) => {
el.parentElement.clientWidth
).toFixed(2);
prevSchema['x-component-props']['width'] = preWidth;
nextSchema['x-component-props']['width'] = nextWidth;
_.set(prevSchema, 'x-component-props.width', preWidth);
_.set(nextSchema, 'x-component-props.width', nextWidth);
dn.emit('batchPatch', {
schemas: [
{

4
packages/core/client/src/schema-component/antd/record-picker/demos/demo1.tsx
View File

@ -92,12 +92,12 @@ const schema: 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: {
@ -129,10 +129,10 @@ const schema: ISchema = {
title: '{{ t("Submit") }}',
'x-action': 'submit',
'x-component': 'Action',
'x-use-component-props': 'usePickActionProps',
'x-component-props': {
type: 'primary',
htmlType: 'submit',
useProps: '{{ usePickActionProps }}',
},
},
},

5
packages/core/client/src/schema-component/antd/table-v2/Table.Column.Designer.tsx
View File

@ -21,6 +21,7 @@ import { SchemaSettingsDataScope } from '../../../schema-settings/SchemaSettings
import { isPatternDisabled } from '../../../schema-settings/isPatternDisabled';
import { SchemaSettingsDateFormat } from '../../../schema-settings/SchemaSettingsDateFormat';
import { SchemaSettingsSortingRule } from '../../../schema-settings/SchemaSettingsSortingRule';
import _ from 'lodash';
export const useLabelFields = (collectionName?: any) => {
// 需要在组件顶层调用
@ -232,11 +233,11 @@ export const TableColumnDesigner = (props) => {
value={fieldNames?.['label']}
onChange={(label) => {
const fieldNames = {
...collectionField?.uiSchema?.['x-component-props']['fieldNames'],
...collectionField?.uiSchema?.['x-component-props']?.['fieldNames'],
...fieldSchema?.['x-component-props']?.['fieldNames'],
label,
};
fieldSchema['x-component-props']['fieldNames'] = fieldNames;
_.set(fieldSchema, 'x-component-props.fieldNames', fieldNames);
const path = field.path?.splice(field.path?.length - 1, 1);
field.form.query(`${path.concat(`*.` + fieldSchema.name)}`).forEach((f) => {
f.componentProps.fieldNames = fieldNames;

6
packages/core/client/src/schema-component/antd/table-v2/demos/demo1.tsx
View File

@ -99,9 +99,7 @@ const formSchema: ISchema = {
form: {
type: 'void',
'x-component': 'FormV2',
'x-component-props': {
useProps: '{{ useFormBlockProps }}',
},
'x-use-component-props': 'useFormBlockProps',
properties: {
id: {
type: 'string',
@ -157,12 +155,12 @@ const schema: ISchema = {
type: 'array',
title: `编辑模式`,
'x-component': 'TableV2',
'x-use-component-props': 'useTableBlockProps',
'x-component-props': {
rowKey: 'id',
rowSelection: {
type: 'checkbox',
},
useProps: '{{ useTableBlockProps }}',
},
properties: {
column1: {

5
packages/core/client/src/schema-component/antd/table/Table.Column.Designer.tsx
View File

@ -10,6 +10,7 @@ import {
} from '../../../schema-settings';
import { useCompile, useDesignable } from '../../hooks';
import { useActionContext } from '../action';
import _ from 'lodash';
const useLabelFields = (collectionName?: any) => {
const compile = useCompile();
@ -122,10 +123,10 @@ export const TableColumnDesigner = (props) => {
value={fieldSchema?.['x-component-props']?.['fieldNames']?.['label']}
onChange={(label) => {
const fieldNames = {
...fieldSchema['x-component-props']['fieldNames'],
...fieldSchema['x-component-props']?.['fieldNames'],
label,
};
fieldSchema['x-component-props']['fieldNames'] = fieldNames;
_.set(fieldSchema, 'x-component-props.fieldNames', fieldNames);
field.query(`.*.${fieldSchema.name}`).take((f) => {
f.componentProps.fieldNames = fieldNames;
});

10
packages/core/client/src/schema-component/antd/upload/Upload.tsx
View File

@ -11,6 +11,8 @@ import { ReadPretty } from './ReadPretty';
import { isImage, isPdf, toArr, toFileList, toItem, toValue, useUploadProps } from './shared';
import { useStyles } from './style';
import type { ComposedUpload, DraggerProps, DraggerV2Props, UploadProps } from './type';
import { withDynamicSchemaProps } from '../../../application/hoc/withDynamicSchemaProps';
import { useProps } from '../../hooks/useProps';
export const Upload: ComposedUpload = connect(
(props: UploadProps) => {
@ -299,13 +301,13 @@ Upload.Dragger = connect(
}),
);
Upload.DraggerV2 = connect(
Upload.DraggerV2 = withDynamicSchemaProps(
connect(
(props: DraggerV2Props) => {
const { t } = useTranslation();
const defaultTitle = t('Click or drag file to this area to upload');
const defaultSubTitle = t('Support for a single or bulk upload, file size should not exceed') + ` 10MB`;
const { title = defaultTitle, subTitle = defaultSubTitle, useProps } = props;
const extraProps: Record<string, any> = useProps?.() || {};
const { title = defaultTitle, subTitle = defaultSubTitle, ...extraProps } = useProps(props);
const [loading, setLoading] = useState(false);
const { wrapSSR, hashId, componentCls: prefixCls } = useStyles();
@ -335,6 +337,8 @@ Upload.DraggerV2 = connect(
mapProps({
value: 'fileList',
}),
),
{ displayName: 'Upload.DraggerV2' },
);
export default Upload;

1
packages/core/client/src/schema-component/antd/upload/type.d.ts vendored
View File

@ -22,6 +22,7 @@ export type DraggerV2Props = Omit<AntdDraggerProps, 'onChange'> & {
title?: string;
subTitle?: string;
children?: React.ReactNode;
/** @deprecated */
useProps?: () => any;
};

2
packages/core/client/src/schema-initializer/items/CreateFilterActionInitializer.tsx
View File

@ -7,11 +7,11 @@ export const CreateFilterActionInitializer = (props) => {
title: '{{ t("Filter") }}',
'x-action': 'submit',
'x-component': 'Action',
'x-use-component-props': 'useFilterBlockActionProps',
'x-designer': 'Action.Designer',
'x-component-props': {
type: 'primary',
htmlType: 'submit',
useProps: '{{ useFilterBlockActionProps }}',
},
};
return <ActionInitializer {...props} schema={schema} />;

4
packages/core/client/src/schema-initializer/items/CreateResetActionInitializer.tsx
View File

@ -6,10 +6,8 @@ export const CreateResetActionInitializer = (props) => {
const schema = {
title: '{{ t("Reset") }}',
'x-component': 'Action',
'x-use-component-props': 'useResetBlockActionProps',
'x-designer': 'Action.Designer',
'x-component-props': {
useProps: '{{ useResetBlockActionProps }}',
},
};
return <ActionInitializer {...props} schema={schema} />;
};

2
packages/core/client/src/schema-initializer/items/SelectActionInitializer.tsx
View File

@ -39,13 +39,13 @@ export const SelectActionInitializer = (props) => {
title: '{{ t("Submit") }}',
'x-action': 'submit',
'x-component': 'Action',
'x-use-component-props': 'usePickActionProps',
// 'x-designer': 'Action.Designer',
'x-toolbar': 'ActionSchemaToolbar',
'x-settings': 'actionSettings:submit',
'x-component-props': {
type: 'primary',
htmlType: 'submit',
useProps: '{{ usePickActionProps }}',
},
},
},

1
packages/core/client/src/schema-initializer/items/SubmitActionInitializer.tsx
View File

@ -13,7 +13,6 @@ export const SubmitActionInitializer = (props) => {
'x-component-props': {
type: 'primary',
htmlType: 'submit',
// useProps: '{{ bp.useSubmitActionProps }}',
},
};
return <ActionInitializer {...props} schema={schema} />;

24
packages/core/client/src/schema-initializer/utils.ts
View File

@ -965,6 +965,12 @@ export const useCollectionDataSourceItems = ({
return noAssociationMenu;
};
/**
* @deprecated
* 已弃用，请使用 createDetailsUISchema 和 createDetailsWithPaginationUISchema 替代
* @param options
* @returns
*/
export const createDetailsBlockSchema = (options: {
collection: string;
dataSource: string;
@ -1015,10 +1021,8 @@ export const createDetailsBlockSchema = (options: {
[uid()]: {
type: 'void',
'x-component': 'Details',
'x-use-component-props': 'useDetailsBlockProps',
'x-read-pretty': true,
'x-component-props': {
useProps: '{{ useDetailsBlockProps }}',
},
properties: {
[uid()]: {
type: 'void',
@ -1042,9 +1046,7 @@ export const createDetailsBlockSchema = (options: {
pagination: {
type: 'void',
'x-component': 'Pagination',
'x-component-props': {
useProps: '{{ useDetailsPaginationProps }}',
},
'x-use-component-props': 'useDetailsPaginationProps',
},
}
: {}),
@ -1117,9 +1119,7 @@ export const createFormBlockSchema = (options: {
[uid()]: {
type: 'void',
'x-component': 'FormV2',
'x-component-props': {
useProps: '{{ useFormBlockProps }}',
},
'x-use-component-props': 'useFormBlockProps',
properties: {
[uid()]: {
type: 'void',
@ -1185,10 +1185,8 @@ export const createReadPrettyFormBlockSchema = (options) => {
[uid()]: {
type: 'void',
'x-component': 'FormV2',
'x-use-component-props': 'useFormBlockProps',
'x-read-pretty': true,
'x-component-props': {
useProps: '{{ useFormBlockProps }}',
},
properties: {
[uid()]: {
type: 'void',
@ -1273,12 +1271,12 @@ export const createTableBlockSchema = (options) => {
type: 'array',
'x-initializer': tableColumnInitializers ?? 'table:configureColumns',
'x-component': 'TableV2',
'x-use-component-props': 'useTableBlockProps',
'x-component-props': {
rowKey: 'id',
rowSelection: {
type: 'checkbox',
},
useProps: '{{ useTableBlockProps }}',
},
properties: {
actions: {

12
packages/core/client/src/schema-settings/DataTemplates/FormDataTemplates.tsx
View File

@ -7,7 +7,7 @@ import React, { useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { useCollectionManager_deprecated } from '../../collection-manager';
import { mergeFilter } from '../../filter-provider/utils';
import { SchemaComponent, SchemaComponentContext, removeNullCondition } from '../../schema-component';
import { SchemaComponent, SchemaComponentContext, removeNullCondition, useProps } from '../../schema-component';
import { ITemplate } from '../../schema-component/antd/form-v2/Templates';
import { VariableInput } from '../VariableInput';
import { AsDefaultTemplate } from './components/AsDefaultTemplate';
@ -15,6 +15,7 @@ import { ArrayCollapse } from './components/DataTemplateTitle';
import { getSelectedIdFilter } from './components/Designer';
import { useCollectionState } from './hooks/useCollectionState';
import { useSyncFromForm } from './utils';
import { withDynamicSchemaProps } from '../../application/hoc/withDynamicSchemaProps';
const Tree = connect(
AntdTree,
@ -38,10 +39,11 @@ export const compatibleDataId = (data, config?) => {
});
};
export const FormDataTemplates = observer(
export const FormDataTemplates = withDynamicSchemaProps(
observer(
(props: any) => {
const { useProps, formSchema, designerCtx } = props;
const { defaultValues, collectionName } = useProps();
// 新版 UISchema（1.0 之后）中已经废弃了 useProps，这里之所以继续保留是为了兼容旧版的 UISchema
const { formSchema, designerCtx, defaultValues, collectionName } = useProps(props);
const {
collectionList,
getEnableFieldTree,
@ -265,6 +267,8 @@ export const FormDataTemplates = observer(
);
},
{ displayName: 'FormDataTemplates' },
),
{ displayName: 'FormDataTemplates' },
);
export function getLabel(titleField) {

2
packages/core/client/src/schema-settings/DataTemplates/utils.tsx
View File

@ -184,7 +184,7 @@ export const useSyncFromForm = (fieldSchema, collection?, callBack?) => {
selectFields.add(path);
}
if (collectionfield && (isAssociationField || isAssociationSubfield) && s['x-component'] !== 'TableField') {
formData.add({ name: path, fieldMode: s['x-component-props']['mode'] || 'Select' });
formData.add({ name: path, fieldMode: s['x-component-props']?.['mode'] || 'Select' });
if (['Nester', 'SubTable'].includes(s['x-component-props']?.mode)) {
const bufPrefix = prefix && prefix !== '' ? prefix + '.' + s.name : s.name;
getAssociationAppends(s, bufPrefix);

12
packages/core/client/src/schema-settings/EnableChildCollections/index.tsx
View File

@ -2,12 +2,12 @@ import { observer, useForm } from '@nocobase/schema';
import { action } from '@nocobase/schema';
import React from 'react';
import { useCollectionManager_deprecated } from '../../collection-manager';
import { SchemaComponent, useCompile } from '../../schema-component';
import { SchemaComponent, useCompile, useProps } from '../../schema-component';
import { withDynamicSchemaProps } from '../../application/hoc/withDynamicSchemaProps';
export const EnableChildCollections = observer(
(props: any) => {
const { useProps } = props;
const { defaultValues, collectionName } = useProps();
export const EnableChildCollections = withDynamicSchemaProps(
observer((props: any) => {
const { defaultValues, collectionName } = useProps(props);
const form = useForm();
const compile = useCompile();
const { getChildrenCollections } = useCollectionManager_deprecated();
@ -105,6 +105,6 @@ export const EnableChildCollections = observer(
scope={{ useAsyncDataSource, loadData }}
/>
);
},
}),
{ displayName: 'EnableChildCollections' },
);

16
packages/core/client/src/schema-settings/LinkageRules/LinkageRuleActionGroup.tsx
View File

@ -10,6 +10,9 @@ import React, { useCallback, useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { FormButtonLinkageRuleAction, FormFieldLinkageRuleAction } from './LinkageRuleAction';
import { RemoveActionContext } from './context';
import { withDynamicSchemaProps } from '../../application/hoc/withDynamicSchemaProps';
import { useProps } from '../../schema-component/hooks/useProps';
export const LinkageRuleActions = observer(
(props: any): any => {
const { type, linkageOptions } = props;
@ -32,18 +35,19 @@ export const LinkageRuleActions = observer(
);
interface LinkageRuleActionGroupProps {
useProps: () => {
type: 'button' | 'field';
linkageOptions: any;
collectionName: string;
};
}
export const LinkageRuleActionGroup = (props: LinkageRuleActionGroupProps) => {
export const LinkageRuleActionGroup = withDynamicSchemaProps(
(props: LinkageRuleActionGroupProps) => {
const { t } = useTranslation();
const field = useField<VoidField>();
const logic = 'actions';
const { type, linkageOptions, collectionName } = props.useProps();
// 新版 UISchema（1.0 之后）中已经废弃了 useProps，这里之所以继续保留是为了兼容旧版的 UISchema
const { type, linkageOptions, collectionName } = useProps(props);
const style = useMemo(() => ({ marginLeft: 10 }), []);
const components = useMemo(
@ -66,4 +70,6 @@ export const LinkageRuleActionGroup = (props: LinkageRuleActionGroupProps) => {
</Space>
</div>
);
};
},
{ displayName: 'LinkageRuleActionGroup' },
);

30
packages/core/client/src/schema-settings/LinkageRules/index.tsx
View File

@ -6,7 +6,7 @@ import { FormBlockContext } from '../../block-provider';
import { useCollectionManager_deprecated } from '../../collection-manager';
import { useCollectionParentRecordData } from '../../data-source/collection-record/CollectionRecordProvider';
import { RecordProvider } from '../../record-provider';
import { SchemaComponent } from '../../schema-component';
import { SchemaComponent, useProps } from '../../schema-component';
import { DynamicComponentProps } from '../../schema-component/antd/filter/DynamicComponent';
import { FilterContext } from '../../schema-component/antd/filter/context';
import { VariableOption, VariablesContextType } from '../../variables/types';
@ -14,6 +14,7 @@ import { VariableInput, getShouldChange } from '../VariableInput/VariableInput';
import { LinkageRuleActionGroup } from './LinkageRuleActionGroup';
import { EnableLinkage } from './components/EnableLinkage';
import { ArrayCollapse } from './components/LinkageHeader';
import { withDynamicSchemaProps } from '../../application/hoc/withDynamicSchemaProps';
interface usePropsReturn {
options: any;
@ -30,16 +31,23 @@ interface usePropsReturn {
}
interface Props {
useProps: () => usePropsReturn;
dynamicComponent: any;
}
export const FormLinkageRules = observer(
(props: Props) => {
export const FormLinkageRules = withDynamicSchemaProps(
observer((props: Props) => {
const fieldSchema = useFieldSchema();
const { useProps, dynamicComponent } = props;
const { options, defaultValues, collectionName, form, formBlockType, variables, localVariables, record } =
useProps();
const {
options,
defaultValues,
collectionName,
form,
formBlockType,
variables,
localVariables,
record,
dynamicComponent,
} = useProps(props);
const { getAllCollectionsInheritChain } = useCollectionManager_deprecated();
const parentRecordData = useCollectionParentRecordData();
@ -80,9 +88,7 @@ export const FormLinkageRules = observer(
},
condition: {
'x-component': 'Filter',
'x-component-props': {
collectionName,
useProps() {
'x-use-component-props': () => {
return {
options,
className: css`
@ -92,6 +98,8 @@ export const FormLinkageRules = observer(
`,
};
},
'x-component-props': {
collectionName,
dynamicComponent: (props: DynamicComponentProps) => {
const { collectionField } = props;
return (
@ -175,6 +183,6 @@ export const FormLinkageRules = observer(
</RecordProvider>
</FormBlockContext.Provider>
);
},
}),
{ displayName: 'FormLinkageRules' },
);

20
packages/core/client/src/schema-settings/SchemaSettings.tsx
View File

@ -1245,13 +1245,14 @@ export const SchemaSettingsLinkageRules = function LinkageRules(props) {
properties: {
fieldReaction: {
'x-component': FormLinkageRules,
'x-component-props': {
useProps: () => {
'x-use-component-props': () => {
// eslint-disable-next-line react-hooks/rules-of-hooks
const options = useLinkageCollectionFilterOptions(collectionName);
return {
options,
defaultValues: gridSchema?.['x-linkage-rules'] || fieldSchema?.['x-linkage-rules'],
type,
// eslint-disable-next-line react-hooks/rules-of-hooks
linkageOptions: useLinkageCollectionFieldOptions(collectionName),
collectionName,
form,
@ -1263,7 +1264,6 @@ export const SchemaSettingsLinkageRules = function LinkageRules(props) {
},
},
},
},
}),
[collectionName, fieldSchema, form, gridSchema, localVariables, record, t, type, variables],
);
@ -1274,7 +1274,7 @@ export const SchemaSettingsLinkageRules = function LinkageRules(props) {
for (const rule of v.fieldReaction.rules) {
rules.push(_.pickBy(rule, _.identity));
}
const templateId = gridSchema['x-component'] === 'BlockTemplate' && gridSchema['x-component-props'].templateId;
const templateId = gridSchema['x-component'] === 'BlockTemplate' && gridSchema['x-component-props']?.templateId;
const uid = (templateId && getTemplateById(templateId).uid) || gridSchema['x-uid'];
const schema = {
['x-uid']: uid,
@ -1332,15 +1332,15 @@ export const SchemaSettingsDataTemplates = function DataTemplates(props) {
fieldReaction: {
'x-decorator': (props) => <FlagProvider {...props} isInFormDataTemplate />,
'x-component': FormDataTemplates,
'x-component-props': {
designerCtx,
formSchema,
useProps: () => {
'x-use-component-props': () => {
return {
defaultValues: templateData,
collectionName,
};
},
'x-component-props': {
designerCtx,
formSchema,
},
},
},
@ -1395,15 +1395,13 @@ export function SchemaSettingsEnableChildCollections(props) {
properties: {
enableChildren: {
'x-component': EnableChildCollections,
'x-component-props': {
useProps: () => {
'x-use-component-props': () => {
return {
defaultValues: fieldSchema?.['x-enable-children'],
collectionName,
};
},
},
},
allowAddToCurrent: {
type: 'boolean',
'x-content': "{{t('Allow adding records to the current collection')}}",

2
packages/core/client/src/schema-settings/SchemaSettingsDefaultValue.tsx
View File

@ -140,7 +140,7 @@ export const SchemaSettingsDefaultValue = function DefaultValueConfigure(props:
}
if (collectionField?.uiSchema['x-component'] === 'Checkbox') {
s['x-component-props'].defaultChecked = defaultValue;
_.set(s, 'x-component-props.defaultChecked', defaultValue);
// 在这里如果不设置 type 为 void，会导致设置的默认值不生效
// 但是我不知道为什么必须要设置为 void ？

12
packages/core/client/src/schema-templates/schemas/uiSchemaTemplates.ts
View File

@ -72,13 +72,13 @@ export const uiSchemaTemplatesSchema: ISchema = {
title: '{{ t("Delete") }}',
'x-action': 'destroy',
'x-component': 'Action',
'x-use-component-props': useBulkDestroyTemplateProps,
'x-component-props': {
icon: 'DeleteOutlined',
confirm: {
title: "{{t('Delete record')}}",
content: "{{t('Are you sure you want to delete it?')}}",
},
useProps: useBulkDestroyTemplateProps,
},
},
},
@ -86,11 +86,11 @@ export const uiSchemaTemplatesSchema: ISchema = {
[uid()]: {
type: 'array',
'x-component': 'TableV2',
'x-use-component-props': 'useTableBlockProps',
'x-component-props': {
rowSelection: {
type: 'checkbox',
},
useProps: '{{ useTableBlockProps }}',
},
properties: {
actions: {
@ -146,9 +146,7 @@ export const uiSchemaTemplatesSchema: ISchema = {
[uid()]: {
type: 'void',
'x-component': 'FormV2',
'x-component-props': {
useProps: '{{ useFormBlockProps }}',
},
'x-use-component-props': 'useFormBlockProps',
properties: {
name: {
type: 'string',
@ -171,10 +169,10 @@ export const uiSchemaTemplatesSchema: ISchema = {
title: '{{t("Submit")}}',
'x-action': 'submit',
'x-component': 'Action',
'x-use-component-props': useUpdateSchemaTemplateActionProps,
'x-component-props': {
type: 'primary',
htmlType: 'submit',
useProps: useUpdateSchemaTemplateActionProps,
},
type: 'void',
},
@ -192,13 +190,13 @@ export const uiSchemaTemplatesSchema: ISchema = {
title: '{{ t("Delete") }}',
'x-action': 'destroy',
'x-component': 'Action.Link',
'x-use-component-props': useDestroyTemplateProps,
'x-component-props': {
icon: 'DeleteOutlined',
confirm: {
title: "{{t('Delete record')}}",
content: "{{t('Are you sure you want to delete it?')}}",
},
useProps: useDestroyTemplateProps,
},
},
},

2
packages/plugins/@nocobase/plugin-acl/src/client/schemas/roles.ts
View File

@ -97,9 +97,9 @@ export const roleCollectionsSchema: ISchema = {
},
'x-action': 'filter',
'x-component': 'Filter.Action',
'x-use-component-props': 'useFilterActionProps',
'x-component-props': {
icon: 'FilterOutlined',
useProps: '{{ useFilterActionProps }}',
},
'x-align': 'left',
},

34
packages/plugins/@nocobase/plugin-acl/src/client/schemas/scopes.ts
View File

@ -122,9 +122,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',
@ -137,15 +135,17 @@ export const scopesSchema: ISchema = {
name: 'filter',
'x-decorator': 'FormItem',
'x-component': 'Filter',
'x-component-props': {
dynamicComponent: VariableInput,
useProps() {
'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,
},
},
actions: {
@ -162,10 +162,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 }}',
},
},
},
@ -183,12 +183,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: {
@ -250,9 +250,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',
@ -265,15 +263,17 @@ export const scopesSchema: ISchema = {
name: 'filter',
'x-decorator': 'FormItem',
'x-component': 'Filter',
'x-component-props': {
dynamicComponent: VariableInput,
useProps() {
'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,
},
},
actions: {
@ -290,10 +290,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 }}',
},
},
},
@ -311,13 +311,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 }}',
},
},
},
@ -341,10 +341,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 }}',
},
},
},

2
packages/plugins/@nocobase/plugin-action-bulk-edit/src/client/BulkEditSubmitActionInitializer.tsx
View File

@ -6,13 +6,13 @@ export const BulkEditSubmitActionInitializer = (props) => {
title: '{{ t("Submit") }}',
'x-action': 'submit',
'x-component': 'Action',
'x-use-component-props': 'useCustomizeBulkEditActionProps',
// 'x-designer': 'Action.Designer',
'x-toolbar': 'ActionSchemaToolbar',
'x-settings': 'actionSettings:updateSubmit',
'x-component-props': {
type: 'primary',
htmlType: 'submit',
useProps: '{{ useCustomizeBulkEditActionProps }}',
},
};
return <ActionInitializer {...props} schema={schema} />;

4
packages/plugins/@nocobase/plugin-action-bulk-edit/src/client/createBulkEditBlockUISchema.ts
View File

@ -36,9 +36,7 @@ export function createBulkEditBlockUISchema(options: {
[uid()]: {
type: 'void',
'x-component': 'FormV2',
'x-component-props': {
useProps: '{{ useCreateFormBlockProps }}',
},
'x-use-component-props': 'useCreateFormBlockProps',
properties: {
grid: {
type: 'void',

2
packages/plugins/@nocobase/plugin-action-bulk-update/src/client/BulkUpdateActionInitializer.tsx
View File

@ -7,6 +7,7 @@ export const BulkUpdateActionInitializer = () => {
type: 'void',
title: '{{ t("Bulk update") }}',
'x-component': 'Action',
'x-use-component-props': 'useCustomizeBulkUpdateActionProps',
'x-align': 'right',
'x-acl-action': 'update',
'x-decorator': 'ACLActionProvider',
@ -27,7 +28,6 @@ export const BulkUpdateActionInitializer = () => {
},
'x-component-props': {
icon: 'EditOutlined',
useProps: '{{ useCustomizeBulkUpdateActionProps }}',
},
};
return <BlockInitializer {...itemConfig} schema={schema} item={itemConfig} />;

2
packages/plugins/@nocobase/plugin-action-duplicate/src/client/DuplicateAction.Settings.tsx
View File

@ -84,7 +84,7 @@ function DuplicationMode() {
const fieldSchema = useFieldSchema();
const { name } = useCollection_deprecated();
const { collectionList, getEnableFieldTree, getOnLoadData, getOnCheck } = useCollectionState(name);
const duplicateValues = cloneDeep(fieldSchema['x-component-props'].duplicateFields || []);
const duplicateValues = cloneDeep(fieldSchema['x-component-props']?.duplicateFields || []);
const record = useRecord();
const syncCallBack = useCallback((treeData, selectFields, form) => {
form.query('duplicateFields').take((f) => {

2
packages/plugins/@nocobase/plugin-action-print/src/client/PrintActionInitializer.tsx
View File

@ -7,9 +7,9 @@ export const PrintActionInitializer = (props) => {
title: '{{ t("Print") }}',
'x-action': 'print',
'x-component': 'Action',
'x-use-component-props': 'useDetailPrintActionProps',
'x-component-props': {
icon: 'PrinterOutlined',
useProps: '{{ useDetailPrintActionProps }}',
},
};
return <ActionInitializer {...props} schema={schema} />;

2
packages/plugins/@nocobase/plugin-api-keys/src/client/Configuration/schema.tsx
View File

@ -166,9 +166,9 @@ export const configurationSchema: ISchema = {
[uid()]: {
type: 'array',
'x-component': 'TableV2',
'x-use-component-props': 'useTableBlockProps',
'x-component-props': {
rowKey: 'id',
useProps: '{{ useTableBlockProps }}',
},
properties: {
column1: {

6
packages/plugins/@nocobase/plugin-audit-logs/src/client/components/AuditLogsViewActionInitializer.tsx
View File

@ -66,10 +66,8 @@ export const AuditLogsViewActionInitializer = () => {
bv710pbf9w6: {
type: 'void',
'x-component': 'FormV2',
'x-use-component-props': 'useFormBlockProps',
'x-read-pretty': true,
'x-component-props': {
useProps: '{{ useFormBlockProps }}',
},
properties: {
grid: {
type: 'void',
@ -259,9 +257,9 @@ export const AuditLogsViewActionInitializer = () => {
changes: {
type: 'array',
'x-component': 'TableV2',
'x-use-component-props': 'useTableFieldProps',
'x-component-props': {
rowSelection: false,
useProps: '{{ useTableFieldProps }}',
},
properties: {
'5uvv96u9ict': {

2
packages/plugins/@nocobase/plugin-audit-logs/src/client/createAuditLogsBlockSchema.tsx
View File

@ -37,12 +37,12 @@ export function createAuditLogsBlockSchema(): ISchema {
type: 'array',
'x-initializer': 'auditLogsTable:configureColumns',
'x-component': 'TableV2',
'x-use-component-props': 'useTableBlockProps',
'x-component-props': {
rowKey: 'id',
rowSelection: {
type: 'checkbox',
},
useProps: '{{ useTableBlockProps }}',
},
properties: {
actions: {

8
packages/plugins/@nocobase/plugin-audit-logs/src/client/deplicated/AuditLogs.tsx
View File

@ -145,9 +145,9 @@ export const AuditLogs: any = () => {
'x-action': 'filter',
// 'x-designer': 'Filter.Action.Designer',
'x-component': 'Filter.Action',
'x-use-component-props': 'useFilterActionProps',
'x-component-props': {
icon: 'FilterOutlined',
useProps: '{{ useFilterActionProps }}',
},
'x-align': 'left',
},
@ -156,12 +156,12 @@ export const AuditLogs: any = () => {
y84dlntcaup: {
type: 'array',
'x-component': 'TableV2',
'x-use-component-props': 'useTableBlockProps',
'x-component-props': {
rowKey: 'id',
rowSelection: {
type: 'checkbox',
},
useProps: '{{ useTableBlockProps }}',
},
properties: {
actions: {
@ -232,10 +232,8 @@ export const AuditLogs: any = () => {
mevpuonrda0: {
type: 'void',
'x-component': 'FormV2',
'x-use-component-props': 'useFormBlockProps',
'x-read-pretty': true,
'x-component-props': {
useProps: '{{ useFormBlockProps }}',
},
properties: {
grid: {
type: 'void',

4
packages/plugins/@nocobase/plugin-calendar/src/client/calendar/demos/demo2.tsx
View File

@ -39,9 +39,7 @@ const schema: ISchema = {
type: 'array',
name: 'calendar1',
'x-component': 'CalendarV2',
'x-component-props': {
useProps: '{{ useCalendarBlockProps }}',
},
'x-use-component-props': 'useCalendarBlockProps',
properties: {
toolBar: {
type: 'void',

4
packages/plugins/@nocobase/plugin-calendar/src/client/schema-initializer/initializers/CalendarFormActionInitializers.tsx
View File

@ -132,6 +132,7 @@ export const CalendarFormActionInitializers = new SchemaInitializer({
schema: {
title: generateNTemplate('Update record'),
'x-component': 'Action',
'x-use-component-props': 'useCustomizeUpdateActionProps',
// 'x-designer': 'Action.Designer',
'x-toolbar': 'ActionSchemaToolbar',
'x-settings': 'actionSettings:updateRecord',
@ -146,9 +147,6 @@ export const CalendarFormActionInitializers = new SchemaInitializer({
},
triggerWorkflows: [],
},
'x-component-props': {
useProps: '{{ useCustomizeUpdateActionProps }}',
},
},
useVisible() {
const collection = useCollection_deprecated();

2
packages/plugins/@nocobase/plugin-charts/src/client/ChartBlockEngineDesigner.tsx
View File

@ -231,7 +231,7 @@ export const ChartBlockEngineDesignerInitializer = (props) => {
field.title = values.chart.title;
fieldSchema['title'] = values.chart.title;
field.componentProps.chartBlockEngineMetaData = values;
fieldSchema['x-component-props'].chartBlockEngineMetaData = values;
_.set(fieldSchema, 'x-component-props.chartBlockEngineMetaData', values);
dn.emit('patch', {
schema: {
'x-uid': fieldSchema['x-uid'],

3
packages/plugins/@nocobase/plugin-collection-manager/src/server/migrations/20230623145414-number-step.ts
View File

@ -1,6 +1,7 @@
import { Collection } from '@nocobase/database';
import { Migration } from '@nocobase/server';
import { FieldModel } from '../models';
import _ from 'lodash';
export default class extends Migration {
appVersion = '<0.10.0-alpha.3';
@ -24,7 +25,7 @@ export default class extends Migration {
if (uiSchema?.['x-component-props']?.step !== '0') {
continue;
}
uiSchema['x-component-props']['step'] = '1';
_.set(uiSchema, 'x-component-props.step', '1');
fieldRecord.set('uiSchema', uiSchema);
await fieldRecord.save({
transaction,

20
packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/CollectionsManager/components/TitleField.tsx
View File

@ -1,15 +1,23 @@
import React from 'react';
import { Switch, Tooltip, message } from 'antd';
import { useTranslation } from 'react-i18next';
import { useCollectionManager_deprecated, useRecord, useAPIClient } from '@nocobase/client';
import {
useCollectionManager_deprecated,
useRecord,
useAPIClient,
withDynamicSchemaProps,
useProps,
} from '@nocobase/client';
import { useRemoteCollectionContext } from '../CollectionFields';
export const TitleField = (props) => {
const { useProps } = props;
export const TitleField = withDynamicSchemaProps(
(props) => {
const { t } = useTranslation();
const { isTitleField } = useCollectionManager_deprecated();
const [loadingRecord, setLoadingRecord] = React.useState(null);
const { setTitleField, filterByTk, dataSourceKey } = useProps();
// 新版 UISchema（1.0 之后）中已经废弃了 useProps，这里之所以继续保留是为了兼容旧版的 UISchema
const { setTitleField, filterByTk, dataSourceKey } = useProps(props);
const record = useRecord();
const api = useAPIClient();
const { refreshRM, titleField } = useRemoteCollectionContext();
@ -36,4 +44,6 @@ export const TitleField = (props) => {
/>
</Tooltip>
) : null;
};
},
{ displayName: 'TitleField' },
);

4
packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/CollectionsManager/schema/collectionFields.ts
View File

@ -194,10 +194,8 @@ export const fieldsTableSchema: ISchema = {
properties: {
titleField: {
'x-component': 'TitleField',
'x-use-component-props': 'useTitleFieldProps',
'x-read-pretty': false,
'x-component-props': {
useProps: '{{useTitleFieldProps}}',
},
},
},
},

4
packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/CollectionsManager/schema/collections.ts
View File

@ -136,9 +136,9 @@ export const collectionTableSchema: ISchema = {
},
'x-action': 'filter',
'x-component': 'Filter.Action',
'x-use-component-props': 'cm.useFilterActionProps',
'x-component-props': {
icon: 'FilterOutlined',
useProps: '{{ cm.useFilterActionProps }}',
},
'x-align': 'left',
},
@ -146,9 +146,9 @@ export const collectionTableSchema: ISchema = {
type: 'void',
title: '{{ t("Refresh") }}',
'x-component': 'Action',
'x-use-component-props': 'useRefreshActionProps',
'x-component-props': {
icon: 'ReloadOutlined',
useProps: '{{ useRefreshActionProps }}',
},
},
delete: {

2
packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/MainDataSourceManager/Configuration/schemas/collections.ts
View File

@ -137,9 +137,9 @@ export const collectionTableSchema: ISchema = {
},
'x-action': 'filter',
'x-component': 'Filter.Action',
'x-use-component-props': 'cm.useFilterActionProps',
'x-component-props': {
icon: 'FilterOutlined',
useProps: '{{ cm.useFilterActionProps }}',
},
'x-align': 'left',
},

2
packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/PermissionManager/schemas/roleCollections.ts
View File

@ -112,9 +112,9 @@ export const roleCollectionsSchema: ISchema = {
},
'x-action': 'filter',
'x-component': 'Filter.Action',
'x-use-component-props': 'cm.useFilterActionProps',
'x-component-props': {
icon: 'FilterOutlined',
useProps: '{{ cm.useFilterActionProps }}',
},
'x-align': 'left',
},

34
packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/PermissionManager/schemas/scopes.ts
View File

@ -125,9 +125,7 @@ export const getScopesSchema = (dataSourceKey) => {
form: {
type: 'void',
'x-component': 'FormV2',
'x-component-props': {
useProps: useFormBlockProps,
},
'x-use-component-props': useFormBlockProps,
properties: {
name: {
type: 'string',
@ -140,15 +138,17 @@ export const getScopesSchema = (dataSourceKey) => {
name: 'filter',
'x-decorator': 'FormItem',
'x-component': 'Filter',
'x-component-props': {
dynamicComponent: VariableInput,
useProps() {
'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 = useFilterFieldOptions(ctx.fields);
return {
options,
};
},
'x-component-props': {
dynamicComponent: VariableInput,
},
},
actions: {
@ -165,10 +165,10 @@ export const getScopesSchema = (dataSourceKey) => {
title: '{{ t("Submit") }}',
'x-action': 'submit',
'x-component': 'Action',
'x-use-component-props': 'useCreateActionProps',
'x-component-props': {
type: 'primary',
htmlType: 'submit',
useProps: '{{ useCreateActionProps }}',
},
},
},
@ -186,12 +186,12 @@ export const getScopesSchema = (dataSourceKey) => {
value: {
type: 'array',
'x-component': 'TableV2.Selector',
'x-use-component-props': 'useTableSelectorProps',
'x-component-props': {
rowKey: 'id',
rowSelection: {
type: 'checkbox',
},
useProps: '{{ useTableSelectorProps }}',
},
properties: {
column1: {
@ -253,9 +253,7 @@ export const getScopesSchema = (dataSourceKey) => {
form: {
type: 'void',
'x-component': 'FormV2',
'x-component-props': {
useProps: '{{ useFormBlockProps }}',
},
'x-use-component-props': 'useFormBlockProps',
properties: {
name: {
type: 'string',
@ -268,15 +266,17 @@ export const getScopesSchema = (dataSourceKey) => {
name: 'filter',
'x-decorator': 'FormItem',
'x-component': 'Filter',
'x-component-props': {
dynamicComponent: VariableInput,
useProps() {
'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 = useFilterFieldOptions(ctx.fields);
return {
options,
};
},
'x-component-props': {
dynamicComponent: VariableInput,
},
},
actions: {
@ -293,10 +293,10 @@ export const getScopesSchema = (dataSourceKey) => {
title: '{{ t("Submit") }}',
'x-action': 'submit',
'x-component': 'Action',
'x-use-component-props': 'useUpdateActionProps',
'x-component-props': {
type: 'primary',
htmlType: 'submit',
useProps: '{{ useUpdateActionProps }}',
},
},
},
@ -314,13 +314,13 @@ export const getScopesSchema = (dataSourceKey) => {
'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 }}',
},
},
},
@ -344,10 +344,10 @@ export const getScopesSchema = (dataSourceKey) => {
title: '{{ t("Submit") }}',
'x-action': 'submit',
'x-component': 'Action',
'x-use-component-props': 'usePickActionProps',
'x-component-props': {
type: 'primary',
htmlType: 'submit',
useProps: '{{ usePickActionProps }}',
},
},
},

2
packages/plugins/@nocobase/plugin-data-source-manager/src/client/schema/index.ts
View File

@ -102,9 +102,9 @@ export const databaseConnectionSchema: ISchema = {
type: 'void',
title: '{{ t("Refresh") }}',
'x-component': 'Action',
'x-use-component-props': 'useRefreshActionProps',
'x-component-props': {
icon: 'ReloadOutlined',
useProps: '{{ useRefreshActionProps }}',
},
},
delete: {

8
packages/plugins/@nocobase/plugin-data-visualization/src/client/filter/FilterActionInitializers.tsx
View File

@ -88,11 +88,11 @@ const ChartFilterActionInitializer = (props) => {
title: '{{ t("Filter") }}',
'x-action': 'submit',
'x-component': 'Action',
'x-use-component-props': 'useChartFilterActionProps',
'x-designer': 'ChartFilterActionDesigner',
'x-component-props': {
htmlType: 'submit',
type: 'primary',
useProps: '{{ useChartFilterActionProps }}',
},
};
return <ActionInitializer {...props} schema={schema} />;
@ -103,10 +103,8 @@ const ChartFilterResetInitializer = (props) => {
title: '{{ t("Reset") }}',
'x-action': 'reset',
'x-component': 'Action',
'x-use-component-props': 'useChartFilterResetProps',
'x-designer': 'ChartFilterActionDesigner',
'x-component-props': {
useProps: '{{ useChartFilterResetProps }}',
},
};
return <ActionInitializer {...props} schema={schema} />;
};
@ -116,9 +114,9 @@ const ChartFilterCollapseInitializer = (props) => {
title: `{{ t("Collapse") }}`,
'x-action': 'collapse',
'x-component': 'Action',
'x-use-component-props': 'useChartFilterCollapseProps',
'x-component-props': {
type: 'link',
useProps: '{{ useChartFilterCollapseProps }}',
},
'x-designer': 'ChartFilterCollapseDesigner',
};

3
packages/plugins/@nocobase/plugin-data-visualization/src/client/hooks/filter.ts
View File

@ -20,6 +20,7 @@ import lodash from 'lodash';
import { getFormulaComponent, getValuesByPath } from '../utils';
import deepmerge from 'deepmerge';
import { findSchema, getFilterFieldPrefix, parseFilterFieldName } from '../filter/utils';
import _ from 'lodash';
export const useCustomFieldInterface = () => {
const { getInterface } = useCollectionManager_deprecated();
@ -135,7 +136,7 @@ export const useChartFilter = () => {
};
}
if (['oho', 'o2m'].includes(field.interface)) {
schema['x-component-props'].useOriginalFilter = true;
_.set(schema, 'x-component-props.useOriginalFilter', true);
}
const resultItem: SchemaInitializerItemType = {
key: `${name}.${field.name}`,

2
packages/plugins/@nocobase/plugin-export/src/client/ExportActionInitializer.tsx
View File

@ -61,9 +61,9 @@ export const ExportActionInitializer = () => {
'x-settings': 'actionSettings:export',
'x-decorator': 'ACLActionProvider',
'x-component': 'Action',
'x-use-component-props': 'useExportAction',
'x-component-props': {
icon: 'clouddownloadoutlined',
useProps: '{{ useExportAction }}',
},
};
return (

2
packages/plugins/@nocobase/plugin-file-manager/src/client/initializers/UploadActionInitializer.tsx
View File

@ -26,10 +26,10 @@ export const UploadActionInitializer = (props) => {
type: 'void',
title: '{{ t("Upload files") }}',
'x-component': 'Upload.DraggerV2',
'x-use-component-props': 'useUploadFiles',
'x-component-props': {
height: '50vh',
// action: `${collection.name}:create`,
useProps: '{{useUploadFiles}}',
multiple: true,
listType: 'picture',
},

1
packages/plugins/@nocobase/plugin-file-manager/src/server/migrations/20230831160742-fix-attachment-field.ts
View File

@ -31,6 +31,7 @@ export default class extends Migration {
if (!field) {
continue;
}
schema['x-component-props'] = schema['x-component-props'] || {};
schema['x-component-props'].action = schema['x-component-props'].action.replace(
'attachementField',
'attachmentField',

2
packages/plugins/@nocobase/plugin-gantt/src/client/demos/demo1.tsx
View File

@ -7,8 +7,8 @@ const schema = {
tasks: {
type: 'void',
'x-component': 'Gantt',
'x-use-component-props': 'useGanttBlockProps',
'x-component-props': {
useProps: '{{ useGanttBlockProps }}',
tasks: [
{
start: new Date(2020, 0, 1),

4
packages/plugins/@nocobase/plugin-snapshot-field/src/client/SnapshotBlock/SnapshotBlockInitializers/SnapshotBlockInitializersDetailItem.tsx
View File

@ -44,9 +44,7 @@ export const createSnapshotBlockSchema = (options) => {
type: 'void',
'x-component': 'FormV2',
'x-read-pretty': true,
'x-component-props': {
useProps: '{{ useFormBlockProps }}',
},
'x-use-component-props': 'useFormBlockProps',
properties: {
grid: template || {
type: 'void',

4
packages/plugins/@nocobase/plugin-ui-schema-storage/src/server/migrations/20230510235247-form-field.ts
View File

@ -2,6 +2,7 @@ import { Schema } from '@formily/json-schema';
import { Migration } from '@nocobase/server';
import { uid } from '@nocobase/utils';
import UiSchemaRepository from '../repository';
import _ from 'lodash';
export default class extends Migration {
appVersion = '<0.9.3-alpha.1';
@ -23,7 +24,8 @@ export default class extends Migration {
const schema = item.schema;
schema['type'] = 'object';
schema['x-component'] = 'CollectionField';
schema['x-component-props']['mode'] = 'Nester';
_.set(schema, 'x-component-props.mode', 'Nester');
item.set('schema', schema);
await item.save({ transaction });
const s = await r.getProperties(item['x-uid'], { transaction });

6
packages/plugins/@nocobase/plugin-users/src/client/schemas/users.ts
View File

@ -152,9 +152,9 @@ export const usersSchema: ISchema = {
title: '{{ t("Filter") }}',
'x-action': 'filter',
'x-component': 'Filter.Action',
'x-use-component-props': 'useFilterActionProps',
'x-component-props': {
icon: 'FilterOutlined',
useProps: '{{ useFilterActionProps }}',
},
'x-align': 'left',
},
@ -493,9 +493,9 @@ export const getRoleUsersSchema = (): ISchema => ({
title: '{{ t("Filter") }}',
'x-action': 'filter',
'x-component': 'Filter.Action',
'x-use-component-props': 'useFilterActionProps',
'x-component-props': {
icon: 'FilterOutlined',
useProps: '{{ useFilterActionProps }}',
},
'x-align': 'left',
},
@ -556,9 +556,9 @@ export const getRoleUsersSchema = (): ISchema => ({
},
'x-action': 'filter',
'x-component': 'Filter.Action',
'x-use-component-props': 'useFilterActionProps',
'x-component-props': {
icon: 'FilterOutlined',
useProps: '{{ useFilterActionProps }}',
},
'x-align': 'left',
},

4
packages/plugins/@nocobase/plugin-workflow-action-trigger/src/client/index.ts
View File

@ -13,9 +13,7 @@ const submitToWorkflowActionInitializer: SchemaInitializerItemType = {
schema: {
title: '{{t("Submit to workflow", { ns: "workflow" })}}',
'x-component': 'Action',
'x-component-props': {
useProps: '{{ useTriggerWorkflowsActionProps }}',
},
'x-use-component-props': 'useTriggerWorkflowsActionProps',
'x-designer': 'Action.Designer',
'x-action-settings': {
// assignedValues: {},

6
packages/plugins/@nocobase/plugin-workflow-aggregate/src/client/AggregateInstruction.tsx
View File

@ -341,10 +341,11 @@ export default class extends Instruction {
title: '{{t("Filter")}}',
'x-decorator': 'FormItem',
'x-component': 'Filter',
'x-component-props': {
useProps() {
'x-use-component-props': () => {
// eslint-disable-next-line react-hooks/rules-of-hooks
const { values } = useForm();
const [dataSourceName, collectionName] = parseCollectionName(values?.collection);
// eslint-disable-next-line react-hooks/rules-of-hooks
const options = useCollectionFilterOptions(collectionName, dataSourceName);
return {
options,
@ -354,6 +355,7 @@ export default class extends Instruction {
`,
};
},
'x-component-props': {
dynamicComponent: 'FilterDynamicComponent',
},
'x-reactions': [

6
packages/plugins/@nocobase/plugin-workflow-manual/src/client/WorkflowTodo.tsx
View File

@ -245,9 +245,9 @@ export const WorkflowTodo: React.FC & { Drawer: React.FC; Decorator: React.FC }
'x-action': 'filter',
'x-designer': 'Filter.Action.Designer',
'x-component': 'Filter.Action',
'x-use-component-props': 'useFilterActionProps',
'x-component-props': {
icon: 'FilterOutlined',
useProps: '{{ useFilterActionProps }}',
},
'x-align': 'left',
},
@ -259,9 +259,9 @@ export const WorkflowTodo: React.FC & { Drawer: React.FC; Decorator: React.FC }
// 'x-designer': 'Action.Designer',
'x-toolbar': 'ActionSchemaToolbar',
'x-settings': 'actionSettings:refresh',
'x-use-component-props': 'useRefreshActionProps',
'x-component-props': {
icon: 'ReloadOutlined',
useProps: '{{ useRefreshActionProps }}',
},
'x-align': 'right',
},
@ -270,9 +270,9 @@ export const WorkflowTodo: React.FC & { Drawer: React.FC; Decorator: React.FC }
table: {
type: 'array',
'x-component': 'TableV2',
'x-use-component-props': 'useTableBlockProps',
'x-component-props': {
rowKey: 'id',
useProps: '{{ useTableBlockProps }}',
},
properties: {
actions: {

5
packages/plugins/@nocobase/plugin-workflow-manual/src/client/instruction/forms/custom.tsx
View File

@ -95,10 +95,7 @@ function CustomFormBlockInitializer() {
[uid()]: {
type: 'void',
'x-component': 'FormV2',
'x-component-props': {
// disabled / read-pretty / initialValues
useProps: '{{ useFormBlockProps }}',
},
'x-use-component-props': 'useFormBlockProps',
properties: {
grid: {
type: 'void',

5
packages/plugins/@nocobase/plugin-workflow-manual/src/client/instruction/forms/update.tsx
View File

@ -39,13 +39,14 @@ function UpdateFormDesigner() {
title: `{{t("Filter")}}`,
// 'x-decorator': 'FormItem',
'x-component': 'Filter',
'x-component-props': {
useProps() {
'x-use-component-props': () => {
// eslint-disable-next-line react-hooks/rules-of-hooks
const options = useCollectionFilterOptions(fieldSchema?.['x-decorator-props']?.collection);
return {
options,
};
},
'x-component-props': {
dynamicComponent: 'FilterDynamicComponent',
},
}}

4
packages/plugins/@nocobase/plugin-workflow/src/client/components/CollectionBlockInitializer.tsx
View File

@ -48,9 +48,7 @@ function InnerCollectionBlockInitializer({ collection, dataPath, ...props }) {
grid: {
type: 'void',
'x-component': 'FormV2',
'x-component-props': {
useProps: '{{useDetailsBlockProps}}',
},
'x-use-component-props': 'useDetailsBlockProps',
'x-read-pretty': true,
properties: {
grid: template || {

5
packages/plugins/@nocobase/plugin-workflow/src/client/nodes/index.tsx
View File

@ -407,10 +407,7 @@ export function NodeDefaultView(props) {
</div>
),
'x-decorator': 'FormV2',
'x-decorator-props': {
// form,
useProps: '{{ useFormProviderProps }}',
},
'x-use-decorator-props': 'useFormProviderProps',
'x-component': 'Action.Drawer',
properties: {
...(instruction.description

6
packages/plugins/@nocobase/plugin-workflow/src/client/schemas/collection.ts
View File

@ -30,10 +30,11 @@ export const filter = {
title: '{{t("Filter")}}',
'x-decorator': 'FormItem',
'x-component': 'Filter',
'x-component-props': {
useProps() {
'x-use-component-props': () => {
// eslint-disable-next-line react-hooks/rules-of-hooks
const { values } = useForm();
const [dataSourceName, collectionName] = parseCollectionName(values?.collection);
// eslint-disable-next-line react-hooks/rules-of-hooks
const options = useCollectionFilterOptions(collectionName, dataSourceName);
return {
options,
@ -43,6 +44,7 @@ export const filter = {
`,
};
},
'x-component-props': {
dynamicComponent: 'FilterDynamicComponent',
},
};

2
packages/plugins/@nocobase/plugin-workflow/src/client/schemas/workflows.ts
View File

@ -178,9 +178,9 @@ export const workflowSchema: ISchema = {
},
'x-action': 'filter',
'x-component': 'Filter.Action',
'x-use-component-props': 'cm.useFilterActionProps',
'x-component-props': {
icon: 'FilterOutlined',
useProps: '{{ cm.useFilterActionProps }}',
},
'x-align': 'left',
},

4
packages/plugins/@nocobase/plugin-workflow/src/client/triggers/collection.tsx
View File

@ -123,9 +123,7 @@ export default class extends Trigger {
condition: {
...filter,
title: `{{t("Only triggers when match conditions", { ns: "${NAMESPACE}" })}}`,
'x-component-props': {
useProps: filter['x-component-props'].useProps,
},
'x-component-props': {},
'x-reactions': [
{
dependencies: ['collection'],

5
packages/plugins/@nocobase/plugin-workflow/src/client/triggers/index.tsx
View File

@ -266,10 +266,7 @@ export const TriggerConfig = () => {
title: titleText,
'x-component': 'Action.Drawer',
'x-decorator': 'FormV2',
'x-decorator-props': {
// form,
useProps: '{{ useFormProviderProps }}',
},
'x-use-decorator-props': 'useFormProviderProps',
properties: {
...(trigger.description
? {

4
packages/plugins/@nocobase/plugin-workflow/src/server/migrations/20230411034722-manual-multi-form.ts
View File

@ -108,9 +108,7 @@ function migrateConfig({ schema = {}, actions = [] }: { schema: any; actions: nu
[formId]: {
type: 'void',
'x-component': 'FormV2',
'x-component-props': {
useProps: '{{ useFormBlockProps }}',
},
'x-use-component-props': 'useFormBlockProps',
properties: {
grid: Object.assign(formBlock.properties.grid, {
'x-initializer': 'workflowManual:customForm:configureFields',

4
packages/plugins/@nocobase/plugin-workflow/src/server/migrations/20230612021134-manual-collection-block.ts
View File

@ -56,9 +56,7 @@ function migrateSchema(schema = {}): object {
type: 'void',
name: id,
'x-component': 'FormV2',
'x-component-props': {
useProps: '{{useDetailsBlockProps}}',
},
'x-use-component-props': 'useDetailsBlockProps',
properties: {
grid: {
type: 'void',