tachybase_todo/packages/plugins/workflow/src/client/components/DynamicExpression.tsx

58 lines
2.1 KiB
TypeScript

import { onFieldInputValueChange, onFormInitialValuesChange } from '@formily/core';
import { connect, mapReadPretty, observer, useField, useForm, useFormEffects } from '@formily/react';
import { Tag } from 'antd';
import React, { useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next';
import { useCollectionManager, useCompile, useRecord, Variable } from '@nocobase/client';
import { NAMESPACE } from '../locale';
import { getCollectionFieldOptions } from '../variable';
const InternalExpression = observer(
(props: any) => {
const { onChange } = props;
const field = useField<any>();
// TODO(refactor): better to provide another context like useFieldset()
const form = useForm();
const basePath = field.path.segments.slice(0, -1);
const collectionPath = [...basePath, 'sourceCollection'].join('.');
const [collection, setCollection] = useState(form.getValuesIn(collectionPath));
const compile = useCompile();
const { getCollectionFields } = useCollectionManager();
useFormEffects(() => {
onFormInitialValuesChange((form) => {
setCollection(form.getValuesIn(collectionPath));
});
onFieldInputValueChange(collectionPath, (f) => {
setCollection(f.value);
onChange(null);
});
});
const options = getCollectionFieldOptions({ collection, compile, getCollectionFields });
return <Variable.TextArea {...props} scope={options} />;
},
{ displayName: 'InternalExpression' },
);
function Result(props) {
const { t } = useTranslation();
const values = useRecord();
const compile = useCompile();
const { getCollectionFields } = useCollectionManager();
const options = useMemo(
() => getCollectionFieldOptions({ collection: values.sourceCollection, compile, getCollectionFields }),
[values.sourceCollection, values.sourceCollection],
);
return props.value ? (
<Variable.TextArea {...props} scope={options} />
) : (
<Tag>{t('Unconfigured', { ns: NAMESPACE })}</Tag>
);
}
export const DynamicExpression = connect(InternalExpression, mapReadPretty(Result));