fix: unblock fresh-clone editor boot

CONTRIBUTING.md

@@ -2,13 +2,16 @@
 
 ---
 
-First, clone the repo with git submodules (optional. using Github Desktop will automatically clone the submodules for you)
+First, clone the repo with git submodules (required for canvas/WASM builds; GitHub Desktop clones submodules automatically).
 
 ```bash
 # clone the repo
 git clone --recurse-submodules https://github.com/gridaco/grida
 cd grida
 
+# or, if you already cloned without --recurse-submodules
+git submodule update --init
+
 # setup node & package manager
 nvm use
 corepack enable pnpm

README.md

@@ -180,7 +180,7 @@ Docs: [@grida/refig](https://grida.co/docs/packages/@grida/refig)
 
 ## Quickstart (monorepo)
 
-**Requirements:** Node.js **22+**, pnpm **10+**
+**Requirements:** Node.js **24+**, pnpm **10+**
 
 ```bash
 pnpm install

editor/.env.example

@@ -25,7 +25,7 @@ NEXT_PUBLIC_SUPABASE_URL_RR_AP_NORTHEAST_2=...
 # [insiders config]
 # flag to use unsafe sandbox (set 1 to enable)
 NEXT_PUBLIC_GRIDA_UNSAFE_DEVELOPER_SANDBOX='0'
-NEXT_PUBLIC_GRIDA_WASM_DEV_SERVE_URL='http://localhost:4020/dist' # set to use locally served wasm (dev)
+# NEXT_PUBLIC_GRIDA_WASM_DEV_SERVE_URL='http://localhost:4020/dist' # opt-in: use locally served wasm (requires `just build canvas wasm && just serve canvas wasm`). Leave unset to fetch the published wasm from unpkg.
 NEXT_PUBLIC_GRIDA_WASM_VERBOSE='0' # set 1 to inspect (log) the wasm api
 NEXT_PUBLIC_GRIDA_USE_INSIDERS_AUTH='1'
 NEXT_PUBLIC_GRIDA_LOCALHOST_REGION="us-west-1"

editor/app/(www)/(home)/_home/content-1.tsx

@@ -78,15 +78,15 @@ export default function Content1() {
       </Carousel>
       {/* body */}
       <div className="min-h-96 h-[300px] sm:h-[400px] md:h-[600px] lg:h-[800px] w-full flex items-start justify-center">
-        <BigImageContainer key={index} {...img} alt={categories[index]} />
+        {img && (
+          <BigImageContainer key={index} src={img} alt={categories[index]} />
+        )}
       </div>
     </div>
   );
 }
 
 function BigImageContainer({
-  width,
-  height,
   alt = "",
   ...props
 }: React.ComponentProps<typeof Image>) {
@@ -97,7 +97,7 @@ function BigImageContainer({
       animate={{ opacity: 1 }}
       transition={{ duration: 1 }}
     >
-      <Image {...props} width={width} height={height} alt={alt} />
+      <Image {...props} alt={alt} />
     </motion.div>
   );
 }

editor/grida-canvas-react-starter-kit/starterkit-loading/loading.tsx

@@ -197,18 +197,17 @@ export function FullscreenLoadingOverlay({
   errmsg,
 }: FullscreenLoadingOverlayProps) {
   const [showOverlay, setShowOverlay] = useState(true);
-  const [startTime, setStartTime] = useState<number | null>(null);
+  const startTimeRef = useRef<number | null>(null);
 
   useEffect(() => {
     if (loading) {
-      setStartTime(Date.now());
+      startTimeRef.current = Date.now();
       setShowOverlay(true);
-    } else if (startTime) {
-      const elapsed = Date.now() - startTime;
+    } else if (startTimeRef.current) {
+      const elapsed = Date.now() - startTimeRef.current;
       const remaining = Math.max(0, minDuration - elapsed);
 
       if (remaining > 0) {
-        // Wait for minimum duration before hiding
         const timer = setTimeout(() => {
           setShowOverlay(false);
         }, remaining);
@@ -218,7 +217,7 @@ export function FullscreenLoadingOverlay({
         setShowOverlay(false);
       }
     }
-  }, [loading, minDuration, startTime]);
+  }, [loading, minDuration]);
 
   return (
     <AnimatePresence mode="wait" onExitComplete={onExitComplete}>

editor/grida-canvas/backends/wasm-locate-file.ts

@@ -9,8 +9,6 @@ export default function locateFile(...args: Args) {
   const [path, version] = args;
   if (process.env.NEXT_PUBLIC_GRIDA_WASM_DEV_SERVE_URL) {
     return `${process.env.NEXT_PUBLIC_GRIDA_WASM_DEV_SERVE_URL}/${path}`;
-  } else if (process.env.NODE_ENV === "development") {
-    return `http://localhost:4020/dist/${path}`;
   } else {
     return `https://unpkg.com/@grida/canvas-wasm@${version}/dist/${path}`;
   }