zudoku 0.3.0-dev.74 → 0.3.0-dev.75

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zudoku",
-  "version": "0.3.0-dev.74",
+  "version": "0.3.0-dev.75",
   "type": "module",
   "files": [
     "dist",

package/src/lib/authentication/Callback.tsx

@@ -55,6 +55,4 @@ export function Callback({
       </div>
     );
   }
-
-  return <div>Loading...</div>;
 }

package/src/lib/components/DevPortal.tsx

@@ -8,6 +8,7 @@ import {
   useContext,
   useEffect,
   useMemo,
+  useRef,
   useState,
 } from "react";
 import { ErrorBoundary } from "react-error-boundary";
@@ -52,8 +53,10 @@ const DevPortalInner = ({
     () => ({ ...MdxComponents, ...props.mdx?.components }),
     [props.mdx?.components],
   );
+  const [isInitialized, setIsInitialized] = useState(false);
   const { stagger } = useContext(StaggeredRenderContext);
   const [didNavigate, setDidNavigate] = useState(false);
+  const initRef = useRef<"idle" | "pending" | "done">("idle");
   const staggeredValue = useMemo(
     () => (didNavigate ? { stagger: true } : { stagger }),
     [stagger, didNavigate],
@@ -69,11 +72,25 @@ const DevPortalInner = ({
 
   const [devPortalContext] = useState(() => new DevPortalContext(props));
 
+  // TODO could be handled more elegantly
+  useEffect(() => {
+    if (initRef.current === "pending") return;
+    initRef.current = "pending";
+    void devPortalContext.initialize().then(() => {
+      initRef.current = "done";
+      setIsInitialized(true);
+    });
+  }, [devPortalContext]);
+
   const heads = props.plugins
     ?.filter(hasHead)
     // eslint-disable-next-line react/no-array-index-key
     .map((plugin, i) => <Fragment key={i}>{plugin.getHead?.()}</Fragment>);
 
+  if (!isInitialized) {
+    return null;
+  }
+
   return (
     <QueryClientProvider client={queryClient}>
       <Helmet>{heads}</Helmet>

package/src/lib/core/DevPortalContext.ts

@@ -113,16 +113,14 @@ export class DevPortalContext {
     this.authentication = config.authentication;
     this.meta = config.metadata;
     this.page = config.page;
-
-    void this.initialize();
   }
 
   initialize = async () => {
-    await Promise.all([
+    await Promise.all(
       this.plugins
         .filter(needsInitialization)
         .map((plugin) => plugin.initialize?.(this)),
-    ]);
+    );
   };
 
   invalidateCache = async (key: DevPortalCacheKey[]) => {