feat: desktop image thumbnails, gallery lightbox portal, client-side compression, clickable table rows, fix header gap

src/app/(dashboard)/dashboard-shell.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import React from "react";
+import { IconContext } from "@phosphor-icons/react";
 
 import { AppSidebar } from "@/components/app-sidebar";
 import { SiteHeader } from "@/components/site-header";
@@ -28,16 +29,19 @@ export function DashboardShell({
   company,
   children,
   initialPrefs,
+  pendingMatchCount = 0,
 }: {
   user: ShellUser;
   company: ShellCompany;
   children: React.ReactNode;
   initialPrefs: ThemePrefs;
+  pendingMatchCount?: number;
 }) {
   const [themeCustomizerOpen, setThemeCustomizerOpen] = React.useState(false);
   const { config } = useSidebarConfig();
 
   return (
+    <IconContext.Provider value={{ weight: "bold" }}>
     <SidebarProvider
       style={
         {
@@ -58,14 +62,11 @@ export function DashboardShell({
             variant={config.variant}
             collapsible={config.collapsible}
             side={config.side}
+            pendingMatchCount={pendingMatchCount}
           />
           <SidebarInset>
             <SiteHeader company={company} />
-            <div className="flex flex-1 flex-col">
-              <div className="@container/main flex flex-1 flex-col gap-2">
-                <div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6">{children}</div>
-              </div>
-            </div>
+            <div className="flex flex-1 flex-col min-h-0">{children}</div>
             <SiteFooter />
           </SidebarInset>
         </>
@@ -73,11 +74,7 @@ export function DashboardShell({
         <>
           <SidebarInset>
             <SiteHeader company={company} />
-            <div className="flex flex-1 flex-col">
-              <div className="@container/main flex flex-1 flex-col gap-2">
-                <div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6">{children}</div>
-              </div>
-            </div>
+            <div className="flex flex-1 flex-col min-h-0">{children}</div>
             <SiteFooter />
           </SidebarInset>
           <AppSidebar
@@ -86,6 +83,7 @@ export function DashboardShell({
             variant={config.variant}
             collapsible={config.collapsible}
             side={config.side}
+            pendingMatchCount={pendingMatchCount}
           />
         </>
       )}
@@ -97,5 +95,6 @@ export function DashboardShell({
         initialPrefs={initialPrefs}
       />
     </SidebarProvider>
+    </IconContext.Provider>
   );
 }