From 53a1eb14697ce5ab594ce22c3633d6e462a16258 Mon Sep 17 00:00:00 2001
From: Lucas 'Paperboy' Rose-Winters <lucas@sanguinehost.com>
Date: Thu, 6 Nov 2025 20:45:24 +1100
Subject: [PATCH] fix: update Scene tab widgets for proper sizing on reset
 layout

**Problem:**
Reset Layout button was shrinking Scene tab widgets (recentEvents and
presentCharacters) because widget definitions had defaultSize: 2x2 but
defaultLayout.js expected larger sizes (2x4 for characters).

**Changes:**

**presentCharactersWidget.js:**
- Change defaultSize from 2x2 to column-aware function
- Returns 2x4 at all column counts (taller for better card display)
- Update maxAutoSize to allow expansion to 3x5 on wide screens

**recentEventsWidget (infoBoxWidgets.js):**
- Change defaultSize to column-aware function
- Returns 2x2 at 2 columns, 3x2 at 3+ columns (full width)
- Add maxAutoSize for expansion capability

**defaultLayout.js Scene Tab:**
- Update all widgets to use 3-column width for desktop
- sceneInfo: 3x3 (was 2x2), positioned at y:0
- recentEvents: 3x2 (was 2x2), positioned at y:3 (below sceneInfo)
- presentCharacters: 3x4 (was 2x4), positioned at y:5 (below events)

**Result:**
- Scene tab widgets now properly sized on reset (no more shrinking)
- Widgets stack correctly without overlapping
- Full width utilization on wider screens (3 columns)
- Consistent behavior with Status tab responsive sizing
---
 src/systems/dashboard/defaultLayout.js         | 18 +++++++++---------
 .../dashboard/widgets/infoBoxWidgets.js        | 14 +++++++++++++-
 .../widgets/presentCharactersWidget.js         | 16 ++++++++++++++--
 3 files changed, 36 insertions(+), 12 deletions(-)

diff --git a/src/systems/dashboard/defaultLayout.js b/src/systems/dashboard/defaultLayout.js
index b53b277..606620d 100644
--- a/src/systems/dashboard/defaultLayout.js
+++ b/src/systems/dashboard/defaultLayout.js
@@ -90,35 +90,35 @@ export function generateDefaultDashboard() {
                 icon: 'fa-solid fa-map',
                 order: 1,
                 widgets: [
-                    // Row 0-1: Scene Info (combined: calendar, weather, temp, clock, location)
+                    // Row 0-2: Scene Info (combined: calendar, weather, temp, clock, location)
                     {
                         id: 'widget-sceneinfo',
                         type: 'sceneInfo',
                         x: 0,
                         y: 0,
-                        w: 2,
-                        h: 2,
+                        w: 3,
+                        h: 3,
                         config: {}
                     },
-                    // Row 2-3: Recent Events (notebook style, full width)
+                    // Row 3-4: Recent Events (notebook style, full width)
                     {
                         id: 'widget-recentevents',
                         type: 'recentEvents',
                         x: 0,
-                        y: 2,
-                        w: 2,
+                        y: 3,
+                        w: 3,
                         h: 2,
                         config: {
                             maxEvents: 3
                         }
                     },
-                    // Row 4-7: Present Characters (full width, will expand with auto-layout)
+                    // Row 5-8: Present Characters (full width, tall for cards)
                     {
                         id: 'widget-presentchars',
                         type: 'presentCharacters',
                         x: 0,
-                        y: 4,
-                        w: 2,
+                        y: 5,
+                        w: 3,
                         h: 4,
                         config: {
                             cardLayout: 'grid',
diff --git a/src/systems/dashboard/widgets/infoBoxWidgets.js b/src/systems/dashboard/widgets/infoBoxWidgets.js
index a9626d6..829a690 100644
--- a/src/systems/dashboard/widgets/infoBoxWidgets.js
+++ b/src/systems/dashboard/widgets/infoBoxWidgets.js
@@ -529,7 +529,19 @@ export function registerRecentEventsWidget(registry, dependencies) {
         description: 'Recent events notebook',
         category: 'scene',
         minSize: { w: 2, h: 2 },
-        defaultSize: { w: 2, h: 2 },
+        // Column-aware sizing: full width at all sizes
+        defaultSize: (columns) => {
+            if (columns <= 2) {
+                return { w: 2, h: 2 }; // Mobile: 2 cols wide (full), 2 rows
+            }
+            return { w: 3, h: 2 }; // Desktop: 3 cols wide (full), 2 rows
+        },
+        maxAutoSize: (columns) => {
+            if (columns <= 2) {
+                return { w: 2, h: 3 };
+            }
+            return { w: 3, h: 3 };
+        },
         requiresSchema: false,
 
         /**
diff --git a/src/systems/dashboard/widgets/presentCharactersWidget.js b/src/systems/dashboard/widgets/presentCharactersWidget.js
index ae60e74..ddb6579 100644
--- a/src/systems/dashboard/widgets/presentCharactersWidget.js
+++ b/src/systems/dashboard/widgets/presentCharactersWidget.js
@@ -276,8 +276,20 @@ export function registerPresentCharactersWidget(registry, dependencies) {
         description: 'Character cards with avatars, traits, and relationships',
         category: 'scene',
         minSize: { w: 2, h: 2 },
-        defaultSize: { w: 2, h: 2 }, // Compact size fits both mobile and desktop viewports
-        maxAutoSize: { w: 4, h: 5 }, // Max size for auto-arrange expansion (supports up to 4-col on large displays)
+        // Column-aware sizing: taller for better card display
+        defaultSize: (columns) => {
+            if (columns <= 2) {
+                return { w: 2, h: 4 }; // Mobile: 2 cols wide (full), 4 rows tall
+            }
+            return { w: 2, h: 4 }; // Desktop: 2 cols wide, 4 rows tall
+        },
+        // Column-aware max size: can expand on very wide screens
+        maxAutoSize: (columns) => {
+            if (columns <= 2) {
+                return { w: 2, h: 5 };
+            }
+            return { w: 3, h: 5 }; // Can expand to 3 cols wide on 4-col displays
+        },
         requiresSchema: false,
 
         render(container, config = {}) {