refactor: return types for hooks
This commit is contained in:
@ -8,7 +8,16 @@ import { getStatusId, isStatusId } from "@/app/deals/utils/statusId";
|
|||||||
import { DealSchema, StatusSchema } from "@/lib/client";
|
import { DealSchema, StatusSchema } from "@/lib/client";
|
||||||
import { sortByLexorank } from "@/utils/lexorank";
|
import { sortByLexorank } from "@/utils/lexorank";
|
||||||
|
|
||||||
const useDealsAndStatusesDnd = () => {
|
type ReturnType = {
|
||||||
|
sortedStatuses: StatusSchema[];
|
||||||
|
handleDragStart: ({ active }: DragStartEvent) => void;
|
||||||
|
handleDragOver: ({ active, over }: DragOverEvent) => void;
|
||||||
|
handleDragEnd: ({ active, over }: DragOverEvent) => void;
|
||||||
|
activeStatus: StatusSchema | null;
|
||||||
|
activeDeal: DealSchema | null;
|
||||||
|
};
|
||||||
|
|
||||||
|
const useDealsAndStatusesDnd = (): ReturnType => {
|
||||||
const [activeDeal, setActiveDeal] = useState<DealSchema | null>(null);
|
const [activeDeal, setActiveDeal] = useState<DealSchema | null>(null);
|
||||||
const [activeStatus, setActiveStatus] = useState<StatusSchema | null>(null);
|
const [activeStatus, setActiveStatus] = useState<StatusSchema | null>(null);
|
||||||
const { statuses, setStatuses, updateStatus } = useStatusesContext();
|
const { statuses, setStatuses, updateStatus } = useStatusesContext();
|
||||||
|
|||||||
@ -3,14 +3,30 @@ import { useStatusesContext } from "@/app/deals/contexts/StatusesContext";
|
|||||||
import { DealSchema } from "@/lib/client";
|
import { DealSchema } from "@/lib/client";
|
||||||
import { getNewLexorank, sortByLexorank } from "@/utils/lexorank";
|
import { getNewLexorank, sortByLexorank } from "@/utils/lexorank";
|
||||||
|
|
||||||
const useGetNewRank = () => {
|
type NewRankGetters = {
|
||||||
|
getNewRankForSameStatus: (
|
||||||
|
statusDeals: DealSchema[],
|
||||||
|
overDealIndex: number,
|
||||||
|
activeDealId: number
|
||||||
|
) => string;
|
||||||
|
getNewRankForAnotherStatus: (
|
||||||
|
statusDeals: DealSchema[],
|
||||||
|
overDealIndex: number
|
||||||
|
) => string;
|
||||||
|
getNewStatusRank: (
|
||||||
|
activeStatusId: number,
|
||||||
|
overStatusId: number
|
||||||
|
) => string | null;
|
||||||
|
};
|
||||||
|
|
||||||
|
const useGetNewRank = (): NewRankGetters => {
|
||||||
const { statuses } = useStatusesContext();
|
const { statuses } = useStatusesContext();
|
||||||
|
|
||||||
const getNewRankForSameStatus = (
|
const getNewRankForSameStatus = (
|
||||||
statusDeals: DealSchema[],
|
statusDeals: DealSchema[],
|
||||||
overDealIndex: number,
|
overDealIndex: number,
|
||||||
activeDealId: number
|
activeDealId: number
|
||||||
) => {
|
): string => {
|
||||||
const activeDealIndex = statusDeals.findIndex(
|
const activeDealIndex = statusDeals.findIndex(
|
||||||
deal => deal.id === activeDealId
|
deal => deal.id === activeDealId
|
||||||
);
|
);
|
||||||
@ -34,7 +50,7 @@ const useGetNewRank = () => {
|
|||||||
const getNewRankForAnotherStatus = (
|
const getNewRankForAnotherStatus = (
|
||||||
statusDeals: DealSchema[],
|
statusDeals: DealSchema[],
|
||||||
overDealIndex: number
|
overDealIndex: number
|
||||||
) => {
|
): string => {
|
||||||
const leftLexorank =
|
const leftLexorank =
|
||||||
overDealIndex > 0
|
overDealIndex > 0
|
||||||
? LexoRank.parse(statusDeals[overDealIndex - 1].lexorank)
|
? LexoRank.parse(statusDeals[overDealIndex - 1].lexorank)
|
||||||
@ -46,7 +62,10 @@ const useGetNewRank = () => {
|
|||||||
return getNewLexorank(leftLexorank, rightLexorank).toString();
|
return getNewLexorank(leftLexorank, rightLexorank).toString();
|
||||||
};
|
};
|
||||||
|
|
||||||
const getNewStatusRank = (activeStatusId: number, overStatusId: number) => {
|
const getNewStatusRank = (
|
||||||
|
activeStatusId: number,
|
||||||
|
overStatusId: number
|
||||||
|
): string | null => {
|
||||||
const sortedStatusList = sortByLexorank(statuses);
|
const sortedStatusList = sortByLexorank(statuses);
|
||||||
const overIndex = sortedStatusList.findIndex(
|
const overIndex = sortedStatusList.findIndex(
|
||||||
s => s.id === overStatusId
|
s => s.id === overStatusId
|
||||||
|
|||||||
@ -24,12 +24,18 @@ type UseBoardsOperationsProps = {
|
|||||||
projectId?: number;
|
projectId?: number;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
type BoardsOperations = {
|
||||||
|
onCreateBoard: (name: string) => void;
|
||||||
|
onUpdateBoard: (boardId: number, board: UpdateBoardSchema) => void;
|
||||||
|
onDeleteBoard: (board: BoardSchema) => void;
|
||||||
|
};
|
||||||
|
|
||||||
export const useBoardsOperations = ({
|
export const useBoardsOperations = ({
|
||||||
boards,
|
boards,
|
||||||
setBoards,
|
setBoards,
|
||||||
refetchBoards,
|
refetchBoards,
|
||||||
projectId,
|
projectId,
|
||||||
}: UseBoardsOperationsProps) => {
|
}: UseBoardsOperationsProps): BoardsOperations => {
|
||||||
const onError = (error: AxiosError<HttpValidationError>) => {
|
const onError = (error: AxiosError<HttpValidationError>) => {
|
||||||
console.error(error);
|
console.error(error);
|
||||||
notifications.error({
|
notifications.error({
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
import { useMediaQuery } from "@mantine/hooks";
|
import { useMediaQuery } from "@mantine/hooks";
|
||||||
|
|
||||||
const useIsMobile = () => {
|
const useIsMobile = (): boolean => {
|
||||||
return useMediaQuery("(max-width: 48em)");
|
return useMediaQuery("(max-width: 48em)");
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@ -21,11 +21,17 @@ type Props = {
|
|||||||
refetchProjects: () => void;
|
refetchProjects: () => void;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
type ProjectsOperations = {
|
||||||
|
onCreateProject: (name: string) => void;
|
||||||
|
onUpdateProject: (projectId: number, project: UpdateProjectSchema) => void;
|
||||||
|
onDeleteProject: (project: ProjectSchema) => void;
|
||||||
|
};
|
||||||
|
|
||||||
export const useProjectsOperations = ({
|
export const useProjectsOperations = ({
|
||||||
projects,
|
projects,
|
||||||
setProjects,
|
setProjects,
|
||||||
refetchProjects,
|
refetchProjects,
|
||||||
}: Props) => {
|
}: Props): ProjectsOperations => {
|
||||||
const onError = (error: AxiosError<HttpValidationError>) => {
|
const onError = (error: AxiosError<HttpValidationError>) => {
|
||||||
console.error(error);
|
console.error(error);
|
||||||
notifications.error({
|
notifications.error({
|
||||||
|
|||||||
@ -24,12 +24,18 @@ type Props = {
|
|||||||
boardId?: number;
|
boardId?: number;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
type StatusesOperations = {
|
||||||
|
onCreateStatus: (name: string) => void;
|
||||||
|
onUpdateStatus: (statusId: number, status: UpdateStatusSchema) => void;
|
||||||
|
onDeleteStatus: (status: StatusSchema) => void;
|
||||||
|
};
|
||||||
|
|
||||||
export const useStatusesOperations = ({
|
export const useStatusesOperations = ({
|
||||||
statuses,
|
statuses,
|
||||||
setStatuses,
|
setStatuses,
|
||||||
refetchStatuses,
|
refetchStatuses,
|
||||||
boardId,
|
boardId,
|
||||||
}: Props) => {
|
}: Props): StatusesOperations => {
|
||||||
const onError = (error: AxiosError<HttpValidationError>) => {
|
const onError = (error: AxiosError<HttpValidationError>) => {
|
||||||
console.error(error);
|
console.error(error);
|
||||||
notifications.error({
|
notifications.error({
|
||||||
|
|||||||
@ -10,7 +10,7 @@ type Props = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
type FormType = {
|
type FormType = {
|
||||||
name?: string;
|
name: string;
|
||||||
};
|
};
|
||||||
|
|
||||||
const EnterNameModal = ({
|
const EnterNameModal = ({
|
||||||
@ -28,7 +28,7 @@ const EnterNameModal = ({
|
|||||||
});
|
});
|
||||||
|
|
||||||
const onSubmit = (values: FormType) => {
|
const onSubmit = (values: FormType) => {
|
||||||
innerProps.onComplete(values.name!);
|
innerProps.onComplete(values.name);
|
||||||
context.closeModal(id);
|
context.closeModal(id);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user