67 lines
1.7 KiB
TypeScript
67 lines
1.7 KiB
TypeScript
import { useCallback, useState } from "react";
|
|
|
|
export type RightPanelMode = "view" | "edit" | "create";
|
|
export type RightPanelVisibility = "hidden" | "visible";
|
|
|
|
export interface RightPanelStateOptions {
|
|
defaultMode?: RightPanelMode;
|
|
defaultVisibility?: RightPanelVisibility;
|
|
}
|
|
|
|
export interface RightPanelState {
|
|
mode: RightPanelMode;
|
|
visibility: RightPanelVisibility;
|
|
isOpen: boolean;
|
|
}
|
|
|
|
export interface RightPanelStateActions {
|
|
onOpenChange: (open: boolean) => void;
|
|
open: (mode?: RightPanelMode) => void;
|
|
close: () => void;
|
|
reset: () => void;
|
|
}
|
|
|
|
export type RightPanelStateController = RightPanelState & RightPanelStateActions;
|
|
|
|
const DEFAULT_MODE: RightPanelMode = "view";
|
|
const DEFAULT_VISIBILITY: RightPanelVisibility = "hidden";
|
|
|
|
export const useRightPanelState = (
|
|
options: RightPanelStateOptions = {}
|
|
): RightPanelStateController => {
|
|
const { defaultMode = DEFAULT_MODE, defaultVisibility = DEFAULT_VISIBILITY } = options;
|
|
|
|
const [mode, setMode] = useState<RightPanelMode>(defaultMode);
|
|
const [visibility, setVisibility] = useState<RightPanelVisibility>(defaultVisibility);
|
|
|
|
const isOpen = visibility === "visible";
|
|
|
|
const open = useCallback((nextMode: RightPanelMode = DEFAULT_MODE) => {
|
|
setMode(nextMode);
|
|
setVisibility("visible");
|
|
}, []);
|
|
|
|
const close = useCallback(() => {
|
|
setVisibility("hidden");
|
|
}, []);
|
|
|
|
const onOpenChange = useCallback((open: boolean) => {
|
|
setVisibility(open ? "visible" : "hidden");
|
|
}, []);
|
|
|
|
const reset = useCallback(() => {
|
|
setMode(defaultMode);
|
|
setVisibility(defaultVisibility);
|
|
}, [defaultMode, defaultVisibility]);
|
|
|
|
return {
|
|
mode,
|
|
visibility,
|
|
isOpen,
|
|
open,
|
|
close,
|
|
onOpenChange,
|
|
reset,
|
|
};
|
|
};
|