fixed

devlopersabbir · Jan 25, 2024 · ec9f691 · ec9f691
1 parent 2e2f561
commit ec9f691
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 19 deletions.
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -4,7 +4,8 @@ import "./globals.css";
 import { cn } from "@/lib/utils";
 import { Toaster } from "@/components/ui/sonner";
 import { ThemeProvider } from "@/components/theme/ThemeProvider";
-import Shared from "@/components/shared/wrapper/Shared";
+import Sidebar from "@/components/shared/sidebar/Sidebar";
+import Search from "@/components/shared/search/Search";
 
 const inter = Inter({ subsets: ["latin"] });
 
@@ -43,7 +44,9 @@ export default function RootLayout({
         >
           <Toaster />
           <main className="relative flex flex-col min-h-scree">
-            <Shared />
+            <div className="w-[20rem] fixed left-0 top-0 my-8 px-8 border-r-2 border-gray-200 h-[90vh] z-20">
+              <Sidebar />
+            </div>
             <div className="flex-1 flex-grow w-full">{children}</div>
           </main>
         </ThemeProvider>

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -1,6 +1,7 @@
-import { Suspense } from "react";
+import React, { Suspense } from "react";
 import ProfileGrid from "@/components/contents/ProfileGrid";
 import ProfileCardSkeleton from "@/constants/skeleton/ProfileCardSkeleton";
+import Search from "@/components/shared/search/Search";
 
 type PageProps = {
   searchParams: {
@@ -12,18 +13,21 @@ export default async function Home({
   searchParams: { page = "1" },
 }: PageProps) {
   return (
-    <div className="mt-32 mb-8 border-t-orange-500 ml-[20rem] px-6 overflow-y-scroll">
-      <Suspense
-        fallback={
-          <div className="flex-center flex-col gap-3">
-            {[0, 1, 2, 3, 4, 5, 6, 7, 8, 9].map((_, i) => (
-              <ProfileCardSkeleton key={i} />
-            ))}
-          </div>
-        }
-      >
-        <ProfileGrid page={page} />
-      </Suspense>
-    </div>
+    <React.Fragment>
+      <Search />
+      <div className="mt-32 mb-8 border-t-orange-500 ml-[20rem] px-6 overflow-y-scroll">
+        <Suspense
+          fallback={
+            <div className="flex-center flex-col gap-3">
+              {[0, 1, 2, 3, 4, 5, 6, 7, 8, 9].map((_, i) => (
+                <ProfileCardSkeleton key={i} />
+              ))}
+            </div>
+          }
+        >
+          <ProfileGrid page={page} />
+        </Suspense>
+      </div>
+    </React.Fragment>
   );
 }
diff --git a/src/components/contents/ProfileGrid.tsx b/src/components/contents/ProfileGrid.tsx
@@ -20,7 +20,6 @@ const ProfileGrid = async ({ page }: Props) => {
     db.select().from(users).limit(itemPerPage).offset(offset),
   ]);
   const count = lengths[0].count;
-  console.log(count);
   return (
     <>
       <div className="flex-center flex-col gap-3">

diff --git a/src/components/shared/search/Search.tsx b/src/components/shared/search/Search.tsx
@@ -3,8 +3,10 @@ import SearchProfiles from "@/components/forms/SearchProfiles";
 
 const Search = () => {
   return (
-    <div className="w-full bottom-0 my-8 px-6 flex-center">
-      <SearchProfiles />
+    <div className="backdrop-blur-3xl fixed top-0 left-[20rem] right-0 z-10">
+      <div className="w-full bottom-0 my-8 px-6 flex-center">
+        <SearchProfiles />
+      </div>
     </div>
   );
 };