@@ -59,11 +59,9 @@ const DetailsMetadataTab = ({
5959 let initialValues : { [ key : string ] : any } = { } ;
6060
6161 // Transform metadata fields and their values provided by backend (saved in redux)
62- if ( ! ! metadataCatalog . fields && metadataCatalog . fields . length > 0 ) {
63- metadataCatalog . fields . forEach ( ( field ) => {
64- initialValues [ field . id ] = field . value ;
65- } ) ;
66- }
62+ metadataCatalog . fields . forEach ( ( field ) => {
63+ initialValues [ field . id ] = field . value ;
64+ } ) ;
6765
6866 return initialValues ;
6967 } ;
@@ -77,104 +75,89 @@ const DetailsMetadataTab = ({
7775 }
7876 } ;
7977
80- return (
81- < ModalContentTable
82- modalBodyChildren = { < Notifications context = "not_corner" /> }
83- >
84- {
85- //iterate through metadata catalogs
86- ! ! metadata &&
87- metadata . length > 0 &&
88- metadata . map ( ( catalog ) => (
89- // initialize form
90- < Formik < InitialValues >
91- key = { catalog . flavor }
92- enableReinitialize
93- initialValues = { getInitialValues ( catalog ) }
94- onSubmit = { ( values ) => handleSubmit ( values , catalog ) }
95- innerRef = { formikRef }
96- >
97- { ( formik ) => (
98- /* Render table for each metadata catalog */
99- < div className = "obj tbl-details" >
100- < header >
101- < span > { t ( header ? header : catalog . title as ParseKeys ) } </ span >
102- </ header >
103- < div className = "obj-container" >
104- < table className = "main-tbl" >
105- < tbody >
106- { /* Render table row for each metadata field depending on type */ }
107- { ! ! catalog . fields &&
108- catalog . fields . map ( ( field , index ) => (
109- < tr key = { field . id } >
110- < td >
111- < span > { t ( field . label as ParseKeys ) } </ span >
112- { field . required && (
113- < i className = "required" > *</ i >
114- ) }
115- </ td >
116- { field . readOnly ||
117- ! hasAccess ( editAccessRole , user ) ? (
118- // non-editable field if readOnly is set or user doesn't have edit access rights
119- ! ! field . collection &&
120- field . collection . length !== 0 ? (
121- < td > { getMetadataCollectionFieldName ( field , field , t ) } </ td >
122- ) : (
123- < td > {
124- field . type === "time" || field . type === "date"
125- ? < RenderDate date = { field . value as string } />
126- : field . value
127- } </ td >
128- )
129- ) : (
130- < td className = "editable" >
131- { /* Render single value or multi value editable input */ }
132- { field . type === "mixed_text" ? (
133- < Field
134- name = { field . id }
135- fieldInfo = { field }
136- showCheck
137- isFirstField = { index === 0 }
138- component = { RenderMultiField }
139- />
140- ) : (
141- < Field
142- name = { field . id }
143- metadataField = { field }
144- showCheck
145- isFirstField = { index === 0 }
146- component = { RenderField }
147- />
148- ) }
149- </ td >
150- ) }
151- </ tr >
152- ) ) }
153- </ tbody >
154- </ table >
155- </ div >
156-
157- { formik . dirty && (
158- < >
159- { /* Render buttons for updating metadata */ }
160- < WizardNavigationButtons
161- formik = { formik }
162- customValidation = { ! checkValidity ( formik ) }
163- previousPage = { ( ) => formik . resetForm ( ) }
164- createTranslationString = "SAVE"
165- cancelTranslationString = "CANCEL"
166- isLast
167- />
78+ return ( < ModalContentTable
79+ modalBodyChildren = { < Notifications context = "not_corner" /> }
80+ >
81+ { metadata . map ( ( catalog ) => (
82+ // initialize form
83+ < Formik < InitialValues >
84+ key = { catalog . flavor }
85+ enableReinitialize
86+ initialValues = { getInitialValues ( catalog ) }
87+ onSubmit = { ( values ) => handleSubmit ( values , catalog ) }
88+ innerRef = { formikRef }
89+ > { ( formik ) => (
90+ /* Render table for each metadata catalog */
91+ < div className = "obj tbl-details" >
92+ < header >
93+ < span > { t ( header ? header : catalog . title as ParseKeys ) } </ span >
94+ </ header >
95+ < div className = "obj-container" >
96+ < table className = "main-tbl" >
97+ < tbody >
98+ { /* Render table row for each metadata field depending on type */ }
99+ { catalog . fields . map ( ( field , index ) => (
100+ < tr key = { field . id } >
101+ < td >
102+ < span > { t ( field . label as ParseKeys ) } </ span >
103+ { field . required && (
104+ < i className = "required" > *</ i >
105+ ) }
106+ </ td >
107+ { field . readOnly || ! hasAccess ( editAccessRole , user ) ? (
108+ < td >
109+ { /* non-editable field if readOnly is set or user doesn't have edit access rights */ }
110+ { field . collection ?. length ? (
111+ getMetadataCollectionFieldName ( field , field , t )
112+ ) : (
113+ field . type === "time" || field . type === "date"
114+ ? < RenderDate date = { field . value as string } />
115+ : field . value
116+ ) }
117+ </ td >
118+ ) : (
119+ < td className = "editable" >
120+ { /* Render single value or multi value editable input */ }
121+ { field . type === "mixed_text" ? (
122+ < Field
123+ name = { field . id }
124+ fieldInfo = { field }
125+ showCheck
126+ isFirstField = { index === 0 }
127+ component = { RenderMultiField }
128+ />
129+ ) : (
130+ < Field
131+ name = { field . id }
132+ metadataField = { field }
133+ showCheck
134+ isFirstField = { index === 0 }
135+ component = { RenderField }
136+ />
137+ ) }
138+ </ td >
139+ ) }
140+ </ tr >
141+ ) ) }
142+ </ tbody >
143+ </ table >
144+ </ div >
168145
169- </ >
170- ) }
171- </ div >
172- ) }
173- </ Formik >
174- ) )
175- }
176- </ ModalContentTable >
177- ) ;
146+ { formik . dirty && (
147+ // Render buttons for updating metadata
148+ < WizardNavigationButtons
149+ formik = { formik }
150+ customValidation = { ! checkValidity ( formik ) }
151+ previousPage = { ( ) => formik . resetForm ( ) }
152+ createTranslationString = "SAVE"
153+ cancelTranslationString = "CANCEL"
154+ isLast
155+ />
156+ ) }
157+ </ div >
158+ ) } </ Formik >
159+ ) ) }
160+ </ ModalContentTable > ) ;
178161} ;
179162
180163export default DetailsMetadataTab ;
0 commit comments