Potential fix for issue #380

Author: jakedahn

typescript/packages/jumble/src/contexts/CharmManagerContext.tsx

@@ -1,7 +1,6 @@
-import React, { createContext, useContext } from "react";
-import { CharmManager } from "@commontools/charm";
+import React, { createContext, useContext, useMemo } from "react";
+import { CharmManager, createStorage } from "@commontools/charm";
 import { useParams } from "react-router-dom";
-import { createStorage } from "@commontools/charm";
 
 export type CharmManagerContextType = {
   charmManager: CharmManager;
@@ -14,25 +13,18 @@ export const CharmsManagerProvider: React.FC<{ children: React.ReactNode }> = ({
   const { replicaName } = useParams<{ replicaName: string }>();
   const effectiveReplica = replicaName || "common-knowledge";
 
-  // NOTE(ja): disable switching replicas until
-  // https://github.com/commontoolsinc/labs/issues/377 is fixed
-  // const [charmManager, setCharmManager] = useState<CharmManager>(defaultManager);
-  // const previousReplicaRef = useRef<string | undefined>();
-
-  // useEffect(() => {
-  //   if (previousReplicaRef.current === effectiveReplica) {
-  //     return;
-  //   }
-  //   previousReplicaRef.current = effectiveReplica;
-
-  // Create new charm manager instance with updated replica
-  const storageType = (import.meta as any).env.VITE_STORAGE_TYPE ?? "remote";
-  const storage = storageType === "remote" ?
-    createStorage({ type: "remote", replica: effectiveReplica, url: new URL(location.href) }) :
-    createStorage({ type: storageType as "memory" | "local" });
-  const charmManager = new CharmManager(storage);
-  // setCharmManager(manager);
-  // }, [effectiveReplica]);
+  const charmManager = useMemo(() => {
+    const storageType = (import.meta as any).env.VITE_STORAGE_TYPE ?? "remote";
+    const storage =
+      storageType === "remote"
+        ? createStorage({
+            type: "remote",
+            replica: effectiveReplica,
+            url: new URL(location.href),
+          })
+        : createStorage({ type: storageType as "memory" | "local" });
+    return new CharmManager(storage);
+  }, [effectiveReplica]);
 
   return (
     <CharmManagerContext.Provider value={{ charmManager, currentReplica: effectiveReplica }}>