refactor: remove redundant page view models

src/pages/account-operations/ui/AccountOperationsPage/AccountOperationsPage.vm.ts

@@ -13,22 +13,22 @@ import { useScreenSync } from "@/features/tbank-connection";
 import { ApiErrorCode, apiErrorCode, isApiErrorCode } from "@/shared/api";
 import { isValidPeriod } from "@/shared/lib";
 
+const operationCategorySet = new Set<string>(operationCategories);
+
 type AccountOperationsPageViewModel
 	= | {
 		canApply: boolean;
 		draftCategories: OperationCategory[];
-		draftFrom: null | string;
-		draftTo: null | string;
+		draftPeriod: [null | string, null | string];
 		hasNext: boolean;
 		hasPrevious: boolean;
 		historyLoading?: boolean;
 		items: BrokerageOperation[];
 		lastSuccessfulAt?: null | string;
 		onApply: () => void;
-		onDraftCategoriesChange: (value: OperationCategory[]) => void;
-		onDraftFromChange: (value: null | string) => void;
-		onDraftToChange: (value: null | string) => void;
+		onCategoriesChange: (value: string[]) => void;
 		onNext: () => void;
+		onPeriodChange: (value: [null | string, null | string]) => void;
 		onPrevious: () => void;
 		onReset: () => void;
 		partial?: boolean;
@@ -64,8 +64,12 @@ const useAccountOperationsPageVm = (
 		(searchParameters.get("categories") ?? "").split(",").includes(category),
 	);
 
-	const [draftFrom, setDraftFrom] = useState<null | string>(appliedFrom);
-	const [draftTo, setDraftTo] = useState<null | string>(appliedTo);
+	const [draftPeriod, setDraftPeriod] = useState<[
+		null | string,
+		null | string,
+	]>([appliedFrom, appliedTo]);
+
+	const [draftFrom, draftTo] = draftPeriod;
 
 	const [draftCategories, setDraftCategories]
 		= useState<OperationCategory[]>(appliedCategories);
@@ -100,15 +104,8 @@ const useAccountOperationsPageVm = (
 
 	if (previousSearch !== searchParameters) {
 		setPreviousSearch(searchParameters);
-		setDraftFrom(appliedFrom);
-		setDraftTo(appliedTo);
-		setDraftCategories(
-			operationCategories.filter(category =>
-				(searchParameters.get("categories") ?? "")
-					.split(",")
-					.includes(category),
-			),
-		);
+		setDraftPeriod([appliedFrom, appliedTo]);
+		setDraftCategories(appliedCategories);
 	}
 
 	const firstPageQuery = {
@@ -154,8 +151,7 @@ const useAccountOperationsPageVm = (
 	};
 
 	const onReset = () => {
-		setDraftFrom(null);
-		setDraftTo(null);
+		setDraftPeriod([null, null]);
 		setDraftCategories([]);
 		setSearchParameters({});
 		resetCursors();
@@ -182,8 +178,7 @@ const useAccountOperationsPageVm = (
 	return {
 		canApply: isDirty && isValidPeriod(draftFrom, draftTo),
 		draftCategories,
-		draftFrom,
-		draftTo,
+		draftPeriod,
 		hasNext: Boolean(nextCursor && operations.data.hasNext),
 		hasPrevious: cursors.length > 0,
 		historyLoading:
@@ -202,13 +197,16 @@ const useAccountOperationsPageVm = (
 			});
 			resetCursors();
 		},
-		onDraftCategoriesChange: setDraftCategories,
-		onDraftFromChange: setDraftFrom,
-		onDraftToChange: setDraftTo,
+		onCategoriesChange: values => setDraftCategories(
+			values.filter((value): value is OperationCategory =>
+				operationCategorySet.has(value),
+			),
+		),
 		onNext: () => {
 			if (nextCursor)
 				setPagination({ cursors: [...cursors, nextCursor], scopeKey });
 		},
+		onPeriodChange: setDraftPeriod,
 		onPrevious: () =>
 			setPagination({ cursors: cursors.slice(0, -1), scopeKey }),
 		onReset,