wip

Author: noituri

ts/smelter-web-client/src/hooks/useSmelter.ts

@@ -1,14 +1,23 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import Smelter from '../smelter/live';
 import type { SmelterInstanceOptions } from '../manager';
 
 export function useSmelter(options: SmelterInstanceOptions): Smelter | undefined {
   const [smelter, setSmelter] = useState<Smelter>();
+  const prevSmelter = useRef<Smelter>();
+
   useEffect(() => {
     const smelter = new Smelter(options);
+    const smelterToTerminate = prevSmelter.current;
+    prevSmelter.current = smelter;
 
     let cancel = false;
     (async () => {
+      if (smelterToTerminate) {
+        console.log("Terminate");
+      }
+      await smelterToTerminate?.terminate().catch(() => { });
+      console.log("Init");
       await smelter.init();
       await smelter.start();
       if (!cancel) {
@@ -18,9 +27,18 @@ export function useSmelter(options: SmelterInstanceOptions): Smelter | undefined
 
     return () => {
       cancel = true;
-      void smelter.terminate()
     };
   }, [options?.url]);
 
+  useEffect(() => {
+    return () => {
+      if (prevSmelter.current) {
+        console.log("Terminate unmount");
+      }
+      // It runs only during unmount
+      void prevSmelter.current?.terminate().catch(() => { });
+    }
+  }, [])
+
   return smelter;
 }

ts/smelter-web-wasm/src/hooks/useSmelter.ts

@@ -1,18 +1,15 @@
-import { useEffect, useRef, useState } from 'react';
+import { useEffect, useState } from 'react';
 import type { SmelterOptions } from '../compositor/compositor';
 import Smelter from '../compositor/compositor';
 
 export function useSmelter(options?: SmelterOptions): Smelter | undefined {
   const [smelter, setSmelter] = useState<Smelter>();
-  const count = useRef(1);
+
   useEffect(() => {
     const smelter = new Smelter(options);
 
-    let id = count.current;
-    count.current++;
     let cancel = false;
     (async () => {
-      console.log('Init', id);
       await smelter.init();
       await smelter.start();
       if (!cancel) {
@@ -21,7 +18,6 @@ export function useSmelter(options?: SmelterOptions): Smelter | undefined {
     })();
 
     return () => {
-      console.log('Cancel', id);
       cancel = true;
       void smelter.terminate();
     };