fix: flatten demo board container

packages/db/migrations/seed.ts

@@ -514,7 +514,7 @@ const seedDefaultBoardAsync = async (db: Database) => {
 
 interface DemoWidget {
   kind: WidgetKind;
-  section?: "network" | "right";
+  section?: "right";
   xOffset: number;
   yOffset: number;
   width: number;
@@ -665,7 +665,7 @@ const buildDemoWidgets = (appIds: string[], customWidgetDefinitionId: string): D
   { kind: "beszelSystemGrid", xOffset: 5, yOffset: 2, width: 4, height: 3, needsIntegration: true },
   { kind: "assistant", xOffset: 9, yOffset: 2, width: 3, height: 3, needsIntegration: false },
 
-  // Around the centered network container
+  // Operations center
   { kind: "mediaRequests-requestList", xOffset: 0, yOffset: 5, width: 3, height: 2, needsIntegration: true },
   { kind: "mediaMissing", xOffset: 9, yOffset: 5, width: 3, height: 2, needsIntegration: true },
   { kind: "mediaServer", xOffset: 0, yOffset: 7, width: 3, height: 2, needsIntegration: true },
@@ -701,21 +701,19 @@ const buildDemoWidgets = (appIds: string[], customWidgetDefinitionId: string): D
     options: { definitionId: customWidgetDefinitionId, refreshInterval: 300 },
   },
 
-  // Network stuff container
+  // Network and health
   {
     kind: "healthMonitoring",
-    section: "network",
-    xOffset: 0,
-    yOffset: 0,
+    xOffset: 3,
+    yOffset: 5,
     width: 6,
     height: 2,
     needsIntegration: true,
   },
   {
     kind: "dnsHoleSummary",
-    section: "network",
-    xOffset: 0,
-    yOffset: 2,
+    xOffset: 3,
+    yOffset: 7,
     width: 3,
     height: 2,
     needsIntegration: true,
@@ -723,15 +721,14 @@ const buildDemoWidgets = (appIds: string[], customWidgetDefinitionId: string): D
   },
   {
     kind: "beszelSystemStats",
-    section: "network",
-    xOffset: 3,
-    yOffset: 2,
+    xOffset: 6,
+    yOffset: 7,
     width: 3,
     height: 2,
     needsIntegration: true,
   },
-  { kind: "notifications", section: "network", xOffset: 0, yOffset: 4, width: 2, height: 2, needsIntegration: true },
-  { kind: "beszelAlerts", section: "network", xOffset: 2, yOffset: 4, width: 4, height: 2, needsIntegration: true },
+  { kind: "notifications", xOffset: 3, yOffset: 9, width: 2, height: 2, needsIntegration: true },
+  { kind: "beszelAlerts", xOffset: 5, yOffset: 9, width: 4, height: 2, needsIntegration: true },
 
   // Right app rail
   ...appIds.map(
@@ -886,22 +883,6 @@ const seedDemoUserAsync = async (db: Database) => {
     boardId,
   });
 
-  const networkSectionId = createId();
-  await db.insert(sections).values({
-    id: networkSectionId,
-    kind: "container",
-    boardId,
-    options: SuperJSON.stringify({
-      title: "Network stuff",
-      customCssClasses: [],
-      borderColor: "",
-      showLabel: true,
-      collapsible: false,
-      showOpenAll: false,
-      scrollable: false,
-    }),
-  });
-
   const layoutId = createId();
   await db.insert(layouts).values({
     id: layoutId,
@@ -913,23 +894,11 @@ const seedDemoUserAsync = async (db: Database) => {
     boardId,
   });
 
-  await db.insert(sectionLayouts).values({
-    sectionId: networkSectionId,
-    layoutId,
-    parentSectionId: mainSectionId,
-    xOffset: 3,
-    yOffset: 5,
-    width: 6,
-    height: 6,
-  });
-
   const demoWidgets = buildDemoWidgets(appIds, customWidgetDefinitionId);
   for (const widget of demoWidgets) {
     let sectionId = mainSectionId;
     if (widget.section === "right") {
       sectionId = rightSectionId;
-    } else if (widget.section === "network") {
-      sectionId = networkSectionId;
     }
 
     const itemId = createId();

packages/db/test/sqlite-migration.spec.ts

@@ -86,23 +86,8 @@ test("SQLite migrations seed the redesigned demo dashboard", async () => {
 
     const mainSection = board.sections.find((section) => section.kind === "empty" && section.xOffset === 0);
     const rightSection = board.sections.find((section) => section.kind === "empty" && section.xOffset === 1);
-    const networkSection = board.sections.find((section) => section.kind === "container");
-    if (!mainSection || !rightSection || !networkSection) throw new Error("Demo board sections were not seeded");
-
-    const networkLayout = networkSection.layouts.find((layout) => layout.layoutId === baseLayout.id);
-    expect(networkLayout).toMatchObject({
-      parentSectionId: mainSection.id,
-      xOffset: 3,
-      yOffset: 5,
-      width: 6,
-      height: 6,
-    });
-    if (!networkSection.options) throw new Error("Demo network section options were not seeded");
-    expect(SuperJSON.parse<{ title: string; collapsible: boolean }>(networkSection.options)).toMatchObject({
-      title: "Network stuff",
-      collapsible: false,
-    });
-    expect(networkSection.collapseStates).toEqual([]);
+    if (!mainSection || !rightSection) throw new Error("Demo board sections were not seeded");
+    expect(board.sections.some((section) => section.kind === "container")).toBe(false);
 
     const itemByKind = (kind: string) => board.items.find((item) => item.kind === kind);
     const expectItemLayout = (
@@ -135,11 +120,11 @@ test("SQLite migrations seed the redesigned demo dashboard", async () => {
     expectItemLayout("mediaReleases", 4, 11, 4, 3);
     expectItemLayout("customApi", 8, 11, 4, 3);
 
-    expectItemLayout("healthMonitoring", 0, 0, 6, 2, networkSection.id);
-    expectItemLayout("dnsHoleSummary", 0, 2, 3, 2, networkSection.id);
-    expectItemLayout("beszelSystemStats", 3, 2, 3, 2, networkSection.id);
-    expectItemLayout("notifications", 0, 4, 2, 2, networkSection.id);
-    expectItemLayout("beszelAlerts", 2, 4, 4, 2, networkSection.id);
+    expectItemLayout("healthMonitoring", 3, 5, 6, 2);
+    expectItemLayout("dnsHoleSummary", 3, 7, 3, 2);
+    expectItemLayout("beszelSystemStats", 6, 7, 3, 2);
+    expectItemLayout("notifications", 3, 9, 2, 2);
+    expectItemLayout("beszelAlerts", 5, 9, 4, 2);
 
     for (const kind of ["weather", "airQuality"]) {
       const item = itemByKind(kind);
@@ -168,8 +153,7 @@ test("SQLite migrations seed the redesigned demo dashboard", async () => {
     const mainItemLayouts = board.items.flatMap((item) =>
       item.layouts.filter((layout) => layout.layoutId === baseLayout.id && layout.sectionId === mainSection.id),
     );
-    if (!networkLayout) throw new Error("Demo network section layout was not seeded");
-    expectFilledGrid([...mainItemLayouts, networkLayout], 12);
+    expectFilledGrid(mainItemLayouts, 12);
 
     const rightRailItems = board.items.filter((item) =>
       item.layouts.some((layout) => layout.layoutId === baseLayout.id && layout.sectionId === rightSection.id),
@@ -205,17 +189,6 @@ test("SQLite migrations seed the redesigned demo dashboard", async () => {
     );
     expectFilledGrid(rightRailLayouts, 1);
 
-    const networkItems = board.items.filter((item) =>
-      item.layouts.some((layout) => layout.layoutId === baseLayout.id && layout.sectionId === networkSection.id),
-    );
-    expect(networkItems.map((item) => item.kind).toSorted()).toEqual(
-      ["beszelAlerts", "beszelSystemStats", "dnsHoleSummary", "healthMonitoring", "notifications"].toSorted(),
-    );
-    const networkItemLayouts = networkItems.flatMap((item) =>
-      item.layouts.filter((layout) => layout.layoutId === baseLayout.id && layout.sectionId === networkSection.id),
-    );
-    expectFilledGrid(networkItemLayouts, 6);
-
     const workshopDefinition = await database.query.customWidgetDefinitions.findFirst({
       where: (table, { eq }) => eq(table.creatorId, demoUser.id),
     });