feat: validate that selected facets are not empty

IQSS · Nov 13, 2024 · b1adff9 · b1adff9
1 parent 61235fe
commit b1adff9
Show file tree

Hide file tree

Showing 4 changed files with 35 additions and 12 deletions.
diff --git a/public/locales/en/shared.json b/public/locales/en/shared.json
@@ -126,7 +126,10 @@
         "label": "Browse/Search Facets",
         "helperText": "Choose and order the metadata fields to use as facets when browsing this collection.",
         "useBrowseSearchFacetsFrom": "Use browse/search facets from",
-        "selectedFacets": "Selected"
+        "selectedFacets": "Selected",
+        "invalid": {
+          "minLength": "At least one facet must be selected."
+        }
       }
     },
     "confirmResetModal": {

diff --git a/...onForm/collection-form/browse-search-facets-section/BrowseSearchFacetsSection.module.scss b/...onForm/collection-form/browse-search-facets-section/BrowseSearchFacetsSection.module.scss
@@ -1,7 +1,16 @@
+@import 'node_modules/@iqss/dataverse-design-system/src/lib/assets/styles/design-tokens/colors.module';
+
 .transfer-list-container {
   display: flex;
   justify-content: center;
 
+  .error-msg {
+    width: 100%;
+    margin-top: 0.25rem;
+    color: $dv-danger-color;
+    font-size: 0.875em;
+  }
+
   @media (min-width: 768px) {
     justify-content: flex-start;
   }

diff --git a/...CollectionForm/collection-form/browse-search-facets-section/BrowseSearchFacetsSection.tsx b/...CollectionForm/collection-form/browse-search-facets-section/BrowseSearchFacetsSection.tsx
@@ -128,15 +128,28 @@ export const BrowseSearchFacetsSection = ({
             <Controller
               name={FACET_IDS_FIELD}
               control={control}
-              render={({ field: { onChange } }) => (
-                <TransferList
-                  onChange={(selectedItems) => handleOnChangeSelectedItems(selectedItems, onChange)}
-                  availableItems={availableItems}
-                  defaultSelected={defaultCollectionFacets}
-                  rightLabel={t('fields.browseSearchFacets.selectedFacets')}
-                  disabled={useBrowseSearchFacetsFromParentCheckedValue}
-                  key={resetKey}
-                />
+              rules={{
+                validate: (facetsSelected: CollectionFormFacet[]) => {
+                  if (facetsSelected.length === 0) {
+                    return t('fields.browseSearchFacets.invalid.minLength')
+                  }
+                  return true
+                }
+              }}
+              render={({ field: { onChange }, fieldState: { invalid, error } }) => (
+                <div>
+                  <TransferList
+                    onChange={(selectedItems) =>
+                      handleOnChangeSelectedItems(selectedItems, onChange)
+                    }
+                    availableItems={availableItems}
+                    defaultSelected={defaultCollectionFacets}
+                    rightLabel={t('fields.browseSearchFacets.selectedFacets')}
+                    disabled={useBrowseSearchFacetsFromParentCheckedValue}
+                    key={resetKey}
+                  />
+                  {invalid && <div className={styles['error-msg']}>{error?.message}</div>}
+                </div>
               )}
             />
           </div>

diff --git a/src/sections/shared/form/EditCreateCollectionForm/collection-form/useSubmitCollection.ts b/src/sections/shared/form/EditCreateCollectionForm/collection-form/useSubmitCollection.ts
@@ -111,8 +111,6 @@ export function useSubmitCollection(
       shouldSendFacetIds
     })
 
-    // TODO:ME Check what happens if sending facetsId as empty array
-
     const newOrUpdatedCollection: CollectionDTO = {
       name: formData.name,
       alias: formData.alias,