refined infinite article grid and added article filtering

src/app/(PAGES)/_components/main-page.tsx

@@ -9,7 +9,7 @@ import ArticleGrid, {
 import { Article, Category } from "@/server/db/schema";
 import ArrowLink from "@/components/arrow-link";
 import { appRoutes } from "@/config";
-import GlobalSearchWidget from "@/components/global-search-widget";
+import GlobalSearchWidget from "@/components/article/article-filter-bar";
 import { api } from "@/trpc/react";
 import { useInfiniteQuery } from "@tanstack/react-query";
 

src/app/(PAGES)/layout.tsx

@@ -1,13 +1,15 @@
-import { WikiSidebar } from "@/components/layout/wiki-sidebar";
+import { AppSidebar } from "@/components/layout/app-sidebar";
 import Navbar from "@/components/layout/navbar";
 import { SidebarProvider } from "@/components/ui/sidebar";
+import { auth } from "@/server/auth";
 import React from "react";
 
-function Layout({ children }: { children: React.ReactNode }) {
+async function Layout({ children }: { children: React.ReactNode }) {
+  const session = await auth();
   return (
     <SidebarProvider>
-      <WikiSidebar />
-      <div className="w-full">
+      <AppSidebar user={session?.user} />
+      <div className="h-screen w-full bg-background">
         <Navbar />
         <main className="space-y-4 p-4">{children}</main>
       </div>

src/app/layout.tsx

@@ -5,6 +5,7 @@ import { type Metadata } from "next";
 
 import { TRPCReactProvider } from "@/trpc/react";
 import { Toaster } from "@/components/ui/sonner";
+import { ThemeProvider } from "@/components/theme-provider";
 
 export const metadata: Metadata = {
   title: "Create T3 App",
@@ -16,11 +17,22 @@ export default function RootLayout({
   children,
 }: Readonly<{ children: React.ReactNode }>) {
   return (
-    <html lang="en" className={`${GeistSans.variable}`}>
+    <html
+      suppressHydrationWarning
+      lang="en"
+      className={`${GeistSans.variable}`}
+    >
       <body>
         <TRPCReactProvider>
-          <Toaster />
-          {children}
+          <ThemeProvider
+            attribute="class"
+            defaultTheme="system"
+            enableSystem
+            disableTransitionOnChange
+          >
+            <Toaster />
+            {children}
+          </ThemeProvider>
         </TRPCReactProvider>
       </body>
     </html>