2026-07-15 12:22:14 +02:00
|
|
|
import { create } from 'zustand';
|
|
|
|
|
|
|
|
|
|
export interface ToolbarItem {
|
|
|
|
|
id: string;
|
|
|
|
|
plugin: string;
|
|
|
|
|
label: string;
|
|
|
|
|
icon?: React.ReactNode;
|
|
|
|
|
onClick: () => void;
|
|
|
|
|
group?: string;
|
|
|
|
|
disabled?: boolean;
|
|
|
|
|
active?: boolean;
|
2026-07-28 00:45:55 +02:00
|
|
|
type?: 'button' | 'search' | 'select' | 'dropdown';
|
2026-07-15 12:22:14 +02:00
|
|
|
searchPlaceholder?: string;
|
|
|
|
|
onSearch?: (query: string) => void;
|
|
|
|
|
selectOptions?: { value: string; label: string }[];
|
|
|
|
|
selectValue?: string;
|
|
|
|
|
onSelect?: (value: string) => void;
|
2026-07-28 02:16:03 +02:00
|
|
|
menuOptions?: { value: string; label: string; icon?: React.ReactNode; active?: boolean; onClick: () => void; section?: string; separator?: boolean; disabled?: boolean }[];
|
2026-07-28 00:45:55 +02:00
|
|
|
menuWidth?: string;
|
2026-07-28 02:16:03 +02:00
|
|
|
iconOnly?: boolean;
|
2026-07-15 12:22:14 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
interface PluginToolbarState {
|
|
|
|
|
items: ToolbarItem[];
|
|
|
|
|
activePlugin: string | null;
|
|
|
|
|
registerItems: (plugin: string, items: ToolbarItem[]) => void;
|
|
|
|
|
unregisterPlugin: (plugin: string) => void;
|
|
|
|
|
setActivePlugin: (plugin: string | null) => void;
|
|
|
|
|
updateItem: (plugin: string, id: string, updates: Partial<ToolbarItem>) => void;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export const usePluginToolbarStore = create<PluginToolbarState>((set) => ({
|
|
|
|
|
items: [],
|
|
|
|
|
activePlugin: null,
|
|
|
|
|
registerItems: (plugin, newItems) =>
|
|
|
|
|
set((state) => ({
|
|
|
|
|
items: [...state.items.filter((i) => i.plugin !== plugin), ...newItems],
|
|
|
|
|
activePlugin: plugin,
|
|
|
|
|
})),
|
|
|
|
|
unregisterPlugin: (plugin) =>
|
|
|
|
|
set((state) => ({
|
|
|
|
|
items: state.items.filter((i) => i.plugin !== plugin),
|
|
|
|
|
activePlugin: state.activePlugin === plugin ? null : state.activePlugin,
|
|
|
|
|
})),
|
|
|
|
|
setActivePlugin: (plugin) => set({ activePlugin: plugin }),
|
|
|
|
|
updateItem: (plugin, id, updates) =>
|
|
|
|
|
set((state) => ({
|
|
|
|
|
items: state.items.map((i) =>
|
|
|
|
|
i.plugin === plugin && i.id === id ? { ...i, ...updates } : i
|
|
|
|
|
),
|
|
|
|
|
})),
|
|
|
|
|
}));
|