From 3eefc1633ce3dbe881cf05729ddcb1d52daae22e Mon Sep 17 00:00:00 2001
From: Codenjunior <sujaishukla55555@gmail.com>
Date: Wed, 1 Apr 2026 10:25:15 +0530
Subject: [PATCH] Refactor useArtifact hook for improved clarity

We can merge useArtifactSelector into useArtifact so that selectors read directly from the SWR cache, while keeping all logic and functionality identical. This removes redundant SWR calls and memo layers.
---
 hooks/use-artifact.ts | 83 ++++++++++++++-----------------------------
 1 file changed, 26 insertions(+), 57 deletions(-)

diff --git a/hooks/use-artifact.ts b/hooks/use-artifact.ts
index 28993300c7..66c9a3f8b5 100644
--- a/hooks/use-artifact.ts
+++ b/hooks/use-artifact.ts
@@ -11,79 +11,48 @@ export const initialArtifactData: UIArtifact = {
   title: "",
   status: "idle",
   isVisible: false,
-  boundingBox: {
-    top: 0,
-    left: 0,
-    width: 0,
-    height: 0,
-  },
+  boundingBox: { top: 0, left: 0, width: 0, height: 0 },
 };
 
 type Selector<T> = (state: UIArtifact) => T;
 
-export function useArtifactSelector<Selected>(selector: Selector<Selected>) {
-  const { data: localArtifact } = useSWR<UIArtifact>("artifact", null, {
-    fallbackData: initialArtifactData,
-  });
-
-  const selectedValue = useMemo(() => {
-    if (!localArtifact) {
-      return selector(initialArtifactData);
-    }
-    return selector(localArtifact);
-  }, [localArtifact, selector]);
-
-  return selectedValue;
-}
+const SWR_OPTIONS = { fallbackData: initialArtifactData };
 
 export function useArtifact() {
-  const { data: localArtifact, mutate: setLocalArtifact } = useSWR<UIArtifact>(
-    "artifact",
-    null,
-    {
-      fallbackData: initialArtifactData,
-    }
-  );
-
-  const artifact = useMemo(() => {
-    if (!localArtifact) {
-      return initialArtifactData;
-    }
-    return localArtifact;
-  }, [localArtifact]);
+  // Main artifact SWR
+  const { data: artifact = initialArtifactData, mutate: setArtifactData } =
+    useSWR<UIArtifact>("artifact", null, SWR_OPTIONS);
 
+  // Setter function for artifact
   const setArtifact = useCallback(
-    (updaterFn: UIArtifact | ((currentArtifact: UIArtifact) => UIArtifact)) => {
-      setLocalArtifact((currentArtifact) => {
-        const artifactToUpdate = currentArtifact || initialArtifactData;
-
-        if (typeof updaterFn === "function") {
-          return updaterFn(artifactToUpdate);
-        }
+    (updater: UIArtifact | ((current: UIArtifact) => UIArtifact)) =>
+      setArtifactData((current = initialArtifactData) =>
+        typeof updater === "function" ? updater(current) : updater
+      ),
+    [setArtifactData]
+  );
 
-        return updaterFn;
-      });
-    },
-    [setLocalArtifact]
+  // Metadata per documentId
+  const { data: metadata, mutate: setMetadata } = useSWR(
+    artifact.documentId ? `artifact-metadata-${artifact.documentId}` : null,
+    null,
+    { fallbackData: null }
   );
 
-  const { data: localArtifactMetadata, mutate: setLocalArtifactMetadata } =
-    useSWR<any>(
-      () =>
-        artifact.documentId ? `artifact-metadata-${artifact.documentId}` : null,
-      null,
-      {
-        fallbackData: null,
-      }
-    );
+  // Selector helper
+  const selectArtifact = useCallback(
+    <Selected>(selector: Selector<Selected>) => selector(artifact),
+    [artifact]
+  );
 
   return useMemo(
     () => ({
       artifact,
       setArtifact,
-      metadata: localArtifactMetadata,
-      setMetadata: setLocalArtifactMetadata,
+      metadata,
+      setMetadata,
+      selectArtifact, // function to select from artifact
     }),
-    [artifact, setArtifact, localArtifactMetadata, setLocalArtifactMetadata]
+    [artifact, setArtifact, metadata, setMetadata, selectArtifact]
   );
 }