deep-foundation · ivansglazunov · Apr 14, 2024 · Aug 27, 2023 · Oct 10, 2023 · Dec 6, 2023
diff --git a/imports/check.tsx b/imports/check.tsx
@@ -1,18 +1,19 @@
 import Debug from 'debug';
 import { gql } from '@apollo/client';
 import forEach from 'lodash/forEach';
+import { Id } from '@deep-foundation/deeplinks/imports/minilinks';
 
 interface Node {
-  from_id?: number; id?: number; to_id?: number; type_id?: number;
+  from_id?: Id; id?: Id; to_id?: Id; type_id?: Id;
   in: Node[]; out: Node[];
 }
 
 interface Marker {
-  id: number; item_id: number; path_item_depth: number; path_item_id: number; root_id: number; position_id: string;
+  id: Id; item_id: Id; path_item_depth: Id; path_item_id: Id; root_id: Id; position_id: string;
   by_position: Marker[];
 }
 
-export const check = async (hash: { [name:string]: number }, client) => {
+export const check = async (hash: { [name:string]: Id }, client) => {
   const fetch = async () => {
     const result = await client.query({ query: gql`query FETCH_FOR_CHECK {
       mp: mp { id item_id path_item_depth path_item_id root_id position_id by_position(order_by: { path_item_depth: asc }) { id item_id path_item_depth path_item_id root_id position_id } }
@@ -28,8 +29,8 @@ export const check = async (hash: { [name:string]: number }, client) => {
     valid = false;
     console.log(...args);
   };
-  const nodesChecked: { [id: number]: boolean; } = {};
-  const markersChecked: { [id: number]: boolean; } = {};
+  const nodesChecked: { [id: Id]: boolean; } = {};
+  const markersChecked: { [id: Id]: boolean; } = {};
   const checkNode = (node: Node) => {
     if (nodesChecked[node.id]) return;
     else nodesChecked[node.id] = true;

diff --git a/imports/client-handler-slate-proxy.tsx b/imports/client-handler-slate-proxy.tsx
@@ -40,7 +40,7 @@ export const ClientHandlerSlateProxy = ({ children }) => {
     const match = regex.exec(text);
     const firstGroup = match ? match[1] : null;
 
-    return firstGroup ? parseInt(firstGroup, 10) : null;
+    return firstGroup ? parseInt(firstGroup, 10) : undefined;
   }
 
   const text = children?.[0]?.props?.parent?.children?.[0]?.text || '';
@@ -51,13 +51,12 @@ export const ClientHandlerSlateProxy = ({ children }) => {
     },
   });
 
-  console.log('DEEPW', text, linkId, children);
-  // if(linkId) {
+  if(linkId) {
     return (<>
       <ClientHandler handlerId={739} linkId={linkId} ml={ml} />
       {children}
     </>)
-  // } else { 
-  //   return children
-  // }
+  } else { 
+    return null;
+  }
 }
diff --git a/imports/client-handler.tsx b/imports/client-handler.tsx
@@ -6,7 +6,7 @@ import * as IconsMaterial from '@mui/icons-material';
 import dynamic from 'next/dynamic';
 import { DeepClient, useDeep, useDeepSubscription } from "@deep-foundation/deeplinks/imports/client";
 import { evalClientHandler as deepclientEvalClientHandler } from '@deep-foundation/deeplinks/imports/client-handler';
-import { useMinilinksFilter, useMinilinksSubscription } from "@deep-foundation/deeplinks/imports/minilinks";
+import { Id, useMinilinksFilter, useMinilinksSubscription } from "@deep-foundation/deeplinks/imports/minilinks";
 import axios from 'axios';
 import * as axiosHooks from 'axios-hooks';
 import * as classnames from 'classnames';
@@ -340,9 +340,9 @@ export const ClientHandlerRenderer = React.memo(function ClientHandlerRenderer({
 });
 
 export interface ClientHandlerProps extends Partial<ClientHandlerRendererProps> {
-  linkId: number;
-  handlerId?: number;
-  context?: number[];
+  linkId: Id;
+  handlerId?: Id;
+  context?: Id[];
   ml?: any;
   error?: any;
   onClose?: () => any,

diff --git a/imports/connector/connector.tsx b/imports/connector/connector.tsx
@@ -156,11 +156,11 @@ const TerminalConnect = React.memo(({
         console.log('initializingState2', initializingState)
 
         await delay(2000);
-        setInitLocal(InitializingState.launched);
-        setGqlPath(defaultGqlPath);
-        setGqlSsl(defaultGqlSsl);
+        setInitLocal && setInitLocal(InitializingState.launched);
+        setGqlPath && setGqlPath(defaultGqlPath);
+        setGqlSsl && setGqlSsl(defaultGqlSsl);
         await delay(2000);
-        setPortal(false);
+        setPortal && setPortal(false);
       }, 2000);
     } else if (initializingState == 'removing') {
       console.log('initializingState0-r', initializingState);
@@ -176,10 +176,10 @@ const TerminalConnect = React.memo(({
         // control.start('shrink');
         console.log('initializingState2-r', initializingState);
         await delay(2000);
-        setInitLocal(InitializingState.notInit);
+        setInitLocal && setInitLocal(InitializingState.notInit);
         await delay(1000);
-        setGqlPath('');
-        setGqlSsl(false);
+        setGqlPath && setGqlPath('');
+        setGqlSsl && setGqlSsl(false);
       }, 2000);
     } else if (initializingState == 'launched' || initializingState == 'not init') {
       if (terminalRef.current) terminalRef.current.clear();
@@ -371,7 +371,7 @@ const InputAnimation = React.memo(({
           onClick={() => { 
             const [currentGqlPath, currentGqlSsl] = parseUrl(valueRemoteRoute);
             if(currentGqlPath) {
-              onStartRemoteRoute();
+              onStartRemoteRoute && onStartRemoteRoute();
             }
           }}
           children={
@@ -518,7 +518,7 @@ export const Connector = React.memo(({
   });
 
   // const [ portalOpen, setPortal ] = useState(true); 
-  // const onClosePortal = () => setPortal(false);
+  // const onClosePortal = () => setPortal && setPortal(false);
 
   const [remotesString, setRemotesString] = useLocalStorage('remote-routes', '[]');
   const remotes = JSON.parse(remotesString);
@@ -589,12 +589,12 @@ export const Connector = React.memo(({
     (async () => {
       const status = await checkSystemStatus(defaultServerUrl);
       if (status.result !== undefined) {
-        setInitLocal(InitializingState.notInit);
+        setInitLocal && setInitLocal(InitializingState.notInit);
         await delay(1000);
-        setInitLocal(InitializingState.launched);
+        setInitLocal && setInitLocal(InitializingState.launched);
         if (!gqlPath){
-          setGqlPath(defaultGqlPath);
-          setGqlSsl(defaultGqlSsl);
+          setGqlPath && setGqlPath(defaultGqlPath);
+          setGqlSsl && setGqlSsl(defaultGqlSsl);
         }
       }
     })();
@@ -619,7 +619,7 @@ export const Connector = React.memo(({
 
   return (<ModalWindow onClosePortal={() => {
     if (init == InitializingState.launched){
-      setPortal(false);
+      setPortal && setPortal && setPortal(false);
     }
   }} portalOpen={portalOpen}>
       <Box 
@@ -670,8 +670,8 @@ export const Connector = React.memo(({
                   // setValueRemote={}
                   onDeleteValue={() => {
                     if (gqlPath == rr.value) {
-                      setGqlPath('');
-                      setGqlSsl(false);
+                      setGqlPath && setGqlPath('');
+                      setGqlSsl && setGqlSsl(false);
                     }
                     remove(rr.id)
                     }
@@ -681,9 +681,9 @@ export const Connector = React.memo(({
                       const url = new URL(rr.value);
                       const status = await checkUrlStatus(url);
                       if (status.result !== undefined && !status.error) {
-                        setGqlPath(`${url.hostname}${url.port ? ':' + url.port : ''}${url.pathname}`);
-                        setGqlSsl(url.protocol == 'http:' ? false : true);
-                        setPortal(false);
+                        setGqlPath && setGqlPath(`${url.hostname}${url.port ? ':' + url.port : ''}${url.pathname}`);
+                        setGqlSsl && setGqlSsl(url.protocol == 'http:' ? false : true);
+                        setPortal && setPortal && setPortal(false);
                       } else {
                         console.log('URL error', JSON.stringify(status));
                       }
@@ -735,9 +735,9 @@ export const Connector = React.memo(({
                   initial='initial'
                   variants={initArea}
                   onClick={() => {
-                    setInitLocal(InitializingState.initializing);
+                    setInitLocal && setInitLocal(InitializingState.initializing);
                     // setTimeout(() => {
-                    //   setInitLocal(InitializingState.initialized);
+                    //   setInitLocal && setInitLocal(InitializingState.initialized);
                     // }, 3000)
                   }} 
                 >
@@ -766,7 +766,7 @@ export const Connector = React.memo(({
                   animate={controlInit}
                   initial='initializing'
                   variants={initArea}
-                  // onClick={() => setInitLocal(InitializingState.initialized)} 
+                  // onClick={() => setInitLocal && setInitLocal(InitializingState.initialized)} 
                 >
                   <Loading text="Initializing" 
                     sxFlex={{pt: 2, pb: 2}}
@@ -791,8 +791,8 @@ export const Connector = React.memo(({
                     ariaLabelLeft="go to launched deepcase"
                     ariaLabelRight="launched local deepcase"
                     ComponentRightIcon={BsFillPauseFill}
-                    // onClickLeft={() => setInitLocal(InitializingState.launched)} 
-                    // onClickRight={() => setInitLocal(InitializingState.notInit)} 
+                    // onClickLeft={() => setInitLocal && setInitLocal(InitializingState.launched)} 
+                    // onClickRight={() => setInitLocal && setInitLocal(InitializingState.notInit)} 
                   />
                 </Box>
                 <Box 
@@ -806,22 +806,22 @@ export const Connector = React.memo(({
                   animate={controlLaunch}
                   initial='initializing'
                   variants={initArea}
-                  // onClick={() => setInitLocal(InitializingState.notInit)}
+                  // onClick={() => setInitLocal && setInitLocal(InitializingState.notInit)}
                 >
                   <ButtonTextButton 
                     text='launched'
                     ariaLabelLeft="go to deepcase"
                     ariaLabelRight="delete local deepcase"
                     // ComponentRightIcon={IoStopOutline}
                     onClickLeft={() => {
-                      setGqlPath(defaultGqlPath);
-                      setGqlSsl(defaultGqlSsl);
-                      setPortal(false);
+                      setGqlPath && setGqlPath(defaultGqlPath);
+                      setGqlSsl && setGqlSsl(defaultGqlSsl);
+                      setPortal && setPortal(false);
                     }}
                     leftButtonId="goToDeep"
                     rightButtonId="deleteLocalDeep"
                     onClickRight={() => {
-                      setInitLocal(InitializingState.removing)
+                      setInitLocal && setInitLocal(InitializingState.removing)
                     }} 
                   />
                 </Box>
@@ -853,12 +853,12 @@ export const Connector = React.memo(({
           </Box>
           <TerminalConnect 
             initializingState={init} 
-            setInitLocal={(state)=>setInitLocal(state)}
+            setInitLocal={(state)=>setInitLocal && setInitLocal(state)}
             key={21121}
             serverUrl={defaultServerUrl}
-            setGqlPath={(path) => setGqlPath(path)}
-            setGqlSsl={(ssl) => setGqlSsl(ssl)}
-            setPortal={(state) => setPortal(state)}
+            setGqlPath={(path) => setGqlPath && setGqlPath(path)}
+            setGqlSsl={(ssl) => setGqlSsl && setGqlSsl(ssl)}
+            setPortal={(state) => setPortal && setPortal(state)}
             defaultGqlPath={defaultGqlPath}
             defaultGqlSsl={defaultGqlSsl}
           />

diff --git a/imports/cyto-handler.tsx b/imports/cyto-handler.tsx
@@ -7,6 +7,7 @@ import { evalClientHandler, r } from './client-handler';
 import { useDebounceCallback } from '@react-hook/debounce';
 import { useCytoHandlersSwitch, useInsertingCytoStore } from './hooks';
 import { useCytoHandlersRules } from './cyto/hooks';
+import { Id } from '@deep-foundation/deeplinks/imports/minilinks';
 const MonacoEditor = dynamic(() => import('@monaco-editor/react').then(m => m.default), { ssr: false });
 
 export interface CytoHandlerRendererProps {
@@ -16,17 +17,17 @@ export interface CytoHandlerRendererProps {
 };
 
 export interface CytoHandlerProps extends Partial<CytoHandlerRendererProps> {
-  linkId: number;
-  handlerId?: number;
-  onChange?: (id: number, handled?: {
-    handlerId?: number;
+  linkId: Id;
+  handlerId?: Id;
+  onChange?: (id: Id, handled?: {
+    handlerId?: Id;
     error?: any;
     elements?: any[];
     stylesheets?: any[];
   }) => void;
   elementsById: { [key: string]: any };
   cy?: any;
-  HandleCyto?: number;
+  HandleCyto?: Id;
 }
 
 export function useCytoHandlers() {
@@ -61,9 +62,10 @@ export function useCytoHandlersApply(cyh, elements, stylesheets, iterator) {
     for (let key in cyh?.cytoHandlersRef?.current) {
       const el = cyh?.cytoHandlersRef?.current[key];
       const cyHandle = deep.minilinks?.byType[HandleCyto]?.find(l => l.from_id === deep.minilinks.byId?.[key]?.type_id);
-      if (el && chr[cyHandle?.id]) {
+      if (el && !!el?.elements?.length && cyHandle && chr[cyHandle?.id]) {
         cyh.drawedCytoHandlers.current[key] = el;
-        addElements.push(...el.elements || []);
+        // @ts-ignore
+        addElements.push(...(el.elements || []));
         stylesheetsByHandler[el?.handlerId] = el.stylesheets || [];
       }
     }
@@ -80,13 +82,13 @@ export const CytoHandlers = React.memo(function CytoHandlers({
   elementsById,
   cy,
 }: {
-  onChange: (id: number, result: any) => void;
-  handled: { [key: string]: number };
+  onChange: (id: Id, result: any) => void;
+  handled: { [key: string]: Id };
   elementsById: { [key: string]: any };
   cy?: any;
 }) {
   const { data: HandleCyto } = useDeepId('@deep-foundation/handle-cyto', 'HandleCyto');
-  const arr = [];
+  const arr: any[] = [];
   for (let key in handled) {
     arr.push(<CytoHandler
       key={+key}
@@ -145,15 +147,15 @@ export const CytoHandler = React.memo(function CytoHandler({
     });
 
     return () => {
-      onChange(linkId);
+      onChange && onChange(linkId);
     };
   }, [file?.value?.value]);
 
   try {
     const r = Component ? Component({ link: ml.byId[linkId], elementsById, cy, ...props }) : {};
-    onChange(linkId, { ...r, handlerId });
+    onChange && onChange(linkId, { ...r, handlerId });
   } catch(error) {
-    onChange(linkId, { error, handlerId })
+    onChange && onChange(linkId, { error, handlerId })
   }
 
   return <></>;

diff --git a/imports/cyto-message-textarea.tsx b/imports/cyto-message-textarea.tsx
@@ -23,7 +23,7 @@ export const MessageTextArea = React.memo(() => {
   return (<Popover 
     isLazy
     placement='right-start'
-    initialFocusRef={initialFocusRef}
+    initialFocusRef={initialFocusRef as any}
     colorScheme={colorGrayToWhite}
     // styleConfig={{borderColor: 'none'}}
   >
@@ -46,7 +46,7 @@ export const MessageTextArea = React.memo(() => {
     <PopoverContent color={white}>
       <PopoverBody p={0} color={white}>
         <Textarea
-          ref={initialFocusRef}
+          ref={initialFocusRef as any}
           colorScheme={colorWhiteToGray}
           value={value}
           onChange={handleInputChange}