Merge pull request #16754 from strapi/feature/review-workflow-multiple-cts

Settings: Use nested multiple select for content-types
This commit is contained in:
Gustav Hansen 2023-05-19 10:59:44 +02:00 committed by GitHub
commit 1e92200fbd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 41 additions and 20 deletions

View File

@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
import { useField } from 'formik';
import { useIntl } from 'react-intl';
import { useDispatch } from 'react-redux';
import { Grid, GridItem, MultiSelect, MultiSelectOption, TextInput } from '@strapi/design-system';
import { Grid, GridItem, MultiSelectNested, TextInput } from '@strapi/design-system';
import { updateWorkflow } from '../../actions';
@ -33,36 +33,57 @@ export function WorkflowAttributes({ contentTypes: { collectionTypes, singleType
</GridItem>
<GridItem col={6}>
<MultiSelect
<MultiSelectNested
{...contentTypesField}
customizeContent={() =>
customizeContent={(value) =>
formatMessage(
{
id: 'Settings.review-workflows.workflow.mappedContentTypes.displayValue',
id: 'Settings.review-workflows.workflow.contentTypes.displayValue',
defaultMessage:
'{count} {count, plural, one {content type} other {content types}} selected',
},
{ count: contentTypesField.value.length }
{ count: value.length }
)
}
error={contentTypesMeta.error ?? false}
id={contentTypesField.name}
label={formatMessage({
id: 'Settings.review-workflows.workflow.mappedContentTypes.label',
id: 'Settings.review-workflows.workflow.contentTypes.label',
defaultMessage: 'Associated to',
})}
onChange={(values) => {
dispatch(updateWorkflow({ mappedContentTypes: values }));
dispatch(updateWorkflow({ contentTypes: values }));
contentTypesField.onChange({ target: { value: values } });
}}
options={[
{
label: formatMessage({
id: 'Settings.review-workflows.workflow.contentTypes.collectionTypes.label',
defaultMessage: 'Collection Types',
}),
children: collectionTypes.map((contentType) => ({
label: contentType.info.displayName,
value: contentType.uid,
})),
},
{
label: formatMessage({
id: 'Settings.review-workflows.workflow.contentTypes.singleTypes.label',
defaultMessage: 'Single Types',
}),
children: singleTypes.map((contentType) => ({
label: contentType.info.displayName,
value: contentType.uid,
})),
},
]}
placeholder={formatMessage({
id: 'Settings.review-workflows.workflow.contentTypes.placeholder',
defaultMessage: 'Select',
})}
required
>
{[...collectionTypes, ...singleTypes].map((contentType) => (
<MultiSelectOption key={contentType.uid} value={contentType.uid}>
{contentType.info.displayName}
</MultiSelectOption>
))}
</MultiSelect>
/>
</GridItem>
</Grid>
);

View File

@ -52,11 +52,11 @@ export function ReviewWorkflowsEditView() {
const [isConfirmDeleteDialogOpen, setIsConfirmDeleteDialogOpen] = React.useState(false);
const { mutateAsync, isLoading } = useMutation(
async ({ workflowId, stages }) => {
async ({ workflow }) => {
const {
data: { data },
} = await put(`/admin/review-workflows/workflows/${workflowId}`, {
data: stages,
} = await put(`/admin/review-workflows/workflows/${workflow.id}`, {
data: workflow,
});
return data;
@ -71,9 +71,9 @@ export function ReviewWorkflowsEditView() {
}
);
const updateWorkflowStages = async (workflowId, stages) => {
const updateWorkflow = async (workflow) => {
try {
const res = await mutateAsync({ workflowId, stages });
const res = await mutateAsync({ workflow });
return res;
} catch (error) {
@ -87,7 +87,7 @@ export function ReviewWorkflowsEditView() {
};
const submitForm = async () => {
await updateWorkflowStages(currentWorkflow.id, currentWorkflow.stages);
await updateWorkflow(currentWorkflow);
await refetchWorkflow();
setIsConfirmDeleteDialogOpen(false);