feat(DatasetThumbnail): add thumbnail to stories

IQSS · Oct 24, 2023 · 87e3907 · 87e3907
1 parent bc54d36
commit 87e3907
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 5 deletions.
diff --git a/src/stories/dataset/DatasetMockData.ts b/src/stories/dataset/DatasetMockData.ts
@@ -95,6 +95,7 @@ export const DatasetMockData = (props?: Partial<Dataset>, anonymized = false): D
         }
       }
     ] as DatasetMetadataBlocks,
+    thumbnail: undefined,
     ...props
   }
   return new Dataset.Builder(
@@ -103,6 +104,7 @@ export const DatasetMockData = (props?: Partial<Dataset>, anonymized = false): D
     dataset.citation,
     dataset.summaryFields,
     dataset.license,
-    dataset.metadataBlocks
+    dataset.metadataBlocks,
+    dataset.thumbnail
   ).build()
 }
diff --git a/src/stories/dataset/dataset-citation/DatasetCitation.stories.tsx b/src/stories/dataset/dataset-citation/DatasetCitation.stories.tsx
@@ -3,6 +3,7 @@ import { WithI18next } from '../../WithI18next'
 import { DatasetCitation } from '../../../sections/dataset/dataset-citation/DatasetCitation'
 import { DatasetPublishingStatus, DatasetVersion } from '../../../dataset/domain/models/Dataset'
 import { DatasetMockData } from '../DatasetMockData'
+import { faker } from '@faker-js/faker'
 
 const meta: Meta<typeof DatasetCitation> = {
   title: 'Sections/Dataset Page/DatasetCitation',
@@ -14,13 +15,35 @@ export default meta
 type Story = StoryObj<typeof DatasetCitation>
 
 export const Default: Story = {
+  render: () => {
+    const dataset = DatasetMockData({ thumbnail: faker.image.imageUrl() })
+    return (
+      <div>
+        <br></br>
+        <br></br>
+        <DatasetCitation
+          title={dataset.getTitle()}
+          citation={dataset.citation}
+          version={dataset.version}
+        />
+      </div>
+    )
+  }
+}
+
+export const WithThumbnail: Story = {
   render: () => {
     const dataset = DatasetMockData()
     return (
       <div>
         <br></br>
         <br></br>
-        <DatasetCitation citation={dataset.citation} version={dataset.version} />
+        <DatasetCitation
+          title={dataset.getTitle()}
+          thumbnail={dataset.thumbnail}
+          citation={dataset.citation}
+          version={dataset.version}
+        />
       </div>
     )
   }
@@ -41,7 +64,11 @@ export const DraftVersion: Story = {
       <div>
         <br></br>
         <br></br>
-        <DatasetCitation citation={dataset.citation} version={dataset.version} />
+        <DatasetCitation
+          title={dataset.getTitle()}
+          citation={dataset.citation}
+          version={dataset.version}
+        />
       </div>
     )
   }
@@ -62,7 +89,11 @@ export const Deaccessioned: Story = {
       <div>
         <br></br>
         <br></br>
-        <DatasetCitation citation={dataset.citation} version={dataset.version} />
+        <DatasetCitation
+          title={dataset.getTitle()}
+          citation={dataset.citation}
+          version={dataset.version}
+        />
       </div>
     )
   }
@@ -82,7 +113,11 @@ export const Anonymized: Story = {
       <div>
         <br></br>
         <br></br>
-        <DatasetCitation citation={dataset.citation} version={dataset.version} />
+        <DatasetCitation
+          title={dataset.getTitle()}
+          citation={dataset.citation}
+          version={dataset.version}
+        />
       </div>
     )
   }