fix(dashboard): make Scene Info widget column-aware for proper desktop sizing

Fixed Scene Info widget using fixed sizes instead of column-aware functions,
causing it to be too narrow on desktop (3-4 columns) while working fine on mobile (2 columns).

**Problem:**
- Widget had fixed `defaultSize: {w: 2, h: 2}` and `maxAutoSize: {w: 2, h: 3}`
- Worked perfectly on mobile (2 columns) → 2×3 fills width
- Too narrow on desktop (3-4 columns) → 2×3 only uses 50-66% of width
- Reset Layout/Sort/Auto-Arrange buttons couldn't scale properly

**Root Cause:**
Scene Info widget not following established pattern used by User Info and User Stats widgets,
which use column-aware functions instead of fixed size objects.

**Fix (sceneInfoWidget.js:292-303):**

Changed from fixed sizes:
```javascript
defaultSize: { w: 2, h: 2 },
maxAutoSize: { w: 2, h: 3 },
```

To column-aware functions:
```javascript
defaultSize: (columns) => {
    if (columns <= 2) {
        return { w: 2, h: 2 }; // Mobile: 2×2 (compact, full width)
    }
    return { w: 3, h: 3 };     // Desktop: 3×3 (spacious)
},
maxAutoSize: (columns) => {
    if (columns <= 2) {
        return { w: 2, h: 3 }; // Mobile: 2×3 max (full width)
    }
    return { w: 3, h: 3 };     // Desktop: 3×3 max
},
```

**Behavior:**

Mobile (≤2 columns):
- Default: 2×2 (compact)
- Max: 2×3 (can expand vertically)
- Fills entire panel width ✓

Desktop (≥3 columns):
- Default: 3×3 (spacious)
- Max: 3×3 (properly sized)
- Uses horizontal space appropriately ✓

**Result:**
- Reset Layout: Uses correct size for current column count
- Sort Widgets: Sizes correctly after sort
- Auto-Arrange: Expands to proper maxAutoSize based on columns
- Panel resize: Widget reflowed properly when columns change
- All 5 data points (date, time, weather, temp, location) visible at all sizes

Follows same pattern as User Info (lines 42-54) and User Stats (lines 38-43) widgets.
This commit is contained in:
Lucas 'Paperboy' Rose-Winters
2025-11-03 22:10:39 +11:00
parent 786d890372
commit b6c6eaee2a
@@ -288,8 +288,19 @@ export function registerSceneInfoWidget(registry, dependencies) {
description: 'Compact scene information grid (calendar, weather, time, location)',
category: 'scene',
minSize: { w: 2, h: 2 },
defaultSize: { w: 2, h: 2 },
maxAutoSize: { w: 2, h: 3 },
// Column-aware sizing: compact on mobile, spacious on desktop
defaultSize: (columns) => {
if (columns <= 2) {
return { w: 2, h: 2 }; // Mobile: 2×2 (compact, full width)
}
return { w: 3, h: 3 }; // Desktop: 3×3 (spacious)
},
maxAutoSize: (columns) => {
if (columns <= 2) {
return { w: 2, h: 3 }; // Mobile: 2×3 max (full width)
}
return { w: 3, h: 3 }; // Desktop: 3×3 max
},
requiresSchema: false,
/**