0.0.131

deep-foundation · Oct 2, 2024 · 12ce15c · 12ce15c
1 parent 2f73f9a
commit 12ce15c
Show file tree

Hide file tree

Showing 5 changed files with 160 additions and 59 deletions.
diff --git a/import.ts b/import.ts
@@ -1,9 +1,9 @@
-export type { onEnterI, onChangeI, PathI, onDoI, GoContextI, GoI, GoCallbackI, FocusI, ParentsI, AllI, DoI, DoHandleI, onDoObjectI } from './imports/go.js';
-export { GoContext, ValueContext, GoProvider, noScrollBar, GoCustomContext, useGoCore, useGo, GoCustomProvider } from './imports/go.js';
-
 export type { ClientHandlerRendererProps, ClientHandlerProps, UseClientHandlerProps } from './imports/client-handler.js';
 export { CatchErrors, evalClientHandler, useHandlersGo, useClientHandler, useFindClientHandler, HandlersGoContext, ClientHandler, HandlerConfigContext, ClientHandlerRenderer } from './imports/client-handler.js';
 
+export type { onEnterI, onChangeI, PathI, onDoI, GoContextI, GoI, GoCallbackI, FocusI, ParentsI, AllI, DoI, DoHandleI, onDoObjectI } from './imports/go.js';
+export { GoContext, ValueContext, GoProvider, noScrollBar, GoCustomContext, useGoCore, useGo, GoCustomProvider } from './imports/go.js';
+
 export type { ReactHandlerProps } from './imports/react-handler.js';
 export { WatchLink, ClientHandlerErrorComponent, ClientHandlerUnhandledComponent, ReactHandlerEditor, ReactHandlersProvider, createComponent, ReactHandlerTreeItem, ReactHandlersContext, ReactHandler, } from './imports/react-handler.js';
 

diff --git a/imports/go.tsx b/imports/go.tsx
@@ -145,10 +145,6 @@ export function GoCustomProvider({ value, children = null }) {
   return <GoCustomContext.Provider value={value}>{children}</GoCustomContext.Provider>;
 }
 
-export type GoContextI = Context<GoI | undefined>;
-
-export const GoContext: GoContextI = createContext<GoI | undefined>(undefined);
-GoContext.displayName = 'GoContext';
 export function useGoCore(context?: GoContextI) { return useContext(context || GoContext); }
 
 export const ValueContext = createContext<any>(undefined);
@@ -161,6 +157,55 @@ export const GoEditorProvider = memo(function GoEditorProvider({ Editor, childre
   return <GoEditorContext.Provider value={Editor}>{children}</GoEditorContext.Provider>
 });
 
+export function fillGo(go: any = {}) {
+  go.children = go.children || {};
+  // @ts-ignore
+  go.log = log;
+  go.scroll = scroll;
+  go.toString = toString;
+  go.save = save;
+  go.Save = Save;
+  // @ts-ignore
+  go.Provider = GoProvider;
+  go.Handler = Handler;
+  go.Input = Input;
+  go.Subscription = Subscription;
+  go.Query = Query;
+  go.useLocalStore = useLocalStore;
+  go.useQueryStore = useQueryStore;
+  go.useCookiesStore = useCookiesStore;
+  go.getChakraVar = getChakraVar;
+  go.useChakraColor = useChakraColor;
+  go.Component = Component;
+  go.Button = Button;
+  go.useHook = useHook;
+  go.useLoader = useLoader;
+  go.On = On;
+  go.on = _on;
+  go.emit = emit;
+  go.noScrollBar = noScrollBar;
+
+  go.do = _do;
+  go.useGo = useGo;
+  go.useNav = useNav;
+  go.parents = parents;
+  go.parent = parent;
+  go.focused = focused;
+  go.root = root;
+  go.await = _await;
+  go.awaitRef = _awaitRef;
+  go.all = all;
+
+  go.activator = activator;
+  go.next = next;
+  go.prev = prev;
+
+  go.delay = delay;
+  go.useRefValue = useRefValue;
+
+  return go;
+}
+
 export const GoProvider = memo(function GoProvider({
   linkId,
   value: _value,
@@ -240,6 +285,7 @@ export const GoProvider = memo(function GoProvider({
   useMemo(() => {
     const pgo = pgoRef.current;
 
+    go.deep = deep;
     go.linkId = linkId || parentGo.linkId;
     go.link = deep?.minilinks?.byId[go.linkId]
     go.context = context;
@@ -249,53 +295,10 @@ export const GoProvider = memo(function GoProvider({
     go._go = _go;
     go.current = go?.children?.[value];
 
-    // @ts-ignore
-    go.deep = deep;
-    go.log = log;
-    go.scroll = scroll;
-    go.toString = toString;
-    go.save = save;
-    go.Save = Save;
-    // @ts-ignore
-    go.Provider = GoProvider;
-    go.Handler = Handler;
-    go.Input = Input;
     go.Editor = Editor;
-    go.Subscription = Subscription;
-    go.Query = Query;
-    go.useLocalStore = useLocalStore;
-    go.useQueryStore = useQueryStore;
-    go.useCookiesStore = useCookiesStore;
-    go.getChakraVar = getChakraVar;
-    go.useChakraColor = useChakraColor;
-    go.HandlerConfigContext = HandlerConfigContext;
-    go.Component = Component;
-    go.Button = Button;
-    go.useHook = useHook;
-    go.useLoader = useLoader;
     go.loader = _loader;
-    go.On = On;
-    go.on = _on;
-    go.emit = emit;
-    go.noScrollBar = noScrollBar;
-
-    go.do = _do;
-    go.useGo = useGo;
-    go.useNav = useNav;
-    go.parents = parents;
-    go.parent = parent;
-    go.focused = focused;
-    go.root = root;
-    go.await = _await;
-    go.awaitRef = _awaitRef;
-    go.all = all;
-
-    go.activator = activator;
-    go.next = next;
-    go.prev = prev;
-
-    go.delay = delay;
-    go.useRefValue = useRefValue;
+
+    fillGo(go);
 
     go._setValue = setValue;
     go.hgo = hgo;
@@ -910,4 +913,8 @@ const Input = React.memo(({
       </c.InputRightElement>
     </c.InputGroup>
   </>;
-}, isEqual);
+}, isEqual);
+
+export type GoContextI = Context<GoI>;
+export const GoContext: GoContextI = createContext<GoI>(fillGo({}));
+GoContext.displayName = 'GoContext';
diff --git a/imports/preload.ts → imports/preload.tsx b/imports/preload.ts → imports/preload.tsx
@@ -1,7 +1,8 @@
 import type { NextApiRequest, NextApiResponse } from 'next';
 import { generateApolloClient } from '@deep-foundation/hasura/client.js';
-import { DeepClient } from '@deep-foundation/deeplinks';
+import { DeepClient, toPlain, useDeep } from '@deep-foundation/deeplinks';
 import axios from 'axios';
+import React, { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';
 
 let _path, _ssl = true;
 try { _path = process.env.GQL || process.env.NEXT_PUBLIC_GRAPHQL_URL || 'https://deeplinks.deep.foundation/gql' } catch(e) {}
@@ -16,6 +17,19 @@ type Preloaded = {
     packages: any[];
 }
 
+export function toPlainPackages(packages) {
+  const plain = [];
+  for (let l = 0; l < packages.data.length; l++) {
+    const link = packages.data[l];
+    plain.push(toPlain(link));
+    for (let v = 0; v < link._version.length; v++) {
+      const version = link._version[v];
+      plain.push(toPlain(version));
+    }
+  }
+  return plain;
+}
+
 export async function preloadQueries(deep) {
     const Preload = await deep.id('@deep-foundation/preload', 'Preload', true);
     const packagesQ = {
@@ -112,4 +126,85 @@ export async function getServerSidePropsPreload(arg, result) {
   result.props.preloaded = preload.data;
   console.log('getServerSidePropsPreload', { packages: preload.data.packages.length, handlers: preload.data.handlers.length });
   return result;
+}
+
+export const PreloadContext = createContext<[boolean, () => Promise<void>]>(undefined);
+export function usePreload() { return useContext(PreloadContext); }
+export const HandlersContext = createContext<any>([]);
+export function useHandlersContext() { return useContext(HandlersContext); }
+
+export function PreloadProviderCore({
+  preloaded = {},
+  children = null,
+}: {
+  preloaded?: { packages?: any[]; handlers?: any[]; };
+  children?: any;
+}) {
+  const deep = useDeep();
+  const [handlers, setHandlers] = useState(preloaded?.handlers || []);
+  useMemo(() => {
+    // @ts-ignore
+    // console.log('preloaded useMemo[]', preloaded?.packages);
+    deep.minilinks.add(preloaded?.packages || [], 'preloader-packages');
+    // const i = setInterval(() => {
+    //   if (!!deep?.minilinks?.links?.length) {
+    //     setIsPreloaded(true);
+    //     clearInterval(i);
+    //   }
+    // }, 100);
+    // return () => clearInterval(i);
+  }, []);
+  const [isPreloaded, setIsPreloaded] = useState(!!deep?.minilinks?.links?.length);
+  const reload = useCallback(async () => {
+    deep.minilinks.apply(await deep.select({
+      type_id: { _nin: [
+        deep.idLocal('@deep-foundation/core', 'Promise'),
+        deep.idLocal('@deep-foundation/core', 'Then'),
+        deep.idLocal('@deep-foundation/core', 'Rejected'),
+        deep.idLocal('@deep-foundation/core', 'Resolved'),
+        deep.idLocal('@deep-foundation/core', 'PromiseResult'),
+      ] },
+      up: {
+        tree_id: { _eq: deep.idLocal('@deep-foundation/core', 'containTree') },
+        parent: {
+          type_id: { _eq: deep.idLocal('@deep-foundation/core', 'Package') },
+          string: {}
+        },
+      },
+    }), 'preloader');
+  }, []);
+  const _handlers = deep.useSubscription({
+    execution_provider_id: { _eq: deep.idLocal('@deep-foundation/core', 'JSExecutionProvider') },
+    return: {
+      dist: { relation: 'dist' }
+    },
+  }, { table: 'handlers' });
+  useEffect(() => {
+    if (!!_handlers?.data?.length) setHandlers(_handlers?.data);
+  }, [_handlers]);
+  const value: [boolean, () => Promise<void>] = useMemo(() => ([isPreloaded, reload]), [isPreloaded]);
+  const handlersRef = useRef<any>(handlers);
+  handlersRef.current = handlers;
+  return <PreloadContext.Provider value={value}>
+    <HandlersContext.Provider value={handlersRef}>
+      {children}
+    </HandlersContext.Provider>
+  </PreloadContext.Provider>
+}
+
+export function PreloadProvider({
+  preloaded = {},
+  Editor,
+  children = null,
+}: {
+  preloaded?: { packages?: any[]; handlers?: any[]; };
+  Editor: any;
+  children?: any;
+ }) {
+  const deep = useDeep();
+  // return <GoEditorProvider Editor={Editor}>
+  return <>
+    {deep ? [<PreloadProviderCore key={deep.linkId} preloaded={preloaded} children={children}/>] : children};
+  </>;
+  {/* </GoEditorProvider> */}
 }
diff --git a/imports/react-handler.tsx b/imports/react-handler.tsx
@@ -5,7 +5,6 @@ import { ClientHandler, HandlerConfigContext, HandlersGoContext, useFindClientHa
 import { Alert, AlertIcon, AlertTitle, Box, Button, Flex, Modal, ModalBody, ModalContent, ModalOverlay, Skeleton, useDisclosure, VStack } from '@chakra-ui/react';
 import React from 'react';
 
-import { Editor } from './editor.js';
 import { GoI, GoProvider, useGoCore } from './go.js';
 
 import $ from 'jquery';
@@ -86,7 +85,7 @@ export function ClientHandlerErrorComponent({
               </Button>
             </Alert>
             <Box>
-              <Editor
+              <go.Editor
                 value={JSON.stringify(error, Object.getOwnPropertyNames(error), 2)}
                 editable={false} readOnly
               />
@@ -100,7 +99,7 @@ export function ClientHandlerErrorComponent({
               <Button variant={mode === 'dist' ? 'active' : undefined} onClick={() => setMode('dist')}>dist</Button>
               <Button variant={mode === 'src' ? 'active' : undefined} onClick={() => setMode('src')}>src</Button>
             </Alert>
-            {!!content?.[_mode] && [<Box flex={1} key={_mode}><Editor fillSize
+            {!!content?.[_mode] && [<Box flex={1} key={_mode}><go.Editor fillSize
               linkId={content?.[_mode]?.id}
             /></Box>]}
           </Flex>
@@ -156,7 +155,7 @@ export function ReactHandlerEditor({
             {!!f.dist && <Button h='3em' variant={file === f.dist ? 'active' : null} onClick={() => setFile(f.dist)}>dist</Button>}
           </React.Fragment>)}</Box>
           <Box flex={1}>
-            {!loading && !!file && [<Editor key={file.id}
+            {!loading && !!file && [<go.Editor key={file.id}
               linkId={file.id} fillSize
               onSave={() => {
                 reloadHandler();

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@deep-foundation/perception-imports",
-  "version": "0.0.130",
+  "version": "0.0.131",
   "license": "Unlicense",
   "type": "module",
   "main": "import.js",