From 594c9ad5df2e343adf2fd44ef85f2703d2afed15 Mon Sep 17 00:00:00 2001
From: Abhinav <abhinavk.grd@gmail.com>
Date: Fri, 3 Jun 2022 13:42:42 +0530
Subject: [PATCH] sort collection bar collection summaries

---
 .../Collections/CollectionBar/index.tsx       | 29 ++++++++++++-------
 .../Collections/CollectionInfoWithOptions.tsx |  7 +++--
 2 files changed, 23 insertions(+), 13 deletions(-)

diff --git a/src/components/Collections/CollectionBar/index.tsx b/src/components/Collections/CollectionBar/index.tsx
index 85134ed9c..3dcaefe0e 100644
--- a/src/components/Collections/CollectionBar/index.tsx
+++ b/src/components/Collections/CollectionBar/index.tsx
@@ -1,8 +1,8 @@
 import ScrollButton from 'components/Collections/CollectionBar/ScrollButton';
-import React, { useEffect } from 'react';
+import React, { useEffect, useMemo } from 'react';
 import { Collection, CollectionSummaries } from 'types/collection';
 import constants from 'utils/strings/constants';
-import { ALL_SECTION } from 'constants/collection';
+import { ALL_SECTION, COLLECTION_SORT_BY } from 'constants/collection';
 import { Typography } from '@mui/material';
 import {
     Hider,
@@ -15,6 +15,7 @@ import useComponentScroll, { SCROLL_DIRECTION } from 'hooks/useComponentScroll';
 import useWindowSize from 'hooks/useWindowSize';
 import LinkButton from 'components/pages/gallery/LinkButton';
 import { SpaceBetweenFlex } from 'components/Container';
+import { sortCollectionSummaries } from 'services/collectionService';
 
 interface IProps {
     collections: Collection[];
@@ -34,7 +35,17 @@ export default function CollectionBar(props: IProps) {
         showAllCollections,
     } = props;
 
+    const sortedCollectionSummary = useMemo(
+        () =>
+            sortCollectionSummaries(
+                [...collectionSummaries.values()],
+                COLLECTION_SORT_BY.UPDATION_TIME_DESCENDING
+            ),
+        [collectionSummaries]
+    );
+
     const windowSize = useWindowSize();
+
     const {
         componentRef,
         scrollComponent,
@@ -90,15 +101,13 @@ export default function CollectionBar(props: IProps) {
                         onClick={clickHandler(ALL_SECTION)}>
                         {constants.ALL_SECTION_NAME}
                     </CollectionCardWithActiveIndicator>
-                    {collections.map((item) => (
+                    {sortedCollectionSummary.map((item) => (
                         <CollectionCardWithActiveIndicator
-                            key={item.id}
-                            latestFile={
-                                collectionSummaries.get(item.id)?.latestFile
-                            }
-                            ref={collectionChipsRef[item.id]}
-                            active={activeCollection === item.id}
-                            onClick={clickHandler(item.id)}>
+                            key={item.attributes.id}
+                            latestFile={item.latestFile}
+                            ref={collectionChipsRef[item.attributes.id]}
+                            active={activeCollection === item.attributes.id}
+                            onClick={clickHandler(item.attributes.id)}>
                             {item.name}
                         </CollectionCardWithActiveIndicator>
                     ))}
diff --git a/src/components/Collections/CollectionInfoWithOptions.tsx b/src/components/Collections/CollectionInfoWithOptions.tsx
index 95c3c82ad..3b84807e4 100644
--- a/src/components/Collections/CollectionInfoWithOptions.tsx
+++ b/src/components/Collections/CollectionInfoWithOptions.tsx
@@ -28,9 +28,10 @@ export default function collectionInfoWithOptions({
         <CollectionSectionWrapper>
             <SpaceBetweenFlex>
                 <CollectionInfo name={name} fileCount={fileCount} />
-                {type !== CollectionType.system && (
-                    <CollectionOptions {...props} />
-                )}
+                {type !== CollectionType.system &&
+                    type !== CollectionType.favorites && (
+                        <CollectionOptions {...props} />
+                    )}
             </SpaceBetweenFlex>
         </CollectionSectionWrapper>
     );