ui: persist issue properties pane visibility in localStorage
Store the open/closed state of the properties panel in localStorage so it persists across navigations, issues, and companies. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,15 +1,38 @@
|
||||
import { createContext, useCallback, useContext, useState, type ReactNode } from "react";
|
||||
|
||||
const STORAGE_KEY = "paperclip:panel-visible";
|
||||
|
||||
interface PanelContextValue {
|
||||
panelContent: ReactNode | null;
|
||||
panelVisible: boolean;
|
||||
openPanel: (content: ReactNode) => void;
|
||||
closePanel: () => void;
|
||||
setPanelVisible: (visible: boolean) => void;
|
||||
togglePanelVisible: () => void;
|
||||
}
|
||||
|
||||
const PanelContext = createContext<PanelContextValue | null>(null);
|
||||
|
||||
function readPreference(): boolean {
|
||||
try {
|
||||
const raw = localStorage.getItem(STORAGE_KEY);
|
||||
return raw === null ? true : raw === "true";
|
||||
} catch {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
function writePreference(visible: boolean) {
|
||||
try {
|
||||
localStorage.setItem(STORAGE_KEY, String(visible));
|
||||
} catch {
|
||||
// Ignore storage failures.
|
||||
}
|
||||
}
|
||||
|
||||
export function PanelProvider({ children }: { children: ReactNode }) {
|
||||
const [panelContent, setPanelContent] = useState<ReactNode | null>(null);
|
||||
const [panelVisible, setPanelVisibleState] = useState(readPreference);
|
||||
|
||||
const openPanel = useCallback((content: ReactNode) => {
|
||||
setPanelContent(content);
|
||||
@@ -19,8 +42,23 @@ export function PanelProvider({ children }: { children: ReactNode }) {
|
||||
setPanelContent(null);
|
||||
}, []);
|
||||
|
||||
const setPanelVisible = useCallback((visible: boolean) => {
|
||||
setPanelVisibleState(visible);
|
||||
writePreference(visible);
|
||||
}, []);
|
||||
|
||||
const togglePanelVisible = useCallback(() => {
|
||||
setPanelVisibleState((prev) => {
|
||||
const next = !prev;
|
||||
writePreference(next);
|
||||
return next;
|
||||
});
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<PanelContext.Provider value={{ panelContent, openPanel, closePanel }}>
|
||||
<PanelContext.Provider
|
||||
value={{ panelContent, panelVisible, openPanel, closePanel, setPanelVisible, togglePanelVisible }}
|
||||
>
|
||||
{children}
|
||||
</PanelContext.Provider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user