feat: implement pod index synchronization and optimize pod retrieval by node

Author: iwanhae

src/backgrounds/kuview.tsx

@@ -5,6 +5,7 @@ import {
   useGVKSyncHook,
   useKubernetesAtomSyncHook,
   useServiceEndpointSliceSyncHook,
+  usePodIndexSyncHook,
 } from "@/lib/kuviewAtom";
 
 import { useAtomValue } from "jotai";
@@ -60,6 +61,7 @@ export default function KuviewBackground() {
 
 function SyncKubernetes() {
   useKubernetesAtomSyncHook();
+  usePodIndexSyncHook(); // Added for Pod index synchronization
   const kubernetes = useAtomValue(kubernetesAtom);
   const gvks = Object.keys(kubernetes);
   const normalGVKs = gvks.filter(

src/components/block/node-detail.tsx

@@ -14,7 +14,7 @@ import { getStatusColor, getStatus } from "@/lib/status";
 import NodeResourceUsage from "./node-resource-usage";
 import PodsGrid from "./pods-grid";
 import NodePodList from "./node-pod-list";
-import { useKuview } from "@/hooks/useKuview";
+import { usePodsByNode } from "@/hooks/usePodsByNode";
 import PodsVolumeList from "./pods-volume-list";
 
 interface NodeDetailProps {
@@ -24,12 +24,9 @@ interface NodeDetailProps {
 
 export default function NodeDetail({ node, className }: NodeDetailProps) {
   const [jsonExpanded, setJsonExpanded] = useState(false);
-  const podsData = useKuview("v1/Pod");
 
-  // Filter pods that belong to the selected node
-  const nodePods = Object.values(podsData).filter(
-    (pod) => pod.spec.nodeName === node.metadata.name,
-  );
+  // Use optimized hook to get pods for this node
+  const nodePods = usePodsByNode(node.metadata.name);
 
   return (
     <div className={cn("space-y-6", className)}>

src/hooks/usePodsByNode.ts

@@ -0,0 +1,19 @@
+import { useAtomValue } from "jotai";
+import { podsByNodeNameIndexAtom } from "@/lib/kuviewAtom";
+import { useMemo } from "react";
+import type { PodObject } from "@/lib/kuview";
+import { useKuview } from "@/hooks/useKuview";
+
+export function usePodsByNode(nodeName: string | undefined): PodObject[] {
+  const allPods = useKuview("v1/Pod");
+  const podsByNodeIndex = useAtomValue(podsByNodeNameIndexAtom);
+
+  return useMemo(() => {
+    if (!nodeName || !podsByNodeIndex[nodeName]) {
+      return [];
+    }
+
+    const podKeys = Object.keys(podsByNodeIndex[nodeName]);
+    return podKeys.map((key) => allPods[key]).filter(Boolean);
+  }, [allPods, podsByNodeIndex, nodeName]);
+}

src/lib/kuviewAtom.ts

@@ -5,6 +5,7 @@ import type {
   KuviewEvent,
   KuviewExtra,
   ServiceObject,
+  PodObject,
 } from "./kuview";
 import { useEffect } from "react";
 import { calcStatus } from "./status";
@@ -21,6 +22,11 @@ export const kubernetesAtom = atom<
   "kuview.iwanhae.kr/v1/UserGroup": atom<Record<string, KubernetesObject>>({}), // virtual resource
 });
 
+// Pod index atom: nodeName -> pod nn -> true
+export const podsByNodeNameIndexAtom = atom<
+  Record<string, Record<string, true>>
+>({});
+
 type ObjectAtom = PrimitiveAtom<
   Record<string /* NamespaceName */, KubernetesObject>
 >;
@@ -32,12 +38,46 @@ type _change_operation = {
 
 const PENDING_CHANGES = new Map<string, _change_operation>();
 
+// A dedicated queue for Pod index changes
+type PodIndexChange = {
+  type: "DELETE" | "UPSERT";
+  pod: PodObject;
+};
+
+const POD_INDEX_CHANGES = new Map<string, PodIndexChange>();
+
 function getObjectKey(object: KubernetesObject): string {
   // it is suprising that sometimes the uid is not unique, so we need to check the apiVersion and kind as well
   return `${object.apiVersion}/${object.kind}:${object.metadata.namespace}/${object.metadata.name}:${object.metadata.uid}`;
 }
 
+// Function to update the Pod index
+function updatePodIndex(event: KuviewEvent) {
+  if (event.object.kind !== "Pod" || event.object.apiVersion !== "v1") {
+    return;
+  }
+
+  const pod = event.object as PodObject;
+  const nodeName = pod.spec?.nodeName;
+  const nn = pod.metadata.namespace
+    ? `${pod.metadata.namespace}/${pod.metadata.name}`
+    : pod.metadata.name;
+
+  // If nodeName doesn't exist, no need to index, so drop it here
+  if (!nodeName || !nn) {
+    return;
+  }
+
+  POD_INDEX_CHANGES.set(nn, {
+    type: event.type === "delete" ? "DELETE" : "UPSERT",
+    pod,
+  });
+}
+
 export function handleEvent(event: KuviewEvent) {
+  // Update Pod index (handled separately from the main logic)
+  updatePodIndex(event);
+
   const key = getObjectKey(event.object);
   switch (event.type) {
     case "create":
@@ -235,3 +275,63 @@ export function useServiceEndpointSliceSyncHook() {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 }
+
+// usePodIndexSyncHook: A hook to update the Pod index in real-time
+export function usePodIndexSyncHook() {
+  const [podIndex, setPodIndex] = useAtom(podsByNodeNameIndexAtom);
+
+  const sync = () => {
+    const changes: PodIndexChange[] = [];
+    POD_INDEX_CHANGES.forEach((change, nn) => {
+      changes.push(change);
+      POD_INDEX_CHANGES.delete(nn);
+    });
+
+    if (changes.length === 0) return;
+
+    const newPodIndex = { ...podIndex };
+    let updated = false;
+
+    changes.forEach((change) => {
+      const { type, pod } = change;
+      const nodeName = pod.spec.nodeName!; // From here, we assume nodeName always exists
+      const nn = pod.metadata.namespace
+        ? `${pod.metadata.namespace}/${pod.metadata.name}`
+        : pod.metadata.name;
+
+      if (type === "DELETE") {
+        if (newPodIndex[nodeName] && newPodIndex[nodeName][nn]) {
+          const updatedNodePods = { ...newPodIndex[nodeName] };
+          delete updatedNodePods[nn];
+          if (Object.keys(updatedNodePods).length === 0) {
+            delete newPodIndex[nodeName];
+          } else {
+            newPodIndex[nodeName] = updatedNodePods;
+          }
+          updated = true;
+        }
+      } else {
+        // UPSERT
+        if (!newPodIndex[nodeName]) {
+          newPodIndex[nodeName] = {};
+        }
+        newPodIndex[nodeName] = {
+          ...newPodIndex[nodeName],
+          [nn]: true,
+        };
+        updated = true;
+      }
+    });
+
+    if (updated) {
+      console.log("Updated Pod index", changes.length, "operations");
+      setPodIndex(newPodIndex);
+    }
+  };
+
+  useEffect(() => {
+    const interval = setInterval(sync, DEBOUNCE_MS);
+    return () => clearInterval(interval);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+}