refactor alertContext

This commit is contained in:
anovazzi1 2023-02-27 14:17:07 -03:00
commit bf8d477815

View file

@ -3,101 +3,146 @@ import { alertDropdownItem } from "../alerts/alertDropDown";
var _ = require("lodash"); var _ = require("lodash");
type alertContextType= //types for alertContextType
{ type alertContextType = {
errorData: {title: string, list?: Array<string>}; errorData: { title: string; list?: Array<string> };
setErrorData:(newState:{title: string, list?: Array<string>})=>void; setErrorData: (newState: { title: string; list?: Array<string> }) => void;
errorOpen: boolean; errorOpen: boolean;
setErrorOpen:(newState:boolean)=>void; setErrorOpen: (newState: boolean) => void;
noticeData: {title: string, link?: string}; noticeData: { title: string; link?: string };
setNoticeData:(newState:{title: string, link?: string})=>void; setNoticeData: (newState: { title: string; link?: string }) => void;
noticeOpen: boolean; noticeOpen: boolean;
setNoticeOpen:(newState:boolean)=>void; setNoticeOpen: (newState: boolean) => void;
successData: {title: string}; successData: { title: string };
setSuccessData:(newState:{title: string})=>void; setSuccessData: (newState: { title: string }) => void;
successOpen: boolean; successOpen: boolean;
setSuccessOpen:(newState:boolean)=>void; setSuccessOpen: (newState: boolean) => void;
notificationCenter:boolean notificationCenter: boolean;
setNotificationCenter:(newState:boolean)=>void; setNotificationCenter: (newState: boolean) => void;
notificationList:Array<alertDropdownItem>; notificationList: Array<alertDropdownItem>;
pushNotificationList:(Object)=>void pushNotificationList: (Object) => void;
clearNotificationList:()=>void, clearNotificationList: () => void;
removeFromNotificationList:(index:number)=>void removeFromNotificationList: (index: number) => void;
} };
const initialValue= { //initial values to alertContextType
errorData: {title:"", list:[]}, const initialValue = {
setErrorData:()=>{}, errorData: { title: "", list: [] },
setErrorData: () => {},
errorOpen: false, errorOpen: false,
setErrorOpen:()=>{}, setErrorOpen: () => {},
noticeData: {title:"", link:""}, noticeData: { title: "", link: "" },
setNoticeData:()=>{}, setNoticeData: () => {},
noticeOpen: false, noticeOpen: false,
setNoticeOpen:()=>{}, setNoticeOpen: () => {},
successData: {title:""}, successData: { title: "" },
setSuccessData:()=>{}, setSuccessData: () => {},
successOpen: false, successOpen: false,
setSuccessOpen:()=>{}, setSuccessOpen: () => {},
notificationCenter:false, notificationCenter: false,
setNotificationCenter:()=>{}, setNotificationCenter: () => {},
notificationList:[], notificationList: [],
pushNotificationList:()=>{}, pushNotificationList: () => {},
clearNotificationList:()=>{}, clearNotificationList: () => {},
removeFromNotificationList:()=>{} removeFromNotificationList: () => {},
} };
export const alertContext = createContext<alertContextType>(initialValue); export const alertContext = createContext<alertContextType>(initialValue);
export function AlertProvider({children}){ export function AlertProvider({ children }) {
const [errorData, setErrorDataState] = useState<{title:string,list?:Array<string>}>({title:"",list:[]}); const [errorData, setErrorDataState] = useState<{
title: string;
list?: Array<string>;
}>({ title: "", list: [] });
const [errorOpen, setErrorOpen] = useState(false); const [errorOpen, setErrorOpen] = useState(false);
const [noticeData, setNoticeDataState] = useState<{title:string,link?:string}>({title:"",link:""}); const [noticeData, setNoticeDataState] = useState<{
title: string;
link?: string;
}>({ title: "", link: "" });
const [noticeOpen, setNoticeOpen] = useState(false); const [noticeOpen, setNoticeOpen] = useState(false);
const [successData, setSuccessDataState] = useState<{title:string}>({title:""}); const [successData, setSuccessDataState] = useState<{ title: string }>({
title: "",
});
const [successOpen, setSuccessOpen] = useState(false); const [successOpen, setSuccessOpen] = useState(false);
const [notificationCenter,setNotificationCenter]=useState(false); const [notificationCenter, setNotificationCenter] = useState(false);
const [notificationList,setNotificationList] = useState([]) const [notificationList, setNotificationList] = useState([]);
const pushNotificationList = (notification:alertDropdownItem)=>{ const pushNotificationList = (notification: alertDropdownItem) => {
setNotificationList((old) => { setNotificationList((old) => {
let newNotificationList = _.cloneDeep(old); let newNotificationList = _.cloneDeep(old);
newNotificationList.unshift(notification); newNotificationList.unshift(notification);
return newNotificationList; return newNotificationList;
}) });
} };
function setErrorData (newState:{title: string, list?: Array<string>}){ function setErrorData(newState: { title: string; list?: Array<string> }) {
setErrorDataState(newState) setErrorDataState(newState);
setErrorOpen(true) setErrorOpen(true);
if(newState.title){ if (newState.title) {
setNotificationCenter(true) setNotificationCenter(true);
pushNotificationList({type:"error",title:newState.title,list:newState.list, id:_.uniqueId()}) pushNotificationList({
type: "error",
title: newState.title,
list: newState.list,
id: _.uniqueId(),
});
} }
} }
function setNoticeData(newState:{title: string, link?: string}){ function setNoticeData(newState: { title: string; link?: string }) {
setNoticeDataState(newState) setNoticeDataState(newState);
setNoticeOpen(true) setNoticeOpen(true);
if(newState.title){ if (newState.title) {
setNotificationCenter(true) setNotificationCenter(true);
pushNotificationList({type:"notice",title:newState.title,link:newState.link, id:_.uniqueId()}) pushNotificationList({
type: "notice",
title: newState.title,
link: newState.link,
id: _.uniqueId(),
});
} }
} }
function setSuccessData(newState:{title: string}){ function setSuccessData(newState: { title: string }) {
setSuccessDataState(newState) setSuccessDataState(newState);
setSuccessOpen(true) setSuccessOpen(true);
if(newState.title){ if (newState.title) {
setNotificationCenter(true) setNotificationCenter(true);
pushNotificationList({type:"success",title:newState.title, id:_.uniqueId()}) pushNotificationList({
type: "success",
title: newState.title,
id: _.uniqueId(),
});
} }
} }
function clearNotificationList(){ function clearNotificationList() {
setNotificationList([]) setNotificationList([]);
} }
function removeFromNotificationList(index:number){ function removeFromNotificationList(index: number) {
setNotificationList((prevAlertsList) => prevAlertsList.filter((alert) => alert.id !== index)); setNotificationList((prevAlertsList) =>
prevAlertsList.filter((alert) => alert.id !== index)
);
} }
return ( return (
<alertContext.Provider value={{ removeFromNotificationList,clearNotificationList,notificationList,pushNotificationList,setNotificationCenter,notificationCenter,errorData, setErrorData, <alertContext.Provider
errorOpen,setErrorOpen, noticeData, setNoticeData, noticeOpen, setNoticeOpen, successData, setSuccessData, successOpen, setSuccessOpen}}> value={{
removeFromNotificationList,
clearNotificationList,
notificationList,
pushNotificationList,
setNotificationCenter,
notificationCenter,
errorData,
setErrorData,
errorOpen,
setErrorOpen,
noticeData,
setNoticeData,
noticeOpen,
setNoticeOpen,
successData,
setSuccessData,
successOpen,
setSuccessOpen,
}}
>
{children} {children}
</alertContext.Provider> </alertContext.Provider>
) );
} }