App reorganization

tests/unit/Layout.test.jsx

@@ -1,5 +1,7 @@
 import { describe, test, expect, vi } from "vitest";
 import RootLayout from "../../app/layout";
+import MarketingLayout from "../../app/(marketing)/layout";
+import AppLayout from "../../app/(app)/layout";
 
 // Mock the font imports since they're Next.js specific
 vi.mock("next/font/google", () => ({
@@ -70,30 +72,46 @@ describe("RootLayout", () => {
     expect(container).toBeTruthy();
   });
 
-  test("renders main content area", () => {
-    const testContent = "Test content";
-    const tree = RootLayout({ children: <div>{testContent}</div> });
-    const main = findDescendant(
-      tree,
-      (n) => n.type === "main" && n.props?.className?.includes("flex-1"),
-    );
-    expect(main).toBeTruthy();
-
-    const childText = findDescendant(
-      main,
-      (n) => typeof n === "string" && n.includes(testContent),
-    );
-    expect(childText).toBeTruthy();
-  });
-
-  test("renders children content correctly", () => {
+  test("renders children directly inside the flex container (no <main> at root)", () => {
     const testContent = "This is test content";
     const tree = RootLayout({ children: <div>{testContent}</div> });
-    const main = findDescendant(tree, (n) => n.type === "main");
+
+    expect(findDescendant(tree, (n) => n?.type === "main")).toBeNull();
+
     const childText = findDescendant(
-      main,
+      tree,
       (n) => typeof n === "string" && n.includes(testContent),
     );
     expect(childText).toBeTruthy();
   });
 });
+
+describe("Group layouts (chrome composition)", () => {
+  test("MarketingLayout wraps children in <main flex-1> and appends Footer", () => {
+    const tree = MarketingLayout({ children: <div>marketing-child</div> });
+    const main = findDescendant(
+      tree,
+      (n) => n?.type === "main" && n.props?.className?.includes("flex-1"),
+    );
+    expect(main).toBeTruthy();
+    expect(
+      findDescendant(main, (n) => typeof n === "string" && n.includes("marketing-child")),
+    ).toBeTruthy();
+
+    // Footer is loaded via next/dynamic — it appears as a render prop component
+    // sibling to <main>. Verify the layout returns more than just <main>.
+    const childrenArr = Array.isArray(tree.props.children)
+      ? tree.props.children
+      : [tree.props.children];
+    expect(childrenArr.length).toBeGreaterThan(1);
+  });
+
+  test("AppLayout wraps children in <main flex-1> with no footer", () => {
+    const tree = AppLayout({ children: <div>app-child</div> });
+    expect(tree.type).toBe("main");
+    expect(tree.props.className).toContain("flex-1");
+    expect(
+      findDescendant(tree, (n) => typeof n === "string" && n.includes("app-child")),
+    ).toBeTruthy();
+  });
+});