From 82a270576b463f60b5aa414d6ce35125ffbedf66 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Germ=C3=A1n=20Saracca?= <gersaracca@gmail.com>
Date: Thu, 17 Oct 2024 16:11:33 -0300
Subject: [PATCH] feat: with show data button

---
 .../FeaturedItemsForm.module.scss             | 10 +++++++
 .../FeaturedItemsForm/FeaturedItemsForm.tsx   | 28 +++++++++++++++++--
 2 files changed, 35 insertions(+), 3 deletions(-)

diff --git a/src/sections/collection-featured-items/FeaturedItemsForm/FeaturedItemsForm.module.scss b/src/sections/collection-featured-items/FeaturedItemsForm/FeaturedItemsForm.module.scss
index 83fdb83c7..c3ad8560f 100644
--- a/src/sections/collection-featured-items/FeaturedItemsForm/FeaturedItemsForm.module.scss
+++ b/src/sections/collection-featured-items/FeaturedItemsForm/FeaturedItemsForm.module.scss
@@ -4,3 +4,13 @@
   gap: 1rem;
   padding-top: 2rem;
 }
+
+.show-data-checkbox-wrapper {
+  display: flex;
+  gap: 0.5rem;
+  align-items: center;
+
+  :global .form-check {
+    margin-bottom: 0;
+  }
+}
diff --git a/src/sections/collection-featured-items/FeaturedItemsForm/FeaturedItemsForm.tsx b/src/sections/collection-featured-items/FeaturedItemsForm/FeaturedItemsForm.tsx
index e27f1b86b..0600dec64 100644
--- a/src/sections/collection-featured-items/FeaturedItemsForm/FeaturedItemsForm.tsx
+++ b/src/sections/collection-featured-items/FeaturedItemsForm/FeaturedItemsForm.tsx
@@ -1,7 +1,7 @@
-import { FormProvider, useFieldArray, useForm } from 'react-hook-form'
+import { Controller, FormProvider, useFieldArray, useForm } from 'react-hook-form'
 import { DndContext, DragEndEvent } from '@dnd-kit/core'
 import { restrictToVerticalAxis } from '@dnd-kit/modifiers'
-import { Button } from '@iqss/dataverse-design-system'
+import { Button, Form, QuestionMarkTooltip } from '@iqss/dataverse-design-system'
 import { FeaturedItem } from './FeaturedItem/FeaturedItem'
 import { SortableContext } from '@dnd-kit/sortable'
 import styles from './FeaturedItemsForm.module.scss'
@@ -10,6 +10,7 @@ import { CollectionFeaturedItem } from '@/collection/domain/models/CollectionFea
 
 export type FeaturedItemsFormData = {
   featuredItems: FeaturedItemField[]
+  withShowDataButton: boolean
 }
 
 type FeaturedItemField = {
@@ -33,7 +34,8 @@ export const FeaturedItemsForm = () => {
         content: '',
         image: undefined
       }
-    ]
+    ],
+    withShowDataButton: true
   }
 
   const form = useForm<FeaturedItemsFormData>({
@@ -108,6 +110,26 @@ export const FeaturedItemsForm = () => {
           </div>
         )}
 
+        <Controller
+          name="withShowDataButton"
+          control={form.control}
+          render={({ field: { onChange, ref, value } }) => (
+            <div className={styles['show-data-checkbox-wrapper']}>
+              <Form.Group.Checkbox
+                id="withShowDataButton"
+                onChange={onChange}
+                label="Show data by default"
+                checked={value}
+                ref={ref}
+              />
+              <QuestionMarkTooltip
+                placement="right"
+                message="If this option is unchecked, the collections, datasets, and files list will not appear by default. To display them, the user will need to click a button located below the carousel."
+              />
+            </div>
+          )}
+        />
+
         <DndContext onDragEnd={handleDragEnd} modifiers={[restrictToVerticalAxis]}>
           <SortableContext items={fieldsArray}>
             {(fieldsArray as FeaturedItemFieldWithId[]).map((field, index) => (