Merge pull request #2290 from Agenta-AI/AGE-1342/-auto-refresh-observ…

…ability-tables

(frontend)[AGE-1342]: Auto-refresh observability tables

agenta-web/src/components/pages/observability/ObservabilityDashboard.tsx

@@ -16,7 +16,7 @@ import {formatCurrency, formatLatency, formatTokenUsage} from "@/lib/helpers/for
 import {getNodeById} from "@/lib/helpers/observability_helpers"
 import {Filter, FilterConditions, JSSTheme} from "@/lib/Types"
 import {_AgentaRootsResponse} from "@/services/observability/types"
-import {SwapOutlined} from "@ant-design/icons"
+import {ReloadOutlined, SwapOutlined} from "@ant-design/icons"
 import {
     Button,
     Input,
@@ -71,6 +71,7 @@ const ObservabilityDashboard = () => {
         setSort,
         pagination,
         setPagination,
+        fetchTraces,
     } = useObservabilityData()
     const appId = useAppId()
     const router = useRouter()
@@ -250,6 +251,12 @@ const ObservabilityDashboard = () => {
         }
     }, [activeTrace, selected])
 
+    useEffect(() => {
+        const interval = setInterval(fetchTraces, 300000)
+
+        return () => clearInterval(interval)
+    }, [])
+
     const selectedItem = useMemo(
         () => (traces?.length ? getNodeById(traces, selected) : null),
         [selected, traces],
@@ -480,6 +487,14 @@ const ObservabilityDashboard = () => {
 
             <div className="flex justify-between gap-2 flex-col 2xl:flex-row 2xl:items-center">
                 <Space>
+                    <Button
+                        icon={<ReloadOutlined />}
+                        onClick={() => {
+                            fetchTraces()
+                        }}
+                    >
+                        Reload
+                    </Button>
                     <Input.Search
                         placeholder="Search"
                         value={searchQuery}