feat: chat reactions

components/layout/app-shell.tsx

@@ -0,0 +1,29 @@
+"use client";
+
+/**
+ * The column that holds the header, page and footer.
+ *
+ * Exists as a client component for one reason: the bottom padding that
+ * reserves space for the mobile tab bar has to disappear wherever the tab bar
+ * does, and that decision depends on the route. Left in the server layout, the
+ * padding would survive the bar and leave a 64px gap under a chat composer.
+ */
+
+import { cn } from "@/lib/utils";
+import { useHidesAppChrome } from "@/lib/use-chrome-visibility";
+
+export function AppShell({ children }: { children: React.ReactNode }) {
+  const noTabBar = useHidesAppChrome();
+
+  return (
+    <div
+      className={cn(
+        "flex flex-1 flex-col md:pl-16",
+        // Matches SiteBottomNav's own visibility exactly.
+        noTabBar ? "pb-0" : "pb-16 md:pb-0",
+      )}
+    >
+      {children}
+    </div>
+  );
+}