8692451949

Committed 15 Apr 2024 04:09PM UTC coverage: 97.24% (-0.2%) from 97.459%

Build # 8692451949

Build Type

Pull #369

github

Committed by

GermanSaracca

Commit Message

refactor: add specific use case for only display on create

Pull Request Pull Request #369: Dynamically render form field in Create Dataset Form + Fields Validations

Run Details

674 of 708 branches covered (95.2%)

Branch coverage included in aggregate %.

190 of 193 new or added lines in 21 files covered. (98.45%)

1 existing line in 1 file now uncovered.

1827 of 1864 relevant lines covered (98.02%)

3675.97 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

95.24

/src/sections/create-dataset/MetadataBlockFormFields/MetadataFormField/index.tsx

import { useMemo } from 'react'
import { Controller, useFormContext } from 'react-hook-form'
import { Col, Form, Row } from '@iqss/dataverse-design-system'
import { useDefineRules } from './useDefineRules'
import {
  MetadataField,
  TypeClassMetadataFieldOptions,
  TypeMetadataFieldOptions
} from '../../../../metadata-block-info/domain/models/MetadataBlockInfo'
import { Vocabulary } from './Fields/Vocabulary'
import { VocabularyMultiple } from './Fields/VocabularyMultiple'
import styles from './index.module.scss'

interface Props {
  metadataFieldInfo: MetadataField
  metadataBlockName: string
  withinMultipleFieldsGroup?: boolean
  compoundParentName?: string
}

export const MetadataFormField = ({
  metadataFieldInfo,
  metadataBlockName,
  withinMultipleFieldsGroup = false,
  compoundParentName
}: Props) => {
  const {
    name,
    type,
    title,
    displayName,
    multiple,
    typeClass,
    isRequired,
    description,
    watermark,
    childMetadataFields,
    controlledVocabularyValues
  } = metadataFieldInfo

  const { control } = useFormContext()

  const rulesToApply = useDefineRules({ metadataFieldInfo })

  const builtFieldName = useMemo(
    () =>
      compoundParentName
        ? `${metadataBlockName}.${compoundParentName}.${name}`
        : `${metadataBlockName}.${name}`,
    [metadataBlockName, compoundParentName, name]
  )

  const isSafeCompound =
    typeClass === TypeClassMetadataFieldOptions.Compound &&
    childMetadataFields !== undefined &&
    Object.keys(childMetadataFields).length > 0

  const isSafeControlledVocabulary =
    typeClass === TypeClassMetadataFieldOptions.ControlledVocabulary &&
    controlledVocabularyValues !== undefined &&
    controlledVocabularyValues.length > 0

  const isSafePrimitive = typeClass === TypeClassMetadataFieldOptions.Primitive

  if (isSafeCompound) {
    return (
      <Form.GroupWithMultipleFields
        title={title}
        message={description}
        required={isRequired}
        withDynamicFields={false}>
        <div className={styles['multiple-fields-grid']}>
          {Object.entries(childMetadataFields).map(
            ([childMetadataFieldKey, childMetadataFieldInfo]) => {
              return (
                <MetadataFormField
                  metadataFieldInfo={childMetadataFieldInfo}
                  metadataBlockName={metadataBlockName}
                  compoundParentName={name}
                  withinMultipleFieldsGroup
                  key={childMetadataFieldKey}
                />
              )
            }
          )}
        </div>
      </Form.GroupWithMultipleFields>
    )
  }

  if (isSafeControlledVocabulary) {
    if (multiple) {
      return (
        <VocabularyMultiple
          title={title}
          name={builtFieldName}
          displayName={displayName}
          description={description}
          options={controlledVocabularyValues}
          isRequired={isRequired}
          control={control}
        />
      )
    }
    return (
      <Controller
        name={builtFieldName}
        control={control}
        rules={rulesToApply}
        render={({ field: { onChange, ref }, fieldState: { invalid, error } }) => (
          <Form.Group
            controlId={name}
            required={isRequired}
            as={withinMultipleFieldsGroup ? Col : Row}>
            <Form.Group.Label message={description}>{title}</Form.Group.Label>
            <Vocabulary
              onChange={onChange}
              isInvalid={invalid}
              options={controlledVocabularyValues}
              ref={ref}
            />
            <Form.Group.Feedback type="invalid">{error?.message}</Form.Group.Feedback>
          </Form.Group>
        )}
      />
    )
  }

  if (isSafePrimitive) {
    return (
      <Controller
        name={builtFieldName}
        control={control}
        rules={rulesToApply}
        render={({ field: { onChange, ref }, fieldState: { invalid, error } }) => (
          <Form.Group
            controlId={name}
            required={isRequired}
            as={withinMultipleFieldsGroup ? Col : undefined}>
            <Form.Group.Label message={description}>{title}</Form.Group.Label>

            <>
              {type === TypeMetadataFieldOptions.Textbox ? (
                <Form.Group.TextArea
                  onChange={onChange}
                  isInvalid={invalid}
                  placeholder={watermark}
                  data-fieldtype={type}
                  ref={ref}
                />
              ) : (
                <Form.Group.Input
                  type="text"
                  onChange={onChange}
                  isInvalid={invalid}
                  placeholder={watermark}
                  data-fieldtype={type}
                  ref={ref}
                />
              )}
            </>

            <Form.Group.Feedback type="invalid">{error?.message}</Form.Group.Feedback>
          </Form.Group>
        )}
      />
    )
  }

  return null
}

1	import { useMemo } from 'react'
2	import { Controller, useFormContext } from 'react-hook-form'
3	import { Col, Form, Row } from '@iqss/dataverse-design-system'
4	import { useDefineRules } from './useDefineRules'
5	import {
6	MetadataField,
7	TypeClassMetadataFieldOptions,
8	TypeMetadataFieldOptions
9	} from '../../../../metadata-block-info/domain/models/MetadataBlockInfo'
10	import { Vocabulary } from './Fields/Vocabulary'
11	import { VocabularyMultiple } from './Fields/VocabularyMultiple'
12	import styles from './index.module.scss'
13
14	interface Props {
15	metadataFieldInfo: MetadataField
16	metadataBlockName: string
17	withinMultipleFieldsGroup?: boolean
18	compoundParentName?: string
19	}
20
21	export const MetadataFormField = ({	13✔
22	metadataFieldInfo,
23	metadataBlockName,
24	withinMultipleFieldsGroup = false,	9,520✔
25	compoundParentName
26	}: Props) => {	17,920✔
27	const {
28	name,
29	type,
30	title,
31	displayName,
32	multiple,
33	typeClass,
34	isRequired,
35	description,
36	watermark,
37	childMetadataFields,
38	controlledVocabularyValues
39	} = metadataFieldInfo	17,920✔
40
41	const { control } = useFormContext()	17,920✔
42
43	const rulesToApply = useDefineRules({ metadataFieldInfo })	17,920✔
44
45	const builtFieldName = useMemo(	17,920✔
46	() =>
47	compoundParentName	5,376✔
48	? `${metadataBlockName}.${compoundParentName}.${name}`
49	: `${metadataBlockName}.${name}`,
50	[metadataBlockName, compoundParentName, name]
51	)
52
53	const isSafeCompound =
54	typeClass === TypeClassMetadataFieldOptions.Compound &&	17,920✔
55	childMetadataFields !== undefined &&
56	Object.keys(childMetadataFields).length > 0
57
58	const isSafeControlledVocabulary =
59	typeClass === TypeClassMetadataFieldOptions.ControlledVocabulary &&	17,920✔
60	controlledVocabularyValues !== undefined &&
61	controlledVocabularyValues.length > 0
62
63	const isSafePrimitive = typeClass === TypeClassMetadataFieldOptions.Primitive	17,920✔
64
65	if (isSafeCompound) {	17,920✔
66	return (	2,800✔
67	<Form.GroupWithMultipleFields
68	title={title}
69	message={description}
70	required={isRequired}
71	withDynamicFields={false}>
72	<div className={styles['multiple-fields-grid']}>
73	{Object.entries(childMetadataFields).map(
74	([childMetadataFieldKey, childMetadataFieldInfo]) => {
75	return (	8,400✔
76	<MetadataFormField
77	metadataFieldInfo={childMetadataFieldInfo}
78	metadataBlockName={metadataBlockName}
79	compoundParentName={name}
80	withinMultipleFieldsGroup
81	key={childMetadataFieldKey}
82	/>
83	)
84	}
85	)}
86	</div>
87	</Form.GroupWithMultipleFields>
88	)
89	}
90
91	if (isSafeControlledVocabulary) {	15,120✔
92	if (multiple) {	1,120✔
93	return (	840✔
94	<VocabularyMultiple
95	title={title}
96	name={builtFieldName}
97	displayName={displayName}
98	description={description}
99	options={controlledVocabularyValues}
100	isRequired={isRequired}
101	control={control}
102	/>
103	)
104	}
105	return (	280✔
106	<Controller
107	name={builtFieldName}
108	control={control}
109	rules={rulesToApply}
110	render={({ field: { onChange, ref }, fieldState: { invalid, error } }) => (
111	<Form.Group	280✔
112	controlId={name}
113	required={isRequired}
114	as={withinMultipleFieldsGroup ? Col : Row}>	280!
115	<Form.Group.Label message={description}>{title}</Form.Group.Label>
116	<Vocabulary
117	onChange={onChange}
118	isInvalid={invalid}
119	options={controlledVocabularyValues}
120	ref={ref}
121	/>
122	<Form.Group.Feedback type="invalid">{error?.message}</Form.Group.Feedback>
123	</Form.Group>
124	)}
125	/>
126	)
127	}
128
129	if (isSafePrimitive) {	14,000✔
130	return (	14,000✔
131	<Controller
132	name={builtFieldName}
133	control={control}
134	rules={rulesToApply}
135	render={({ field: { onChange, ref }, fieldState: { invalid, error } }) => (
136	<Form.Group	16,193✔
137	controlId={name}
138	required={isRequired}
139	as={withinMultipleFieldsGroup ? Col : undefined}>	16,193✔
140	<Form.Group.Label message={description}>{title}</Form.Group.Label>
141
142	<>
143	{type === TypeMetadataFieldOptions.Textbox ? (	16,193✔
144	<Form.Group.TextArea
145	onChange={onChange}
146	isInvalid={invalid}
147	placeholder={watermark}
148	data-fieldtype={type}
149	ref={ref}
150	/>
151	) : (
152	<Form.Group.Input
153	type="text"
154	onChange={onChange}
155	isInvalid={invalid}
156	placeholder={watermark}
157	data-fieldtype={type}
158	ref={ref}
159	/>
160	)}
161	</>
162
163	<Form.Group.Feedback type="invalid">{error?.message}</Form.Group.Feedback>
164	</Form.Group>
165	)}
166	/>
167	)
168	}
169
NEW 170	return null	×
171	}	13✔

IQSS / dataverse-frontend / 8692451949

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous