widgets: resync button on the panel

A reload button (next to +) so newly-deployed widgets show up without a manual
hard-refresh after a rebuild+restart.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-07-26 10:29:14 +00:00
co-authored by Claude Opus 4.8
parent 9bf9b708cb
commit 8a1e8cd79e
@@ -3,7 +3,7 @@ import { useCallback, useEffect, useRef, useState } from 'react';
import { useQuery, useQueryClient } from '@tanstack/react-query'; import { useQuery, useQueryClient } from '@tanstack/react-query';
import { useClient } from 'hooks/useClient'; import { useClient } from 'hooks/useClient';
import { useAuth } from 'hooks/useAuth'; import { useAuth } from 'hooks/useAuth';
import { Plus, X } from 'lucide-react'; import { Plus, X, RefreshCw } from 'lucide-react';
import { useWidgetRegistry } from '../../WidgetRegistry'; import { useWidgetRegistry } from '../../WidgetRegistry';
import { WidgetPicker } from './WidgetPicker'; import { WidgetPicker } from './WidgetPicker';
@@ -226,13 +226,23 @@ export const WidgetPanel = ({ panelId }: { panelId: string }) => {
<WidgetPicker onSelect={addWidget} /> <WidgetPicker onSelect={addWidget} />
</div> </div>
)} )}
<button <div className="flex items-center gap-2">
type="button" <button
className="flex h-10 w-10 items-center justify-center rounded-full bg-primary text-primary-foreground shadow-lg hover:bg-primary/90 transition-colors cursor-pointer" type="button"
onClick={() => setShowPicker((v) => !v)} title="Resync widgets (reload to pick up newly-deployed widgets)"
> className="flex h-10 w-10 items-center justify-center rounded-full border border-border bg-card text-muted-foreground shadow-lg transition-colors hover:text-foreground cursor-pointer"
<Plus size={20} /> onClick={() => window.location.reload()}
</button> >
<RefreshCw size={18} />
</button>
<button
type="button"
className="flex h-10 w-10 items-center justify-center rounded-full bg-primary text-primary-foreground shadow-lg hover:bg-primary/90 transition-colors cursor-pointer"
onClick={() => setShowPicker((v) => !v)}
>
<Plus size={20} />
</button>
</div>
</div> </div>
</div> </div>
); );