update AllCollectionCard

src/components/Collections/AllCollections/CollectionCard.tsx

@@ -2,18 +2,26 @@ import { Typography } from '@mui/material';
 import constants from 'utils/strings/constants';
 import React from 'react';
 import CollectionCard from '../CollectionCard';
+import { CollectionSummary } from 'types/collection';
+
+interface Iprops {
+    collectionTile: any;
+    collectionSummary: CollectionSummary;
+    onCollectionClick: (collectionID: number) => void;
+}
 
 export default function AllCollectionCard({
+    collectionTile,
     onCollectionClick,
-    collectionAttributes,
-    latestFile,
-    fileCount,
-}) {
+    collectionSummary,
+}: Iprops) {
     return (
         <CollectionCard
-            large
-            latestFile={latestFile}
-            onClick={() => onCollectionClick(collectionAttributes.id)}>
+            collectionTile={collectionTile}
+            latestFile={collectionSummary.latestFile}
+            onClick={() =>
+                onCollectionClick(collectionSummary.collectionAttributes.id)
+            }>
             <div>
                 <Typography
                     css={`
@@ -21,7 +29,7 @@ export default function AllCollectionCard({
                         font-weight: 600;
                         line-height: 20px;
                     `}>
-                    {collectionAttributes.name}
+                    {collectionSummary.collectionAttributes.name}
                 </Typography>
                 <Typography
                     css={`
@@ -29,7 +37,7 @@ export default function AllCollectionCard({
                         font-weight: 400;
                         line-height: 20px;
                     `}>
-                    {fileCount} {constants.PHOTOS}
+                    {collectionSummary.fileCount} {constants.PHOTOS}
                 </Typography>
             </div>
         </CollectionCard>

src/components/Collections/AllCollections/content.tsx

@@ -7,10 +7,12 @@ import { CollectionSummary } from 'types/collection';
 interface Iprops {
     collectionSummaries: CollectionSummary[];
     onCollectionClick: (id?: number) => void;
+    collectionTile: any;
 }
 export default function AllCollectionContent({
     collectionSummaries,
     onCollectionClick,
+    collectionTile,
 }: Iprops) {
     return (
         <DialogContent>
@@ -18,17 +20,14 @@ export default function AllCollectionContent({
                 style={{
                     flexWrap: 'wrap',
                 }}>
-                {collectionSummaries.map(
-                    ({ latestFile, collectionAttributes, fileCount }) => (
-                        <AllCollectionCard
-                            onCollectionClick={onCollectionClick}
-                            collectionAttributes={collectionAttributes}
-                            key={collectionAttributes.id}
-                            latestFile={latestFile}
-                            fileCount={fileCount}
-                        />
-                    )
-                )}
+                {collectionSummaries.map((collectionSummary) => (
+                    <AllCollectionCard
+                        collectionTile={collectionTile}
+                        onCollectionClick={onCollectionClick}
+                        collectionSummary={collectionSummary}
+                        key={collectionSummary.collectionAttributes.id}
+                    />
+                ))}
             </FlexWrapper>
         </DialogContent>
     );