121 lines
3.7 KiB
TypeScript
121 lines
3.7 KiB
TypeScript
import { useQueryClient } from "@tanstack/react-query";
|
|
import { useState } from "react";
|
|
import { useParams } from "react-router";
|
|
import {
|
|
type BrokerageOperation,
|
|
type OperationCategory,
|
|
useBrokerageOperations,
|
|
} from "@/entities/broker-operation";
|
|
import { apiQueryClient } from "@/shared/api";
|
|
|
|
type AccountOperationsPageViewModel =
|
|
| { state: "loading" }
|
|
| { state: "error"; retry: () => void }
|
|
| {
|
|
state: "loaded";
|
|
draftFrom: string | null;
|
|
draftTo: string | null;
|
|
draftCategories: OperationCategory[];
|
|
items: BrokerageOperation[];
|
|
hasNext: boolean;
|
|
hasPrevious: boolean;
|
|
canApply: boolean;
|
|
onDraftFromChange: (value: string | null) => void;
|
|
onDraftToChange: (value: string | null) => void;
|
|
onDraftCategoriesChange: (value: OperationCategory[]) => void;
|
|
onApply: () => void;
|
|
onReset: () => void;
|
|
onNext: () => void;
|
|
onPrevious: () => void;
|
|
};
|
|
|
|
const useAccountOperationsPageVm = (): AccountOperationsPageViewModel => {
|
|
const { accountId } = useParams();
|
|
const queryClient = useQueryClient();
|
|
const [appliedFrom, setAppliedFrom] = useState<string | null>(null);
|
|
const [appliedTo, setAppliedTo] = useState<string | null>(null);
|
|
const [appliedCategories, setAppliedCategories] = useState<
|
|
OperationCategory[]
|
|
>([]);
|
|
const [draftFrom, setDraftFrom] = useState<string | null>(null);
|
|
const [draftTo, setDraftTo] = useState<string | null>(null);
|
|
const [draftCategories, setDraftCategories] = useState<OperationCategory[]>(
|
|
[],
|
|
);
|
|
const [cursors, setCursors] = useState<string[]>([]);
|
|
const cursor = cursors.at(-1);
|
|
const operations = useBrokerageOperations(accountId, {
|
|
from: dateStart(appliedFrom),
|
|
to: dateEnd(appliedTo),
|
|
...(appliedCategories.length ? { categories: appliedCategories } : {}),
|
|
...(cursor ? { cursor } : {}),
|
|
limit: 100,
|
|
});
|
|
const resetQueryKey = apiQueryClient.queryOptions(
|
|
"get",
|
|
"/api/v1/brokerage-accounts/{accountId}/operations",
|
|
{ params: { path: { accountId: accountId ?? "" }, query: { limit: 100 } } },
|
|
).queryKey;
|
|
|
|
const resetCursors = () => setCursors([]);
|
|
|
|
if (operations.isLoading) return { state: "loading" };
|
|
if (operations.isError)
|
|
return { state: "error", retry: () => operations.refetch() };
|
|
if (!operations.data) return { state: "loading" };
|
|
const nextCursor = operations.data.nextCursor;
|
|
|
|
const isDirty =
|
|
draftFrom !== appliedFrom ||
|
|
draftTo !== appliedTo ||
|
|
!sameCategories(draftCategories, appliedCategories);
|
|
|
|
return {
|
|
state: "loaded",
|
|
draftFrom,
|
|
draftTo,
|
|
draftCategories,
|
|
items: operations.data.items,
|
|
hasNext: Boolean(operations.data.hasNext && nextCursor),
|
|
hasPrevious: Boolean(cursors.length),
|
|
canApply: isDirty,
|
|
onDraftFromChange: setDraftFrom,
|
|
onDraftToChange: setDraftTo,
|
|
onDraftCategoriesChange: setDraftCategories,
|
|
onApply: () => {
|
|
setAppliedFrom(draftFrom);
|
|
setAppliedTo(draftTo);
|
|
setAppliedCategories(draftCategories);
|
|
resetCursors();
|
|
},
|
|
onReset: () => {
|
|
setDraftFrom(null);
|
|
setDraftTo(null);
|
|
setDraftCategories([]);
|
|
setAppliedFrom(null);
|
|
setAppliedTo(null);
|
|
setAppliedCategories([]);
|
|
resetCursors();
|
|
void queryClient.invalidateQueries({ queryKey: resetQueryKey });
|
|
},
|
|
onNext: () => {
|
|
if (nextCursor) setCursors((value) => [...value, nextCursor]);
|
|
},
|
|
onPrevious: () => setCursors((value) => value.slice(0, -1)),
|
|
};
|
|
};
|
|
|
|
function dateStart(value: string | null) {
|
|
return value ? `${value}T00:00:00.000Z` : undefined;
|
|
}
|
|
|
|
function dateEnd(value: string | null) {
|
|
return value ? `${value}T23:59:59.999Z` : undefined;
|
|
}
|
|
|
|
function sameCategories(a: OperationCategory[], b: OperationCategory[]) {
|
|
return a.length === b.length && a.every((value) => b.includes(value));
|
|
}
|
|
|
|
export { type AccountOperationsPageViewModel, useAccountOperationsPageVm };
|