From 52a231bc0a352816913449a90f515eaca18acae9 Mon Sep 17 00:00:00 2001
From: d-kimsuon <dev.kimuson@gmail.com>
Date: Sat, 6 Sep 2025 23:25:41 +0900
Subject: [PATCH] fix: bug fix session list doesn't updated after filter config
 changed

---
 .../[projectId]/components/ProjectPage.tsx    |  8 +----
 .../sessionSidebar/MobileSidebar.tsx          |  2 +-
 .../sessionSidebar/SessionSidebar.tsx         |  2 +-
 .../components/sessionSidebar/SettingsTab.tsx |  6 ++--
 src/components/SettingsControls.tsx           | 35 ++++++++++---------
 5 files changed, 25 insertions(+), 28 deletions(-)

diff --git a/src/app/projects/[projectId]/components/ProjectPage.tsx b/src/app/projects/[projectId]/components/ProjectPage.tsx
index 3cfa5ac..49619b5 100644
--- a/src/app/projects/[projectId]/components/ProjectPage.tsx
+++ b/src/app/projects/[projectId]/components/ProjectPage.tsx
@@ -45,12 +45,6 @@ export const ProjectPageContent = ({ projectId }: { projectId: string }) => {
     });
   }, [config.hideNoUserMessageSession, config.unifySameTitleSession]);
 
-  const handleConfigChange = () => {
-    void queryClient.invalidateQueries({
-      queryKey: projectQueryConfig(projectId).queryKey,
-    });
-  };
-
   return (
     <div className="container mx-auto px-2 sm:px-4 py-4 sm:py-8 max-w-6xl">
       <header className="mb-6 sm:mb-8">
@@ -118,7 +112,7 @@ export const ProjectPageContent = ({ projectId }: { projectId: string }) => {
               </CollapsibleTrigger>
               <CollapsibleContent>
                 <div className="p-4 bg-muted/50 rounded-lg border">
-                  <SettingsControls onConfigChange={handleConfigChange} />
+                  <SettingsControls openingProjectId={projectId} />
                 </div>
               </CollapsibleContent>
             </div>
diff --git a/src/app/projects/[projectId]/sessions/[sessionId]/components/sessionSidebar/MobileSidebar.tsx b/src/app/projects/[projectId]/sessions/[sessionId]/components/sessionSidebar/MobileSidebar.tsx
index 1576e76..803b0e8 100644
--- a/src/app/projects/[projectId]/sessions/[sessionId]/components/sessionSidebar/MobileSidebar.tsx
+++ b/src/app/projects/[projectId]/sessions/[sessionId]/components/sessionSidebar/MobileSidebar.tsx
@@ -79,7 +79,7 @@ export const MobileSidebar: FC<MobileSidebarProps> = ({
       case "mcp":
         return <McpTab />;
       case "settings":
-        return <SettingsTab />;
+        return <SettingsTab openingProjectId={projectId} />;
       default:
         return null;
     }
diff --git a/src/app/projects/[projectId]/sessions/[sessionId]/components/sessionSidebar/SessionSidebar.tsx b/src/app/projects/[projectId]/sessions/[sessionId]/components/sessionSidebar/SessionSidebar.tsx
index 47f191f..8a4dc76 100644
--- a/src/app/projects/[projectId]/sessions/[sessionId]/components/sessionSidebar/SessionSidebar.tsx
+++ b/src/app/projects/[projectId]/sessions/[sessionId]/components/sessionSidebar/SessionSidebar.tsx
@@ -54,7 +54,7 @@ export const SessionSidebar: FC<{
       case "mcp":
         return <McpTab />;
       case "settings":
-        return <SettingsTab />;
+        return <SettingsTab openingProjectId={projectId} />;
       default:
         return null;
     }
diff --git a/src/app/projects/[projectId]/sessions/[sessionId]/components/sessionSidebar/SettingsTab.tsx b/src/app/projects/[projectId]/sessions/[sessionId]/components/sessionSidebar/SettingsTab.tsx
index c4164c0..c18af76 100644
--- a/src/app/projects/[projectId]/sessions/[sessionId]/components/sessionSidebar/SettingsTab.tsx
+++ b/src/app/projects/[projectId]/sessions/[sessionId]/components/sessionSidebar/SettingsTab.tsx
@@ -3,7 +3,9 @@
 import type { FC } from "react";
 import { SettingsControls } from "@/components/SettingsControls";
 
-export const SettingsTab: FC = () => {
+export const SettingsTab: FC<{
+  openingProjectId: string;
+}> = ({ openingProjectId }) => {
   return (
     <div className="h-full flex flex-col">
       <div className="border-b border-sidebar-border p-4">
@@ -20,7 +22,7 @@ export const SettingsTab: FC = () => {
             Session Display
           </h3>
 
-          <SettingsControls />
+          <SettingsControls openingProjectId={openingProjectId} />
         </div>
       </div>
     </div>
diff --git a/src/components/SettingsControls.tsx b/src/components/SettingsControls.tsx
index 5d98756..4277e3d 100644
--- a/src/components/SettingsControls.tsx
+++ b/src/components/SettingsControls.tsx
@@ -1,40 +1,47 @@
 "use client";
 
 import { useQueryClient } from "@tanstack/react-query";
-import { type FC, useId } from "react";
+import { type FC, useCallback, useId } from "react";
 import { configQueryConfig, useConfig } from "@/app/hooks/useConfig";
 import { Checkbox } from "@/components/ui/checkbox";
+import { projectQueryConfig } from "../app/projects/[projectId]/hooks/useProject";
 
 interface SettingsControlsProps {
+  openingProjectId: string;
   showLabels?: boolean;
   showDescriptions?: boolean;
   className?: string;
-  onConfigChange?: () => void;
 }
 
 export const SettingsControls: FC<SettingsControlsProps> = ({
+  openingProjectId,
   showLabels = true,
   showDescriptions = true,
   className = "",
-  onConfigChange,
 }: SettingsControlsProps) => {
   const checkboxId = useId();
   const { config, updateConfig } = useConfig();
   const queryClient = useQueryClient();
 
+  const onConfigChanged = useCallback(async () => {
+    await queryClient.invalidateQueries({
+      queryKey: configQueryConfig.queryKey,
+    });
+    await queryClient.invalidateQueries({
+      queryKey: ["projects"],
+    });
+    void queryClient.invalidateQueries({
+      queryKey: projectQueryConfig(openingProjectId).queryKey,
+    });
+  }, [queryClient, openingProjectId]);
+
   const handleHideNoUserMessageChange = async () => {
     const newConfig = {
       ...config,
       hideNoUserMessageSession: !config?.hideNoUserMessageSession,
     };
     updateConfig(newConfig);
-    await queryClient.invalidateQueries({
-      queryKey: configQueryConfig.queryKey,
-    });
-    await queryClient.invalidateQueries({
-      queryKey: ["projects"],
-    });
-    onConfigChange?.();
+    await onConfigChanged();
   };
 
   const handleUnifySameTitleChange = async () => {
@@ -43,13 +50,7 @@ export const SettingsControls: FC<SettingsControlsProps> = ({
       unifySameTitleSession: !config?.unifySameTitleSession,
     };
     updateConfig(newConfig);
-    await queryClient.invalidateQueries({
-      queryKey: configQueryConfig.queryKey,
-    });
-    await queryClient.invalidateQueries({
-      queryKey: ["projects"],
-    });
-    onConfigChange?.();
+    await onConfigChanged();
   };
 
   return (