From f9818cbbbd574f353fd231a4d8b5334a8058ce27 Mon Sep 17 00:00:00 2001
From: jarvis2f <137974272+jarvis2f@users.noreply.github.com>
Date: Fri, 27 Dec 2024 15:32:31 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat:=20Refactored=20file=20list=20?=
 =?UTF-8?q?to=20use=20local=20storage=20to=20preserve=20row=20height=20and?=
 =?UTF-8?q?=20filter=20settings.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/components/file-list.tsx | 9 +++++----
 web/src/hooks/use-files.ts       | 6 +++++-
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/web/src/components/file-list.tsx b/web/src/components/file-list.tsx
index 5ef1231..756a744 100644
--- a/web/src/components/file-list.tsx
+++ b/web/src/components/file-list.tsx
@@ -31,7 +31,7 @@ import { useFiles } from "@/hooks/use-files";
 import { FileFilters } from "@/components/file-filters";
 import {
   getRowHeightTailwindClass,
-  type RowHeight,
+  useRowHeightLocalStorage,
 } from "@/components/table-row-height-switch";
 import { type Column } from "@/components/table-column-filter";
 import { cn } from "@/lib/utils";
@@ -106,9 +106,10 @@ export function FileList({ accountId, chatId }: FileListProps) {
   const [selectedFiles, setSelectedFiles] = useState<Set<number>>(new Set());
   const observerTarget = useRef(null);
   const [columns, setColumns] = useState<Column[]>(COLUMNS);
-  // const [rowHeight, setRowHeight] = useRowHeightLocalStorage("fileList", "m");
-  const [rowHeight, setRowHeight] = useState<RowHeight>("m");
-
+  const [rowHeight, setRowHeight] = useRowHeightLocalStorage(
+    "telegramFileList",
+    "m",
+  );
   const { filters, handleFilterChange, isLoading, files, handleLoadMore } =
     useFiles(accountId, chatId);
 
diff --git a/web/src/hooks/use-files.ts b/web/src/hooks/use-files.ts
index 6816cf6..61e0616 100644
--- a/web/src/hooks/use-files.ts
+++ b/web/src/hooks/use-files.ts
@@ -7,6 +7,7 @@ import {
 import useSWRInfinite from "swr/infinite";
 import { useWebsocket } from "@/hooks/use-websocket";
 import { WebSocketMessageType } from "@/lib/websocket-types";
+import useLocalStorage from "@/hooks/use-local-storage";
 
 const DEFAULT_FILTERS: FileFilter = {
   search: "",
@@ -31,7 +32,10 @@ export function useFiles(accountId: string, chatId: string) {
       }
     >
   >({});
-  const [filters, setFilters] = useState<FileFilter>(DEFAULT_FILTERS);
+  const [filters, setFilters, clearFilters] = useLocalStorage<FileFilter>(
+    "telegramFileListFilter",
+    DEFAULT_FILTERS,
+  );
   const getKey = (page: number, previousPageData: FileResponse) => {
     if (page === 0) {
       return `/telegram/${accountId}/chat/${chatId}/files?search=${filters.search}&type=${filters.type}&status=${filters.status}`;