From 1443f982117d43bc9b8372cb93c67c5ab398c9b0 Mon Sep 17 00:00:00 2001
From: Tom Morrell <tmorrell@caltech.edu>
Date: Wed, 4 Sep 2024 16:19:12 -0700
Subject: [PATCH] Deposit form customization

---
 .../invenio_app_rdm/deposit/RDMDepositForm.js | 277 +++++++++---------
 1 file changed, 135 insertions(+), 142 deletions(-)

diff --git a/invenio_app_rdm/theme/assets/semantic-ui/js/invenio_app_rdm/deposit/RDMDepositForm.js b/invenio_app_rdm/theme/assets/semantic-ui/js/invenio_app_rdm/deposit/RDMDepositForm.js
index aa0eab5cd..2e80ce732 100644
--- a/invenio_app_rdm/theme/assets/semantic-ui/js/invenio_app_rdm/deposit/RDMDepositForm.js
+++ b/invenio_app_rdm/theme/assets/semantic-ui/js/invenio_app_rdm/deposit/RDMDepositForm.js
@@ -143,41 +143,6 @@ export class RDMDepositForm extends Component {
         <Container id="rdm-deposit-form" className="rel-mt-1">
           <Grid className="mt-25">
             <Grid.Column mobile={16} tablet={16} computer={11}>
-              <Overridable
-                id="InvenioAppRdm.Deposit.AccordionFieldFiles.container"
-                record={record}
-                config={this.config}
-                noFiles={this.noFiles}
-              >
-                <AccordionField
-                  includesPaths={["files.enabled"]}
-                  active
-                  label={i18next.t("Files")}
-                >
-                  {this.noFiles && record.is_published && (
-                    <div className="text-align-center pb-10">
-                      <em>{i18next.t("The record has no files.")}</em>
-                    </div>
-                  )}
-                  <Overridable
-                    id="InvenioAppRdm.Deposit.FileUploader.container"
-                    record={record}
-                    config={this.config}
-                    permissions={permissions}
-                    filesLocked={filesLocked}
-                    allowEmptyFiles={allowEmptyFiles}
-                  >
-                    <FileUploader
-                      isDraftRecord={!record.is_published}
-                      quota={this.config.quota}
-                      decimalSizeDisplay={this.config.decimal_size_display}
-                      showMetadataOnlyToggle={permissions?.can_manage_files}
-                      allowEmptyFiles={allowEmptyFiles}
-                      filesLocked={filesLocked}
-                    />
-                  </Overridable>
-                </AccordionField>
-              </Overridable>
               <Overridable
                 id="InvenioAppRdm.Deposit.AccordionFieldBasicInformation.container"
                 config={this.config}
@@ -189,11 +154,13 @@ export class RDMDepositForm extends Component {
                     "metadata.resource_type",
                     "metadata.title",
                     "metadata.additional_titles",
-                    "metadata.publication_date",
+                    "metadata.contributors",
                     "metadata.creators",
                     "metadata.description",
                     "metadata.additional_descriptions",
                     "metadata.rights",
+                    "metadata.publication_date",
+                    "metadata.publisher",
                   ]}
                   active
                   label={i18next.t("Basic information")}
@@ -255,16 +222,6 @@ export class RDMDepositForm extends Component {
                     />
                   </Overridable>
 
-                  <Overridable
-                    id="InvenioAppRdm.Deposit.PublicationDateField.container"
-                    fieldPath="metadata.publication_date"
-                  >
-                    <PublicationDateField
-                      required
-                      fieldPath="metadata.publication_date"
-                    />
-                  </Overridable>
-
                   <Overridable
                     id="InvenioAppRdm.Deposit.CreatorsField.container"
                     vocabularies={this.vocabularies}
@@ -272,13 +229,39 @@ export class RDMDepositForm extends Component {
                     fieldPath="metadata.creators"
                   >
                     <CreatibutorsField
-                      label={i18next.t("Creators")}
+                      addButtonLabel={i18next.t("Add author")}
+                      label={i18next.t("Authors")}
                       labelIcon="user"
                       fieldPath="metadata.creators"
                       roleOptions={this.vocabularies.metadata.creators.role}
                       schema="creators"
                       autocompleteNames={this.config.autocomplete_names}
                       required
+                      modal={{
+                        addLabel: "Add author",
+                        editLabel: "Edit author",
+                        }}
+                    />
+                  </Overridable>
+
+                  <Overridable
+                    id="InvenioAppRdm.Deposit.ContributorsField.container"
+                    fieldPath="metadata.contributors"
+                    vocabularies={this.vocabularies}
+                    config={this.config}
+                  >
+                    <CreatibutorsField
+                      addButtonLabel={i18next.t("Add contributor")}
+                      label={i18next.t("Contributors")}
+                      labelIcon="user plus"
+                      fieldPath="metadata.contributors"
+                      roleOptions={this.vocabularies.metadata.contributors.role}
+                      schema="contributors"
+                      autocompleteNames={this.config.autocomplete_names}
+                      modal={{
+                        addLabel: "Add contributor",
+                        editLabel: "Edit contributor",
+                      }}
                     />
                   </Overridable>
 
@@ -290,6 +273,7 @@ export class RDMDepositForm extends Component {
                   >
                     <DescriptionsField
                       fieldPath="metadata.description"
+                      label="Abstract"
                       options={this.vocabularies.metadata.descriptions}
                       recordUI={_get(record, "ui", null)}
                     />
@@ -340,8 +324,47 @@ export class RDMDepositForm extends Component {
                     noFiles={this.noFiles}
                     hideCommunitySelection={this.hide_community_selection}
                   />
+
+                  <Overridable
+                    id="InvenioAppRdm.Deposit.PublicationDateField.container"
+                    fieldPath="metadata.publication_date"
+                  >
+                    <PublicationDateField
+                      required
+                      fieldPath="metadata.publication_date"
+                    />
+                  </Overridable>
+
+                  <Overridable
+                    id="InvenioAppRdm.Deposit.PublisherField.container"
+                    fieldPath="metadata.publisher"
+                  >
+                    <PublisherField fieldPath="metadata.publisher" />
+                  </Overridable>
+
                 </AccordionField>
               </Overridable>
+
+              {!_isEmpty(customFieldsUI) && (
+                <Overridable
+                  id="InvenioAppRdm.Deposit.CustomFields.container"
+                  record={record}
+                  customFieldsUI={customFieldsUI}
+                >
+                  <CustomFields
+                    config={customFieldsUI}
+                    record={record}
+                    templateLoaders={[
+                      (widget) => import(`@templates/custom_fields/${widget}.js`),
+                      (widget) =>
+                        import(`@js/invenio_rdm_records/src/deposit/customFields`),
+                      (widget) => import(`react-invenio-forms`),
+                    ]}
+                    fieldPathPrefix="custom_fields"
+                  />
+                </Overridable>
+              )}
+
               <Overridable
                 id="InvenioAppRdm.Deposit.AccordionFieldRecommendedInformation.container"
                 vocabularies={this.vocabularies}
@@ -350,37 +373,13 @@ export class RDMDepositForm extends Component {
               >
                 <AccordionField
                   includesPaths={[
-                    "metadata.contributors",
                     "metadata.subjects",
                     "metadata.languages",
                     "metadata.dates",
                     "metadata.version",
-                    "metadata.publisher",
                   ]}
-                  active
-                  label={i18next.t("Recommended information")}
+                  label={i18next.t("Additional metadata")}
                 >
-                  <Overridable
-                    id="InvenioAppRdm.Deposit.ContributorsField.container"
-                    fieldPath="metadata.contributors"
-                    vocabularies={this.vocabularies}
-                    config={this.config}
-                  >
-                    <CreatibutorsField
-                      addButtonLabel={i18next.t("Add contributor")}
-                      label={i18next.t("Contributors")}
-                      labelIcon="user plus"
-                      fieldPath="metadata.contributors"
-                      roleOptions={this.vocabularies.metadata.contributors.role}
-                      schema="contributors"
-                      autocompleteNames={this.config.autocomplete_names}
-                      modal={{
-                        addLabel: "Add contributor",
-                        editLabel: "Edit contributor",
-                      }}
-                    />
-                  </Overridable>
-
                   <Overridable
                     id="InvenioAppRdm.Deposit.SubjectsField.container"
                     vocabularies={this.vocabularies}
@@ -395,25 +394,6 @@ export class RDMDepositForm extends Component {
                     />
                   </Overridable>
 
-                  <Overridable
-                    id="InvenioAppRdm.Deposit.LanguagesField.container"
-                    fieldPath="metadata.languages"
-                    record={record}
-                  >
-                    <LanguagesField
-                      fieldPath="metadata.languages"
-                      initialOptions={_get(record, "ui.languages", []).filter(
-                        (lang) => lang !== null
-                      )} // needed because dumped empty record from backend gives [null]
-                      serializeSuggestions={(suggestions) =>
-                        suggestions.map((item) => ({
-                          text: item.title_l10n,
-                          value: item.id,
-                          key: item.id,
-                        }))
-                      }
-                    />
-                  </Overridable>
 
                   <Overridable
                     id="InvenioAppRdm.Deposit.DateField.container"
@@ -435,11 +415,25 @@ export class RDMDepositForm extends Component {
                   </Overridable>
 
                   <Overridable
-                    id="InvenioAppRdm.Deposit.PublisherField.container"
-                    fieldPath="metadata.publisher"
+                    id="InvenioAppRdm.Deposit.LanguagesField.container"
+                    fieldPath="metadata.languages"
+                    record={record}
                   >
-                    <PublisherField fieldPath="metadata.publisher" />
+                    <LanguagesField
+                      fieldPath="metadata.languages"
+                      initialOptions={_get(record, "ui.languages", []).filter(
+                        (lang) => lang !== null
+                      )} // needed because dumped empty record from backend gives [null]
+                      serializeSuggestions={(suggestions) =>
+                        suggestions.map((item) => ({
+                          text: item.title_l10n,
+                          value: item.id,
+                          key: item.id,
+                        }))
+                      }
+                    />
                   </Overridable>
+
                 </AccordionField>
               </Overridable>
               <Overridable
@@ -448,7 +442,6 @@ export class RDMDepositForm extends Component {
               >
                 <AccordionField
                   includesPaths={["metadata.funding"]}
-                  active
                   label="Funding"
                   ui={this.accordionStyle}
                 >
@@ -535,25 +528,24 @@ export class RDMDepositForm extends Component {
                   </Overridable>
                 </AccordionField>
               </Overridable>
+              
+
               <Overridable
-                id="InvenioAppRdm.Deposit.AccordionFieldAlternateIdentifiers.container"
+                id="InvenioAppRdm.Deposit.AccordionFieldRelatedWorks.container"
                 vocabularies={this.vocabularies}
               >
                 <AccordionField
-                  includesPaths={["metadata.identifiers"]}
-                  active
-                  label={i18next.t("Alternate identifiers")}
+                  includesPaths={["metadata.related_identifiers"]}
+                  label={i18next.t("Related works")}
                 >
                   <Overridable
-                    id="InvenioAppRdm.Deposit.IdentifiersField.container"
+                    id="InvenioAppRdm.Deposit.RelatedWorksField.container"
+                    fieldPath="metadata.related_identifiers"
                     vocabularies={this.vocabularies}
-                    fieldPath="metadata.identifiers"
                   >
-                    <IdentifiersField
-                      fieldPath="metadata.identifiers"
-                      label={i18next.t("Alternate identifiers")}
-                      labelIcon="barcode"
-                      schemeOptions={this.vocabularies.metadata.identifiers.scheme}
+                    <RelatedWorksField
+                      fieldPath="metadata.related_identifiers"
+                      options={this.vocabularies.metadata.identifiers}
                       showEmptyValue
                     />
                   </Overridable>
@@ -561,64 +553,65 @@ export class RDMDepositForm extends Component {
               </Overridable>
 
               <Overridable
-                id="InvenioAppRdm.Deposit.AccordionFieldRelatedWorks.container"
+                id="InvenioAppRdm.Deposit.AccordionFieldAlternateIdentifiers.container"
                 vocabularies={this.vocabularies}
               >
                 <AccordionField
-                  includesPaths={["metadata.related_identifiers"]}
-                  active
-                  label={i18next.t("Related works")}
+                  includesPaths={["metadata.identifiers"]}
+                  label={i18next.t("Alternate identifiers")}
                 >
                   <Overridable
-                    id="InvenioAppRdm.Deposit.RelatedWorksField.container"
-                    fieldPath="metadata.related_identifiers"
+                    id="InvenioAppRdm.Deposit.IdentifiersField.container"
                     vocabularies={this.vocabularies}
+                    fieldPath="metadata.identifiers"
                   >
-                    <RelatedWorksField
-                      fieldPath="metadata.related_identifiers"
-                      options={this.vocabularies.metadata.identifiers}
+                    <IdentifiersField
+                      fieldPath="metadata.identifiers"
+                      label={i18next.t("Alternate identifiers")}
+                      labelIcon="barcode"
+                      schemeOptions={this.vocabularies.metadata.identifiers.scheme}
                       showEmptyValue
                     />
                   </Overridable>
                 </AccordionField>
               </Overridable>
+              
               <Overridable
-                id="InvenioAppRdm.Deposit.AccordionFieldReferences.container"
-                vocabularies={this.vocabularies}
+              id="InvenioAppRdm.Deposit.AccordionFieldFiles.container"
+                record={record}
+                config={this.config}
+                noFiles={this.noFiles}
               >
                 <AccordionField
-                  includesPaths={["metadata.references"]}
+                  includesPaths={["files.enabled"]}
                   active
-                  label={i18next.t("References")}
+                  label={i18next.t("Files")}
                 >
+                  {this.noFiles && record.is_published && (
+                    <div className="text-align-center pb-10">
+                      <em>{i18next.t("The record has no files.")}</em>
+                    </div>
+                  )}
                   <Overridable
-                    id="InvenioAppRdm.Deposit.ReferencesField.container"
-                    fieldPath="metadata.references"
-                    vocabularies={this.vocabularies}
+                    id="InvenioAppRdm.Deposit.FileUploader.container"
+                    record={record}
+                    config={this.config}
+                    permissions={permissions}
+                    filesLocked={filesLocked}
+                    allowEmptyFiles={allowEmptyFiles}
                   >
-                    <ReferencesField fieldPath="metadata.references" showEmptyValue />
+                    <FileUploader
+                      isDraftRecord={!record.is_published}
+                      quota={this.config.quota}
+                      decimalSizeDisplay={this.config.decimal_size_display}
+                      showMetadataOnlyToggle={permissions?.can_manage_files}
+                      allowEmptyFiles={allowEmptyFiles}
+                      filesLocked={filesLocked}
+                    />
                   </Overridable>
                 </AccordionField>
               </Overridable>
-              {!_isEmpty(customFieldsUI) && (
-                <Overridable
-                  id="InvenioAppRdm.Deposit.CustomFields.container"
-                  record={record}
-                  customFieldsUI={customFieldsUI}
-                >
-                  <CustomFields
-                    config={customFieldsUI}
-                    record={record}
-                    templateLoaders={[
-                      (widget) => import(`@templates/custom_fields/${widget}.js`),
-                      (widget) =>
-                        import(`@js/invenio_rdm_records/src/deposit/customFields`),
-                      (widget) => import(`react-invenio-forms`),
-                    ]}
-                    fieldPathPrefix="custom_fields"
-                  />
-                </Overridable>
-              )}
+
             </Grid.Column>
             <Ref innerRef={this.sidebarRef}>
               <Grid.Column