refactor popUpContext
This commit is contained in:
parent
8ea68be22b
commit
d54da3b878
1 changed files with 19 additions and 18 deletions
|
|
@ -1,32 +1,33 @@
|
||||||
import { createContext } from "react";
|
import { createContext } from "react";
|
||||||
import React, { useState } from 'react';
|
import React, { useState } from "react";
|
||||||
|
|
||||||
|
//context to set JSX element on the DOM
|
||||||
export const PopUpContext = createContext({
|
export const PopUpContext = createContext({
|
||||||
openPopUp: (popUpElement: JSX.Element) => {},
|
openPopUp: (popUpElement: JSX.Element) => {},
|
||||||
closePopUp: () => {}
|
closePopUp: () => {},
|
||||||
});
|
});
|
||||||
|
|
||||||
interface PopUpProviderProps {
|
interface PopUpProviderProps {
|
||||||
children: React.ReactNode;
|
children: React.ReactNode;
|
||||||
}
|
}
|
||||||
|
|
||||||
const PopUpProvider = ({ children }: PopUpProviderProps) => {
|
const PopUpProvider = ({ children }: PopUpProviderProps) => {
|
||||||
const [popUpElement, setPopUpElement] = useState<JSX.Element | null>(null);
|
const [popUpElement, setPopUpElement] = useState<JSX.Element | null>(null);
|
||||||
|
|
||||||
const openPopUp = (element: JSX.Element) => {
|
const openPopUp = (element: JSX.Element) => {
|
||||||
setPopUpElement(element);
|
setPopUpElement(element);
|
||||||
};
|
};
|
||||||
|
|
||||||
const closePopUp = () => {
|
const closePopUp = () => {
|
||||||
setPopUpElement(null);
|
setPopUpElement(null);
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<PopUpContext.Provider value={{ openPopUp, closePopUp }}>
|
<PopUpContext.Provider value={{ openPopUp, closePopUp }}>
|
||||||
{children}
|
{children}
|
||||||
{popUpElement}
|
{popUpElement}
|
||||||
</PopUpContext.Provider>
|
</PopUpContext.Provider>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default PopUpProvider;
|
export default PopUpProvider;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue