From 29b7c5c8d10d5315fea27fc25f1f153c6c12dfbf Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Sat, 2 Mar 2024 20:45:11 +0000
Subject: fix: Fix hydration in list view caused by the spinner

---
 .../app/dashboard/bookmarks/components/BookmarksGrid.tsx    | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

(limited to 'packages/web/app/dashboard/bookmarks')

diff --git a/packages/web/app/dashboard/bookmarks/components/BookmarksGrid.tsx b/packages/web/app/dashboard/bookmarks/components/BookmarksGrid.tsx
index 293b7765..554d20a0 100644
--- a/packages/web/app/dashboard/bookmarks/components/BookmarksGrid.tsx
+++ b/packages/web/app/dashboard/bookmarks/components/BookmarksGrid.tsx
@@ -5,15 +5,15 @@ import { ZBookmark, ZGetBookmarksRequest } from "@/lib/types/api/bookmarks";
 import { api } from "@/lib/trpc";
 import TextCard from "./TextCard";
 import { Slot } from "@radix-ui/react-slot";
-import Masonry from 'react-masonry-css';
-import resolveConfig from 'tailwindcss/resolveConfig'
-import tailwindConfig from '@/tailwind.config'
+import Masonry from "react-masonry-css";
+import resolveConfig from "tailwindcss/resolveConfig";
+import tailwindConfig from "@/tailwind.config";
 import { useMemo } from "react";
 
 function getBreakpointConfig() {
-  const fullConfig = resolveConfig(tailwindConfig)
+  const fullConfig = resolveConfig(tailwindConfig);
 
-  const breakpointColumnsObj: {[key: number]: number, default: number} = {
+  const breakpointColumnsObj: { [key: number]: number; default: number } = {
     default: 3,
   };
   breakpointColumnsObj[parseInt(fullConfig.theme.screens.lg)] = 2;
@@ -22,7 +22,6 @@ function getBreakpointConfig() {
   return breakpointColumnsObj;
 }
 
-
 function renderBookmark(bookmark: ZBookmark) {
   let comp;
   switch (bookmark.content.type) {
@@ -58,7 +57,7 @@ export default function BookmarksGrid({
     return <p>No bookmarks</p>;
   }
   return (
-    <Masonry className="flex gap-4" breakpointCols={breakpointConfig} >
+    <Masonry className="flex gap-4" breakpointCols={breakpointConfig}>
       {data.bookmarks.map((b) => renderBookmark(b))}
     </Masonry>
   );
-- 
cgit v1.2.3-70-g09d2