Remove extra logging, add comments clarifying proxy usage in UI

Author: yamalight

app/store/WithLitLytics.tsx

@@ -28,7 +28,7 @@ export function WithLitLytics({ children }: { children: React.ReactNode }) {
   const [, forceUpdate] = useReducer((x) => x + 1, 0);
 
   // create proxy that triggers state updates
-  // only create it once
+  // only create it once and use context to pass it around
   useEffect(() => {
     if (isInited) {
       return;
@@ -55,7 +55,6 @@ export function WithLitLytics({ children }: { children: React.ReactNode }) {
     // set inited flag
     setIsInited(true);
     // assign initial config and webEngine instance
-    console.log('set', config);
     ll.importConfig(config);
     ll.setWebEngine(webllm.engine);
   }, [isInited, config, webllm, setIsInited, setLitlytics, setConfig]);

app/store/util.ts

@@ -1,5 +1,15 @@
 import { LitLytics } from 'litlytics';
 /* eslint @typescript-eslint/ban-ts-comment: off */
+
+/**
+ * Creates a Proxy wrapper around LitLytics instance to monitor function invocations
+ * and update react state upon those invocations completion.
+ * This is required because React cannot see changes in persistent object (i.e. wants new object refs)
+ *
+ * @param instance LitLytics instance
+ * @param updateCallback callback to update state
+ * @returns LitLytics instance with a proxy
+ */
 export function createReactiveProxy(
   instance: LitLytics,
   updateCallback: () => void
@@ -22,10 +32,5 @@ export function createReactiveProxy(
       }
       return value;
     },
-    // set(target, prop, value, receiver) {
-    //   const result = Reflect.set(target, prop, value, receiver);
-    //   updateCallback.call(target);
-    //   return result;
-    // },
   });
 }

packages/litlytics/litlytics.ts

@@ -131,15 +131,13 @@ export class LitLytics {
   }
 
   setPipeline = (newPipeline: Partial<Pipeline>) => {
-    console.log('set pipeline', newPipeline);
     this._pipeline = {
       ...this._pipeline,
       ...newPipeline,
     };
   };
 
   resetPipeline = () => {
-    console.log('reset pipeline');
     this._pipeline = emptyPipeline;
     this._pipelineStatus = { status: 'init' };
   };