feat: context factory

This commit is contained in:
2025-08-26 16:11:40 +04:00
parent 5b5c2fe230
commit 31bd888357
7 changed files with 71 additions and 185 deletions

View File

@ -1,10 +1,11 @@
"use client";
import React, { createContext, FC, useContext, useState } from "react";
import React, { useState } from "react";
import { useProjectsContext } from "@/app/deals/contexts/ProjectsContext";
import { BoardSchema } from "@/lib/client";
import { BoardsCrud, useBoardsCrud } from "@/hooks/cruds/useBoardsCrud";
import useBoardsList from "@/hooks/lists/useBoardsList";
import { BoardSchema } from "@/lib/client";
import makeContext from "@/lib/contextFactory/contextFactory";
type BoardsContextState = {
boards: BoardSchema[];
@ -15,9 +16,7 @@ type BoardsContextState = {
boardsCrud: BoardsCrud;
};
const BoardsContext = createContext<BoardsContextState | undefined>(undefined);
const useBoardsContextState = () => {
const useBoardsContextState = (): BoardsContextState => {
const { selectedProject: project } = useProjectsContext();
const {
boards,
@ -50,28 +49,5 @@ const useBoardsContextState = () => {
};
};
type BoardsContextProviderProps = {
children: React.ReactNode;
};
export const BoardsContextProvider: FC<BoardsContextProviderProps> = ({
children,
}) => {
const state = useBoardsContextState();
return (
<BoardsContext.Provider value={state}>
{children}
</BoardsContext.Provider>
);
};
export const useBoardsContext = () => {
const context = useContext(BoardsContext);
if (!context) {
throw new Error(
"useBoardsContext must be used within a BoardsContextProvider"
);
}
return context;
};
export const [BoardsContextProvider, useBoardsContext] =
makeContext<BoardsContextState>(useBoardsContextState, "Boards");

View File

@ -1,11 +1,12 @@
"use client";
import React, { createContext, FC, useContext } from "react";
import React from "react";
import { useBoardsContext } from "@/app/deals/contexts/BoardsContext";
import { useStatusesContext } from "@/app/deals/contexts/StatusesContext";
import { DealsCrud, useDealsCrud } from "@/hooks/cruds/useDealsCrud";
import useDealsList from "@/hooks/lists/useDealsList";
import { DealSchema } from "@/lib/client";
import makeContext from "@/lib/contextFactory/contextFactory";
type DealsContextState = {
deals: DealSchema[];
@ -14,16 +15,16 @@ type DealsContextState = {
dealsCrud: DealsCrud;
};
const DealsContext = createContext<DealsContextState | undefined>(undefined);
const useDealsContextState = () => {
const useDealsContextState = (): DealsContextState => {
const { selectedBoard } = useBoardsContext();
const { statuses } = useStatusesContext();
const {
deals,
setDeals,
refetch: refetchDeals,
} = useDealsList({ boardId: selectedBoard?.id });
} = useDealsList({
boardId: selectedBoard?.id,
});
const dealsCrud = useDealsCrud({
deals,
@ -33,34 +34,8 @@ const useDealsContextState = () => {
statuses,
});
return {
deals,
setDeals,
refetchDeals,
dealsCrud,
};
return { deals, setDeals, refetchDeals, dealsCrud };
};
type DealsContextProviderProps = {
children: React.ReactNode;
};
export const DealsContextProvider: FC<DealsContextProviderProps> = ({
children,
}) => {
const state = useDealsContextState();
return (
<DealsContext.Provider value={state}>{children}</DealsContext.Provider>
);
};
export const useDealsContext = () => {
const context = useContext(DealsContext);
if (!context) {
throw new Error(
"useDealsContext must be used within a DealsContextProvider"
);
}
return context;
};
export const [DealsContextProvider, useDealsContext] =
makeContext<DealsContextState>(useDealsContextState, "Deals");

View File

@ -1,9 +1,10 @@
"use client";
import React, { createContext, FC, useContext, useState } from "react";
import React, { useState } from "react";
import { ProjectsCrud, useProjectsCrud } from "@/hooks/cruds/useProjectsCrud";
import useProjectsList from "@/hooks/lists/useProjectsList";
import { ProjectSchema } from "@/lib/client";
import makeContext from "@/lib/contextFactory/contextFactory";
type ProjectsContextState = {
selectedProject: ProjectSchema | null;
@ -13,11 +14,7 @@ type ProjectsContextState = {
projectsCrud: ProjectsCrud;
};
const ProjectsContext = createContext<ProjectsContextState | undefined>(
undefined
);
const useProjectsContextState = () => {
const useProjectsContextState = (): ProjectsContextState => {
const {
projects,
setProjects,
@ -49,28 +46,5 @@ const useProjectsContextState = () => {
};
};
type ProjectsContextProviderProps = {
children: React.ReactNode;
};
export const ProjectsContextProvider: FC<ProjectsContextProviderProps> = ({
children,
}) => {
const state = useProjectsContextState();
return (
<ProjectsContext.Provider value={state}>
{children}
</ProjectsContext.Provider>
);
};
export const useProjectsContext = () => {
const context = useContext(ProjectsContext);
if (!context) {
throw new Error(
"useProjectsContext must be used within a ProjectsContextProvider"
);
}
return context;
};
export const [ProjectsContextProvider, useProjectsContext] =
makeContext<ProjectsContextState>(useProjectsContextState, "Projects");

View File

@ -1,10 +1,11 @@
"use client";
import React, { createContext, FC, useContext } from "react";
import React from "react";
import { useBoardsContext } from "@/app/deals/contexts/BoardsContext";
import { StatusesCrud, useStatusesCrud } from "@/hooks/cruds/useStatusesCrud";
import useStatusesList from "@/hooks/lists/useStatusesList";
import { StatusSchema } from "@/lib/client";
import makeContext from "@/lib/contextFactory/contextFactory";
type StatusesContextState = {
statuses: StatusSchema[];
@ -13,11 +14,7 @@ type StatusesContextState = {
statusesCrud: StatusesCrud;
};
const StatusesContext = createContext<StatusesContextState | undefined>(
undefined
);
const useStatusesContextState = () => {
const useStatusesContextState = (): StatusesContextState => {
const { selectedBoard } = useBoardsContext();
const {
statuses,
@ -42,28 +39,5 @@ const useStatusesContextState = () => {
};
};
type StatusesContextProviderProps = {
children: React.ReactNode;
};
export const StatusesContextProvider: FC<StatusesContextProviderProps> = ({
children,
}) => {
const state = useStatusesContextState();
return (
<StatusesContext.Provider value={state}>
{children}
</StatusesContext.Provider>
);
};
export const useStatusesContext = () => {
const context = useContext(StatusesContext);
if (!context) {
throw new Error(
"useStatusesContext must be used within a StatusesContextProvider"
);
}
return context;
};
export const [StatusesContextProvider, useStatusesContext] =
makeContext<StatusesContextState>(useStatusesContextState, "Statuses");

View File

@ -1,9 +1,10 @@
"use client";
import React, { createContext, FC, useContext } from "react";
import React from "react";
import { StatusesCrud, useStatusesCrud } from "@/hooks/cruds/useStatusesCrud";
import useStatusesList from "@/hooks/lists/useStatusesList";
import { BoardSchema, StatusSchema } from "@/lib/client";
import makeContext from "@/lib/contextFactory/contextFactory";
type BoardStatusesContextState = {
board: BoardSchema;
@ -13,15 +14,13 @@ type BoardStatusesContextState = {
statusesCrud: StatusesCrud;
};
const BoardStatusesContext = createContext<
BoardStatusesContextState | undefined
>(undefined);
type Props = {
board: BoardSchema;
};
const useBoardStatusesContextState = ({ board }: Props) => {
const useBoardStatusesContextState = ({
board,
}: Props): BoardStatusesContextState => {
const {
statuses,
setStatuses,
@ -46,28 +45,8 @@ const useBoardStatusesContextState = ({ board }: Props) => {
};
};
type BoardStatusesContextProviderProps = {
children: React.ReactNode;
} & Props;
export const BoardStatusesContextProvider: FC<
BoardStatusesContextProviderProps
> = ({ children, ...props }) => {
const state = useBoardStatusesContextState(props);
return (
<BoardStatusesContext.Provider value={state}>
{children}
</BoardStatusesContext.Provider>
export const [BoardStatusesContextProvider, useBoardStatusesContext] =
makeContext<BoardStatusesContextState, Props>(
useBoardStatusesContextState,
"BoardStatuses"
);
};
export const useBoardStatusesContext = () => {
const context = useContext(BoardStatusesContext);
if (!context) {
throw new Error(
"useBoardStatusesContext must be used within a BoardStatusesContextProvider"
);
}
return context;
};

View File

@ -1,9 +1,10 @@
"use client";
import React, { createContext, FC, useContext } from "react";
import React from "react";
import { BoardsCrud, useBoardsCrud } from "@/hooks/cruds/useBoardsCrud";
import useBoardsList from "@/hooks/lists/useBoardsList";
import { BoardSchema, ProjectSchema } from "@/lib/client";
import makeContext from "@/lib/contextFactory/contextFactory";
type ProjectBoardsContextState = {
boards: BoardSchema[];
@ -13,10 +14,6 @@ type ProjectBoardsContextState = {
boardsCrud: BoardsCrud;
};
const ProjectBoardsContext = createContext<
ProjectBoardsContextState | undefined
>(undefined);
type Props = {
project: ProjectSchema;
};
@ -44,28 +41,8 @@ const useProjectBoardsContextState = ({ project }: Props) => {
};
};
type ProjectBoardsContextProviderProps = {
children: React.ReactNode;
} & Props;
export const ProjectBoardsContextProvider: FC<
ProjectBoardsContextProviderProps
> = ({ children, ...props }) => {
const state = useProjectBoardsContextState(props);
return (
<ProjectBoardsContext.Provider value={state}>
{children}
</ProjectBoardsContext.Provider>
export const [ProjectBoardsContextProvider, useProjectBoardsContext] =
makeContext<ProjectBoardsContextState, Props>(
useProjectBoardsContextState,
"ProjectBoards"
);
};
export const useProjectBoardsContext = () => {
const context = useContext(ProjectBoardsContext);
if (!context) {
throw new Error(
"useProjectBoardsContext must be used within a ProjectBoardsContextProvider"
);
}
return context;
};

View File

@ -0,0 +1,31 @@
"use client";
import React, { createContext, FC, PropsWithChildren, useContext } from "react";
export default function makeContext<State, HookArgs = {}>(
useValue: (args: HookArgs) => State,
displayName?: string
) {
const Context = createContext<State | undefined>(undefined);
Context.displayName = displayName ?? "Custom";
const Provider: FC<PropsWithChildren<HookArgs>> = ({
children,
...hookArgs
}) => {
const value = useValue(hookArgs as HookArgs);
return <Context.Provider value={value}>{children}</Context.Provider>;
};
const useContextHook = () => {
const context = useContext(Context);
if (!context) {
throw new Error(
`${Context.displayName}Context must be used within ${Context.displayName}ContextProvider`
);
}
return context;
};
return [Provider, useContextHook] as const;
}