44 lines
1.2 KiB
TypeScript
44 lines
1.2 KiB
TypeScript
import React, { createContext, useCallback, useContext, useMemo, useState } from 'react';
|
|
|
|
type HeaderState = {
|
|
title: React.ReactNode | null;
|
|
left: React.ReactNode | null;
|
|
mobileMenu: React.ReactNode | null;
|
|
};
|
|
|
|
type HeaderContextValue = {
|
|
header: HeaderState;
|
|
setHeader: (next: Partial<HeaderState>) => void;
|
|
resetHeader: () => void;
|
|
};
|
|
|
|
const DEFAULT_HEADER: HeaderState = {
|
|
title: null,
|
|
left: null,
|
|
mobileMenu: null,
|
|
};
|
|
|
|
const HeaderContext = createContext<HeaderContextValue | null>(null);
|
|
|
|
export const HeaderProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
|
|
const [header, setHeaderState] = useState<HeaderState>(DEFAULT_HEADER);
|
|
|
|
const setHeader = useCallback((next: Partial<HeaderState>) => {
|
|
setHeaderState((prev) => ({ ...prev, ...next }));
|
|
}, []);
|
|
|
|
const resetHeader = useCallback(() => {
|
|
setHeaderState(DEFAULT_HEADER);
|
|
}, []);
|
|
|
|
const value = useMemo(() => ({ header, setHeader, resetHeader }), [header, setHeader, resetHeader]);
|
|
|
|
return <HeaderContext.Provider value={value}>{children}</HeaderContext.Provider>;
|
|
};
|
|
|
|
export const useHeader = () => {
|
|
const ctx = useContext(HeaderContext);
|
|
if (!ctx) throw new Error('useHeader must be used within HeaderProvider');
|
|
return ctx;
|
|
};
|