feat(dashboard): implement reactive tracker-dashboard integration

Replaced surface-level "disabled" messages with true reactive integration.
When tracker editor saves config changes, dashboard now automatically
updates without page reload - removing disabled widgets and refreshing
remaining ones with new field names/settings.

**Event-Based Architecture:**
- trackerEditor.js dispatches 'rpg:trackerConfigChanged' custom event
- dashboardManager.js subscribes to event and reacts to changes
- Decoupled, extensible, browser-native event system

**Dashboard Reactive Methods:**
- onTrackerConfigChanged(config): Main handler coordinating refresh flow
- removeDisabledWidgets(config): Removes widgets with disabled fields
  - Cleans up DOM, drag/resize handlers, state
  - Removes from tab.widgets arrays
- shouldWidgetBeRemoved(type, config): Decision logic per widget type
  - calendar → remove if date disabled
  - weather → remove if weather disabled
  - temperature → remove if temperature disabled
  - clock → remove if time disabled
  - location → remove if location disabled
  - userStats → remove only if ALL stats disabled
  - presentCharacters → remove if thoughts disabled
- refreshAllWidgets(): Re-renders all remaining widgets with new config

**Widget Auto-Removal Flow:**
1. User disables field in tracker editor
2. Clicks "Save & Apply"
3. Event fires → dashboard receives notification
4. Disabled widgets removed from all tabs
5. Affected tabs auto-layout to fill space
6. Remaining widgets re-render with new config
7. Layout saved automatically

**Removed Surface-Level Bandaid:**
- Deleted checkFieldEnabled() from infoBoxWidgets.js (-36 lines)
- Removed all checkFieldEnabled() calls from widget renders (-25 lines)
- Removed empty state message from userStatsWidget.js (-8 lines)
- Removed tracker settings link handler (-7 lines)
- Widgets no longer show "⚠️ Field disabled" messages
- Dashboard handles removal elegantly instead

**Result:**
True reactive integration. Disable "Arousal" → instantly disappears from
all userStats widgets. Disable "Date" → calendar widget removed and tab
auto-layouts. Rename "Health" to "HP" → updates instantly everywhere.
All changes happen immediately without page reload.

Files modified:
- src/systems/dashboard/dashboardManager.js (+129 lines)
- src/systems/ui/trackerEditor.js (+11 lines)
- src/systems/dashboard/widgets/infoBoxWidgets.js (-67 lines)
- src/systems/dashboard/widgets/userStatsWidget.js (-21 lines)
This commit is contained in:
Lucas 'Paperboy' Rose-Winters
2025-11-02 10:35:35 +11:00
parent d3c1f0a137
commit 339413a6fa
4 changed files with 140 additions and 88 deletions
@@ -99,21 +99,11 @@ export function registerUserStatsWidget(registry, dependencies) {
});
}).join('');
// Show message if no stats are enabled
const content = visibleStats.length > 0
? progressBarsHtml
: `<div class="rpg-widget-empty-state">
<p>⚠️ No stats enabled</p>
<p style="font-size: 0.85em; opacity: 0.7;">
Enable stats in <a href="#" class="rpg-open-tracker-settings">Tracker Settings</a>
</p>
</div>`;
// Render HTML
const html = `
<div class="rpg-stats-content rpg-stats-modular">
<div class="rpg-stats-grid">
${content}
${progressBarsHtml}
</div>
</div>
`;
@@ -122,15 +112,6 @@ export function registerUserStatsWidget(registry, dependencies) {
// Attach event handlers
attachEventHandlers(container, settings, onStatsChange);
// Handle "Tracker Settings" link click
const trackerSettingsLink = container.querySelector('.rpg-open-tracker-settings');
if (trackerSettingsLink) {
trackerSettingsLink.addEventListener('click', (e) => {
e.preventDefault();
document.getElementById('rpg-open-tracker-editor')?.click();
});
}
},
/**