0.0.54

link-foundation · Aug 30, 2024 · d08c782 · d08c782
1 parent ac12c53
commit d08c782
Show file tree

Hide file tree

Showing 6 changed files with 70 additions and 37 deletions.
diff --git a/imports/client-handler.tsx b/imports/client-handler.tsx
@@ -191,6 +191,8 @@ export const HandlerConfigContext = createContext<{
   setSync: React.Dispatch<React.SetStateAction<boolean>>;
 }>({ sync: false, setSync: (value) => {} });
 
+const _client_handlers_memory = {};
+
 export function useClientHandler(_props: UseClientHandlerProps) {
   const { sync: __sync = false } = useContext(HandlerConfigContext);
   const {
@@ -226,33 +228,51 @@ export function useClientHandler(_props: UseClientHandlerProps) {
   // console.log('ClientHandler root', { linkId, handlerId, context, file, hid, files, Component });
   const lastEvalRef = useRef(0);
   useEffect(() => {
-    if (!hid) return;
-    const value = deep.minilinks.byId[file?.id]?.value?.value;
-    if (!value) {
-      return;
+    if (typeof(window) === 'object') {
+      // @ts-ignore
+      window._deep_perception_client_handlers_memory = _client_handlers_memory;
     }
-    const evalId = ++lastEvalRef.current;
-    evalClientHandler({ value, deep, input: { require, Go: go } }).then(({ data, error }) => {
-      try {
-        if (evalId === lastEvalRef.current) {
-          // console.log('ClientHandler evalClientHandler setState', { file, data, error });
-          if (!error) {
-            setState(() => ({ Component: React.memo(React.forwardRef(data), isEqual) }));
-            erroredResetRef?.current && (erroredResetRef?.current(), erroredResetRef.current = undefined);
-          }
-          else {
-            setErrorRef.current && setErrorRef.current(error);
-            setState({ Component: undefined, errored: error });
+    if (!hid || !file?.id) return;
+    const value = deep.minilinks.byId[file?.id]?.value?.value;
+    if (!value) return;
+    if (!_client_handlers_memory?.[file?.id] || _client_handlers_memory?.[file?.id]?.value != file?.value?.value) {
+      const evalId = ++lastEvalRef.current;
+      evalClientHandler({ value, deep, input: { require, Go: go } }).then(({ data, error }) => {
+        try {
+          if (evalId === lastEvalRef.current) {
+            // console.log('ClientHandler evalClientHandler setState', { file, data, error });
+            if (!error) {
+              _client_handlers_memory[file.id] = {
+                value: file?.value?.value,
+                Component: React.memo(React.forwardRef(data), isEqual),
+              };
+              setState({ Component: _client_handlers_memory[file.id].Component });
+              erroredResetRef?.current && (erroredResetRef?.current(), erroredResetRef.current = undefined);
+            }
+            else {
+              _client_handlers_memory[file.id] = {
+                value: file?.value?.value,
+                error,
+              };
+              setErrorRef.current && setErrorRef.current(error);
+              setState({ Component: undefined, errored: error });
+            }
+          } else {
+            // console.log('ClientHandler evalClientHandler outdated', { file, data, error, evalId, 'lastEvalRef.current': lastEvalRef.current });
           }
-        } else {
-          // console.log('ClientHandler evalClientHandler outdated', { file, data, error, evalId, 'lastEvalRef.current': lastEvalRef.current });
+        } catch(error) {
+          _client_handlers_memory[file.id] = {
+            value: file?.value?.value,
+            error,
+          };
+          setErrorRef.current && setErrorRef.current(error);
+          setState({ Component: undefined, errored: error });
         }
-      } catch(error) {
-        setErrorRef.current && setErrorRef.current(error);
-        setState({ Component: undefined, errored: error });
-      }
-    });
-  }, [files, file?.value?.value, hid]);
+      });
+    } else {
+      setState({ Component: _client_handlers_memory[file.id].Component });
+    }
+  }, [file?.value?.value]);
 
   const erroredResetRef = useRef<any>();
   const setErrorRef = useRef<any>();

diff --git a/imports/editor.tsx b/imports/editor.tsx
@@ -17,9 +17,12 @@ import globals from "globals";
 import isEqual from 'lodash/isEqual';
 import { MdSaveAlt } from 'react-icons/md';
 import { useResizeDetector } from 'react-resize-detector';
+import { Id } from '@deep-foundation/deeplinks/imports/minilinks';
 
 interface IEditor {
   refEditor?: any;
+  linkId?: Id;
+  subscription?: boolean;
   value?: any;
   onChange?: (value: string) => void;
   onSave?: (value: string) => void;
@@ -56,6 +59,7 @@ function usePsudoResize() {
 export const Editor = React.memo(function Editor({
   refEditor,
   linkId,
+  subscription = false,
   value = '',
   onChange,
   onSave,
@@ -67,7 +71,6 @@ export const Editor = React.memo(function Editor({
   defaultLanguage = "javascript",
   fillSize = false,
   onMount,
-  subscription = false,
   children = null,
   ...props
 }: IEditor) {

diff --git a/imports/go.tsx b/imports/go.tsx
@@ -41,6 +41,7 @@ export interface GoI {
   focus?: FocusI;
   set?: FocusI;
   parents: ParentsI;
+  parent: typeof parent;
   focused: typeof focused;
   log: typeof log;
   scroll: typeof scroll;
@@ -266,6 +267,7 @@ export const GoProvider = memo(function GoProvider({
     go.useGo = useGo;
     go.useNav = useNav;
     go.parents = parents;
+    go.parent = parent;
     go.focused = focused;
     go.root = root;
     go.await = _await;
@@ -462,6 +464,14 @@ const parents: ParentsI = function parents(): GoI[] {
   return parents;
 }
 
+const parent = function parent(id): GoI | undefined {
+  const go = this();
+  const parents = go.parents();
+  for (let i = 0; i < parents.length - 1; i++) {
+    if (parents[i].linkId == id) return parents[i];
+  }
+};
+
 const all: AllI = function all(path: string): { steps: Id[]; data: GoI[] } {
   const go = this();
   let pointer: any = go;
@@ -535,7 +545,7 @@ function log(value: string) {
   console.dir(this);
 }
 
-function scroll(options: any = { block: "nearest", inline: "nearest", behavior: 'smooth' }) {
+function scroll(options: any = { block: "center", inline: "center", behavior: 'smooth' }) {
   const go = this();
   // console.log('scroll', go.linkId, go.value);
   (go.ref?.current || go?.hgo()?.ref?.current)?.scrollIntoView(options);
@@ -642,7 +652,7 @@ const Query = memo(function Query({ query, options, onChange }: any) {
   return null;
 }, isEqual);
 
-const noScrollBar = ((s) => ({
+export const noScrollBar = ((s) => ({
   '&::-webkit-scrollbar': s,
   '&::-webkit-scrollbar-track': s,
   '&::-webkit-scrollbar-thumb': s,

diff --git a/imports/react-handler.tsx b/imports/react-handler.tsx
@@ -268,9 +268,9 @@ export const ReactHandler = memo(function ReactHandler({ ...props }: ReactHandle
   const deep = useDeep();
   const go = useGoCore();
 
-  const h = deep.minilinks.byId[props?.handlerId];
+  const [h] = deep.useLinks(props?.handlerId);
 
-  const ch = <ClientHandler key={props.handlerId}
+  const ch = <ClientHandler key={deep.isLink(h) ? `${h}` : props.handlerId}
     ErrorComponent={ClientHandlerErrorComponent}
     UnhandledComponent={ClientHandlerUnhandledComponent}
     {...props}

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@deep-foundation/perception-imports",
-  "version": "0.0.53",
+  "version": "0.0.54",
   "license": "Unlicense",
   "type": "module",
   "scripts": {
@@ -13,7 +13,7 @@
     "app:dev": "npm run app:sync; (cd ../; rm -rf app; npm run dev)"
   },
   "peerDependencies": {
-    "@deep-foundation/deeplinks": "^0.0.432",
+    "@deep-foundation/deeplinks": "^0.0.434",
     "react": "^18.3.1"
   },
   "engines": {