From ca169dc8ab0b42f82c0cac552b72f731d7d90209 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Bonnet?= <bonnet.rem@gmail.com>
Date: Thu, 28 Nov 2024 16:05:56 +0100
Subject: [PATCH] fix(list-service-logs): filter by container and version first
 rendering (#1770)

* fix(list-service-logs): filter by container and version first rendering
---
 .../list-service-logs/list-service-logs.tsx   | 32 ++++++++-----------
 1 file changed, 14 insertions(+), 18 deletions(-)

diff --git a/libs/domains/service-logs/feature/src/lib/list-service-logs/list-service-logs.tsx b/libs/domains/service-logs/feature/src/lib/list-service-logs/list-service-logs.tsx
index 287d7ccd023..e6095772516 100644
--- a/libs/domains/service-logs/feature/src/lib/list-service-logs/list-service-logs.tsx
+++ b/libs/domains/service-logs/feature/src/lib/list-service-logs/list-service-logs.tsx
@@ -109,27 +109,23 @@ export function ListServiceLogs({ environment, clusterId, serviceStatus, environ
     [columnHelper, hasMultipleContainers]
   )
 
-  const columnFilters = useMemo(() => {
+  const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>(
+    searchParams.get('pod_name')
+      ? [
+          {
+            id: 'pod_name',
+            value: searchParams.get('pod_name'),
+          },
+        ]
+      : []
+  )
+
+  // Necessary with sidebar-pod-statuses to keep the filter in sync if you navigate from service logs page
+  useEffect(() => {
     const podName = searchParams.get('pod_name')
-    return podName ? [{ id: 'pod_name', value: podName }] : []
+    setColumnFilters(podName ? [{ id: 'pod_name', value: podName }] : [])
   }, [searchParams])
 
-  const setColumnFilters = useCallback(
-    (filterOrUpdater: ColumnFiltersState | ((prev: ColumnFiltersState) => ColumnFiltersState)) => {
-      const newFilters = typeof filterOrUpdater === 'function' ? filterOrUpdater(columnFilters) : filterOrUpdater
-
-      // Update searchParams based on the new filters
-      const podNameFilter = newFilters.find((f) => f.id === 'pod_name')
-      if (podNameFilter) {
-        searchParams.set('pod_name', podNameFilter.value as string)
-      } else {
-        searchParams.delete('pod_name')
-      }
-      setSearchParams(searchParams)
-    },
-    [searchParams, setSearchParams, columnFilters]
-  )
-
   const table = useReactTable({
     data: logs,
     state: { columnFilters },