HOTFIX: collection position in screen

src/app/components/GroupCardsCollections.js

@@ -12,6 +12,8 @@ export default function GroupCardsCollections({ data, cardsPerRow, collectionId
   const [showButton, setShowButton] = useState(false);
   const router = useRouter()
 
+  console.log(data)
+
   const handleResize = (data) => {
     setShowButton(data?.length > cardsPerRow);
   };
@@ -30,7 +32,7 @@ export default function GroupCardsCollections({ data, cardsPerRow, collectionId
       <div className="mx-1 flex flex-col">
         <div id="contentSize" className={`flex content flex-wrap max-sm:justify-center mb-4 max-sm:ml-0  md:ml-0 ${expanded ? "" : "overflow-y-hidden h-[270px]"}`}>
 
-          {data?.length !== 0 ? data?.map((item, index) => {
+        {data?.length !== 0 ? data?.sort((a,b) => a.position - b.position).map((item, index) => {
             return (
               <Cards
                 collectionSource={collectionId}