diff --git a/src/pages/dataElements/fields/CategoryComboField.tsx b/src/pages/dataElements/fields/CategoryComboField.tsx index 584a17bd..50e9f434 100644 --- a/src/pages/dataElements/fields/CategoryComboField.tsx +++ b/src/pages/dataElements/fields/CategoryComboField.tsx @@ -1,9 +1,10 @@ import i18n from '@dhis2/d2-i18n' import { Field } from '@dhis2/ui' -import React, { useRef } from 'react' -import { useField, useFormState } from 'react-final-form' +import React, { useEffect, useRef } from 'react' +import { useField, useForm, useFormState } from 'react-final-form' import { useHref } from 'react-router' import { CategoryComboSelect, EditableFieldWrapper } from '../../../components' +import { useDefaultCategoryComboQuery } from '../../../lib' import classes from './CategoryComboField.module.css' const required = (value: { id: string }) => { @@ -18,10 +19,15 @@ const required = (value: { id: string }) => { * implemented * * Field rule: Disable when domainType is TRACKER + * Field rule: Set categoryCombo.id to the default category combo when + * domainType is Tracker */ export function CategoryComboField() { + const defaultCategoryComboQuery = useDefaultCategoryComboQuery() + const { change } = useForm() const { values } = useFormState({ subscription: { values: true } }) - const disabled = values.domainType === 'TRACKER' + const domainTypeIsTracker = values.domainType === 'TRACKER' + const disabled = domainTypeIsTracker const validate = disabled ? undefined : required const newCategoryComboLink = useHref('/categoryCombos/new') const { input, meta } = useField('categoryCombo', { @@ -36,6 +42,12 @@ export function CategoryComboField() { }, }) + useEffect(() => { + if (defaultCategoryComboQuery.data?.id && domainTypeIsTracker) { + change('categoryCombo.id', defaultCategoryComboQuery.data.id) + } + }, [change, defaultCategoryComboQuery.data?.id, domainTypeIsTracker]) + return (