59 lines
1.3 KiB
TypeScript
59 lines
1.3 KiB
TypeScript
"use client";
|
|
|
|
import React, {
|
|
createContext,
|
|
ReactNode,
|
|
useCallback,
|
|
useContext,
|
|
useState,
|
|
} from "react";
|
|
|
|
import { FullScreenBlurModal } from "@/components/ui";
|
|
|
|
interface FullScreenModalContextType {
|
|
openModal: (content: React.ReactNode) => void;
|
|
closeModal: () => void;
|
|
isOpen: boolean;
|
|
}
|
|
|
|
const FullScreenModalContext = createContext<
|
|
FullScreenModalContextType | undefined
|
|
>(undefined);
|
|
|
|
export const useFullScreenModal = () => {
|
|
const context = useContext(FullScreenModalContext);
|
|
if (!context) {
|
|
throw new Error(
|
|
"useFullScreenModal must be used within FullScreenModalProvider"
|
|
);
|
|
}
|
|
return context;
|
|
};
|
|
|
|
interface FullScreenModalProviderProps {
|
|
children: ReactNode;
|
|
}
|
|
|
|
export const FullScreenModalProvider = ({
|
|
children,
|
|
}: FullScreenModalProviderProps) => {
|
|
const [isOpen, setIsOpen] = useState(false);
|
|
const [content, setContent] = useState<React.ReactNode>(null);
|
|
|
|
const openModal = useCallback((modalContent: React.ReactNode) => {
|
|
setContent(modalContent);
|
|
setIsOpen(true);
|
|
}, []);
|
|
|
|
const closeModal = useCallback(() => {
|
|
setIsOpen(false);
|
|
}, []);
|
|
|
|
return (
|
|
<FullScreenModalContext.Provider value={{ openModal, closeModal, isOpen }}>
|
|
{children}
|
|
<FullScreenBlurModal isOpen={isOpen}>{content}</FullScreenBlurModal>
|
|
</FullScreenModalContext.Provider>
|
|
);
|
|
};
|