diff --git a/client/src/pages/home/tabs/MyDashboard.jsx b/client/src/pages/home/tabs/MyDashboard.jsx index 3dc9f98..3836ecf 100644 --- a/client/src/pages/home/tabs/MyDashboard.jsx +++ b/client/src/pages/home/tabs/MyDashboard.jsx @@ -29,13 +29,14 @@ export default function MyDashboard() { const hasHydrated = useRef(false); // 1. Pull the global slot recipes - const glassPanelRecipe = useSlotRecipe({key: "glassPanel"}); - const glassPanelStyles = glassPanelRecipe(); - const widgetStyles = glassPanelRecipe({ layout: "widget" }); - const widgetSettingsRecipe = useSlotRecipe({ key: "widgetSettings" }); - const widgetSettingsStyles = widgetSettingsRecipe(); + const widgetRecipe = useSlotRecipe({ key: "widget" }); + const popoverRecipe = useSlotRecipe({ key: "glassPopover" }); - // 2. Populate widgets + // 2. Pass the editing state directly into the widget recipe! + const widgetStyles = widgetRecipe({ mode: isEditing ? "editing" : undefined }); + const popoverStyles = popoverRecipe(); + + // 3. Populate widgets useEffect(() => { if (user?.preferences?.dashboard_layout && !hasHydrated.current) { const savedLayout = user.preferences.dashboard_layout; @@ -57,7 +58,7 @@ export default function MyDashboard() { isResizable: false // The magic lock! No resizing allowed globally. })); - // 3. The component mapper + // 4. The component mapper const renderWidget = (widget) => { const registryEntry = WIDGET_REGISTRY[widget.type]; @@ -84,8 +85,8 @@ export default function MyDashboard() { {/* NEW: The Positioner lifts the content out of the Flexbox flow */} - - {/*className={`${glassPanelStyles.root} ${widgetSettingsStyles.root}`}>*/} + + }> {/* THE DELETE BUTTON */}