eddev 2.0.0-beta.31 → 2.0.0-beta.33

package/dist/app/lib/devtools/components/BreakpointIndicator.js

@@ -1,7 +1,7 @@
 import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEffect, useMemo, useRef, useState } from "react";
-import { useTailwindConfig } from "../hooks/useTailwind.js";
 import { usePersistState } from "../hooks/usePersistState.js";
+import { useTailwindConfig } from "../hooks/useTailwind.js";
 function parseBreakpointMin(breakpoint) {
     return parseInt(breakpoint);
 }

package/dist/app/lib/devtools/components/DevUI.js

@@ -1,6 +1,7 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import "../../../../../css/devtools.css";
 import { BreakpointIndicator } from "./BreakpointIndicator.js";
+import { GridIndicator } from "./GridIndicator";
 export default function DevUI() {
-    return (_jsx("div", { className: "eddev-ui", children: _jsx(BreakpointIndicator, {}) }));
+    return (_jsxs("div", { className: "eddev-ui", children: [_jsx(BreakpointIndicator, {}), _jsx(GridIndicator, {})] }));
 }

package/dist/app/lib/devtools/components/GridIndicator.d.ts

@@ -0,0 +1 @@
+export declare function GridIndicator(): import("react/jsx-runtime").JSX.Element | null;

package/dist/app/lib/devtools/components/GridIndicator.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect } from "react";
+import { usePersistState } from "../hooks/usePersistState.js";
+export function GridIndicator() {
+    const [enabled, setEnabled] = usePersistState("gridOverlayEnabled", false);
+    useEffect(() => {
+        const handleKeyDown = (e) => {
+            if (e.key === "g" && e.ctrlKey) {
+                setEnabled((e) => !e);
+            }
+        };
+        window.addEventListener("keydown", handleKeyDown);
+        return () => {
+            window.removeEventListener("keydown", handleKeyDown);
+        };
+    }, []);
+    const cols = [];
+    for (let i = 0; i < 12; i++) {
+        cols.push(_jsx("div", { style: { height: "100%", backgroundColor: "rgba(255,0,0,0.1)" } }));
+    }
+    if (!enabled)
+        return null;
+    return (_jsx("div", { style: { position: "fixed", inset: 0, zIndex: 999999999, pointerEvents: "none" }, children: _jsx("div", { className: "grid-auto", style: { height: "100%" }, children: cols }) }));
+}

package/dist/app/lib/devtools/hooks/usePersistState.d.ts

@@ -1 +1 @@
-export declare function usePersistState<T>(id: string, initial: T): [T, (value: T) => void];
+export declare function usePersistState<T>(id: string, initial: T): [T, (value: T | ((current: T) => T)) => void];

package/dist/app/lib/devtools/hooks/usePersistState.js

@@ -24,8 +24,17 @@ export function usePersistState(id, initial) {
     return [
         value,
         (value) => {
-            set(id, value);
-            setValue(value);
+            if (typeof value === "function") {
+                return setValue((cur) => {
+                    const next = value(cur);
+                    set(id, next);
+                    return next;
+                });
+            }
+            else {
+                set(id, value);
+                setValue(value);
+            }
         },
     ];
 }

package/dist/app/lib/devtools/loader.js

@@ -1,14 +1,15 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect } from "react";
-import { dynamic } from "../dynamic/dynamic.js";
+import { lazy, useEffect } from "react";
 import { usePersistState } from "./hooks/usePersistState.js";
 import { useIsSSR } from "../routing/hooks/useIsSSR.js";
-const DevUI = dynamic(() => import("./components/DevUI.js"));
+const DevUI = lazy(() => import("./components/DevUI.js"));
 export function DevUILoader() {
     const ssr = useIsSSR();
-    const [render, setRender] = usePersistState("enable_devui", typeof window !== "undefined" && (env.dev || window["ENABLE_DEV_UI"]));
+    const [render, setRender] = usePersistState("enable_devui", false);
     useEffect(() => {
-        if (document.location.search.includes("activate-dev-ui")) {
+        if (document.location.search.includes("activate-dev-ui") ||
+            window["ENABLE_DEV_UI"] ||
+            (env.client && env.dev)) {
             setRender(true);
         }
     }, []);

package/dist/app/server/render-ssr-page.js

@@ -6,11 +6,15 @@ import { SSRRoot } from "../entry/ssr-root.js";
 import { RouteLoader } from "../lib/routing/loader.js";
 export async function renderPageToSSRStream(pathname, initialData, serverContext) {
     const clientManifest = serverContext.runtime.getManifest("client");
+    // console.log("Rendering to SSR Stream, get assets")
     const assets = await clientManifest.inputs[clientManifest.handler].assets();
+    // console.log("Got assets", assets)
     const jsx = (_jsx(SSRRoot, { assets: _jsx(Suspense, { children: assets.map((m) => renderAsset(m)) }), metaTags: initialData?.meta?.head || [], pathname: pathname, initialData: initialData, loader: new RouteLoader() }));
     const stream = await new Promise(async (resolve, reject) => {
+        // console.log("Rendering to pipable")
         const stream = renderToPipeableStream(jsx, {
             onShellReady() {
+                // console.log("Shell ready")
                 resolve(stream);
             },
             onShellError(err) {

package/dist/app/server/server-context.js

@@ -76,7 +76,8 @@ export class ServerContext {
             _ssr: "1",
             _debug: this.dev ? "1" : undefined,
         });
-        return this.fetchOrigin(fetchUrl, {
+        // console.log("Fetching route data", req.pathname)
+        const result = this.fetchOrigin(fetchUrl, {
             cache: "no-cache",
             replaceUrls: true,
             headers: {
@@ -85,8 +86,11 @@ export class ServerContext {
                 ...this.extractRequestHeaders(req.headers),
             },
         });
+        // console.log("Finished fetching route data")
+        return result;
     }
     async fetchAppData(req) {
+        // console.log("Fetching app data")
         const response = await this.fetchOrigin("/_appdata", {
             cache: "no-cache",
             replaceUrls: true,
@@ -96,7 +100,10 @@ export class ServerContext {
                 ...(req?.headers ? this.extractRequestHeaders(req.headers) : {}),
             },
         });
-        return response.json();
+        // console.log("Decoding app data")
+        const result = await response.json();
+        // console.log("Done with app done")
+        return result;
     }
     extractRequestHeaders(req) {
         const headers = {};

package/dist/node/cli/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "2.0.0-beta.31";
+export declare const VERSION = "2.0.0-beta.33";

package/dist/node/cli/version.js

@@ -1 +1 @@
-export const VERSION = "2.0.0-beta.31";
+export const VERSION = "2.0.0-beta.33";

package/dist/node/compiler/dev-server.js

@@ -25,12 +25,14 @@ export class DevServer {
     }
     async start() {
         console.setWorking(true);
+        // console.log("Setting up vinxi codegen")
         const codegen = createVinxiCodegen({
             mode: "development",
             project: this.project,
             serverless: true,
         });
         await codegen.runAndWatch();
+        // console.log("Has run once")
         const app = createVinxiApp({
             mode: "development",
             origin: this.origin,
@@ -45,7 +47,9 @@ export class DevServer {
             process.env.NITRO_PRESET ??
             process.env.NITRO_TARGET ??
             (process.versions.bun !== undefined ? "bun" : "node-server");
+        // console.log("Ensuring self signed cert")
         const keys = await ensureSelfSignedCert(this.hostname, this.project.rootDir);
+        // console.log("Done")
         const httpsConfig = {
             cert: keys.certFile,
             key: keys.keyFile,
@@ -61,6 +65,7 @@ export class DevServer {
                 devApp = args.devApp;
             },
         });
+        // console.log("Creating dev server")
         await createDevServer(app, {
             force: false,
             devtools: false,
@@ -71,11 +76,13 @@ export class DevServer {
             preset: preset,
             https: httpsConfig,
         });
+        // console.log("Rnning listen hook")
         // @ts-ignore
         await app.hooks.callHook("app:dev:server:listener:creating", {
             app,
             devApp,
         });
+        // console.log("Creating another listener")
         const listener = await devApp.listen(this.port, {
             hostname: this.hostname,
             port: this.port,
@@ -88,6 +95,7 @@ export class DevServer {
             devApp,
             listener,
         });
+        // console.log("Listening")
         console.setWorking(false);
         console.setState({
             serverlessUrl: this.hostOrigin,

package/dist/node/compiler/vinxi-codegen.js

@@ -1,4 +1,4 @@
-import { code } from "ts-poet";
+import { code, imp } from "ts-poet";
 import { FSCodegen } from "../utils/fs-codegen.js";
 export function getVinxiFolder(opts) {
     return (opts.mode === "development" ? "dev" : "prod") + (opts.serverless ? "" : "-spa");
@@ -410,12 +410,17 @@ export function createVinxiCodegen(opts) {
             return code /* ts */ `
         import { viewManifestReader } from 'eddev/_internal'
         import { dynamic } from 'eddev/dynamic'
-        const manifest = {${Object.entries(viewManifest.views)
-                .map(([name, view]) => {
-                const importStatement = `dynamic(() => import(${JSON.stringify("../../../" + view.fileName)}))`;
-                return JSON.stringify(view.slug) + ": " + importStatement;
-            })
-                .join(",\n")}}
+        const manifest = {${Object.entries(viewManifest.views).map(([name, view]) => {
+                const src = "../../../" + view.fileName;
+                let importStatement;
+                if (name.startsWith("_")) {
+                    importStatement = imp(name + "=" + src);
+                }
+                else {
+                    importStatement = code `dynamic(() => import(${JSON.stringify(src)}))`;
+                }
+                return code `${JSON.stringify(view.slug)}: ${importStatement},\n`;
+            })}}
 
         viewManifestReader.value = manifest
         

package/dist/node/graphql/graphql-codegen.js

@@ -1,5 +1,5 @@
 import { codegen } from "@graphql-codegen/core";
-import { Kind } from "graphql";
+import { Kind, visit } from "graphql";
 import { NoUnusedFragmentsRule, specifiedRules, validate } from "graphql/validation/index.js";
 import { join, relative, resolve } from "path";
 import { ProjectEnvUtils } from "../project/env.js";
@@ -62,6 +62,11 @@ export class GraphQLGenerator {
         this.project = project;
         this.schemaLoader = new GraphQLSchemaLoader(ProjectEnvUtils.get("DEBUG_GRAPHQL_URL"));
         this.fileLoader = createGraphQLFileLoader(this.project, [
+            {
+                baseFolder: "queries/fragments",
+                pattern: "**/*.graphql",
+                key: "fragments",
+            },
             {
                 baseFolder: "blocks",
                 pattern: "**/*.graphql",
@@ -72,11 +77,6 @@ export class GraphQLGenerator {
                 pattern: "**/*.graphql",
                 key: "views",
             },
-            {
-                baseFolder: "queries/fragments",
-                pattern: "**/*.graphql",
-                key: "fragments",
-            },
             {
                 baseFolder: "queries",
                 pattern: "**/*.graphql",
@@ -345,6 +345,44 @@ export class GraphQLGenerator {
          * Use all rules, except for No Unused Fragments — since we prepend those fragments to every test
          */
         const validationRules = specifiedRules.filter((rule) => rule !== NoUnusedFragmentsRule);
+        /**
+         * Get all the base fragment definitions
+         */
+        const baseFragments = new Map();
+        Object.values(graphQLFiles.fragments)
+            .map((file) => file?.ast?.definitions ?? [])
+            .filter((def) => def.length > 0)
+            .flat()
+            .filter((n) => n.kind === Kind.FRAGMENT_DEFINITION)
+            .forEach((node) => baseFragments.set(node.name.value, node));
+        function findFragments(defs, map = new Map()) {
+            for (let def of defs) {
+                if (def.kind === Kind.FRAGMENT_DEFINITION) {
+                    map.set(def.name.value, def);
+                }
+            }
+            for (let def of defs) {
+                visit(def, {
+                    FragmentSpread: {
+                        enter: (node) => {
+                            const match = baseFragments.get(node.name.value);
+                            if (match && !map.has(node.name.value)) {
+                                map.set(node.name.value, match);
+                                findFragments([match], map);
+                            }
+                        },
+                    },
+                });
+            }
+            return {
+                fragments: [...map.values()],
+                definitions: defs.filter((n) => n.kind !== Kind.FRAGMENT_DEFINITION),
+            };
+        }
+        /**
+         * Only report the same error once (mostly for preventing repeats of the same fragment errors)
+         */
+        const errorsShown = new Map();
         /**
          * Validate everything
          */
@@ -356,19 +394,25 @@ export class GraphQLGenerator {
                 }
                 else {
                     // Find all fragments
-                    const fragments = Object.values(graphQLFiles.fragments)
-                        .map((file) => file.ast.definitions)
-                        .filter((def) => def.length > 0)
-                        .filter((def) => def !== file.ast.definitions)
-                        .flat();
+                    const { fragments, definitions } = findFragments(file?.ast?.definitions ?? []);
                     const validationAST = {
                         kind: Kind.DOCUMENT,
-                        definitions: [...fragments, ...file.ast.definitions],
+                        definitions: [...fragments, ...definitions],
                         loc: file.ast.loc,
                     };
                     const errors = validate(schema, validationAST, validationRules);
                     if (errors.length > 0) {
                         for (let error of errors) {
+                            if (error.nodes && error.nodes[0]) {
+                                const node = error.nodes[0];
+                                if (errorsShown.has(node) && errorsShown.get(node)?.includes(error.message)) {
+                                    continue;
+                                }
+                                else {
+                                    errorsShown.set(node, [...(errorsShown.get(node) ?? []), error.message]);
+                                }
+                            }
+                            // console.log(error.nodes?.map((n) => n.kind))
                             report.push(new GraphQLValidationError(error.message, path, error.locations?.[0].line || 1, error.locations?.[0].column || 1, error.source?.body || ""));
                         }
                     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eddev",
-  "version": "2.0.0-beta.31",
+  "version": "2.0.0-beta.33",
   "description": "",
   "main": "index.js",
   "type": "module",
@@ -102,6 +102,7 @@
     "obj-console": "^1.0.2",
     "object-code": "^1.3.3",
     "qs": "^6.13.0",
+    "react-super-seo": "^1.1.9",
     "ts-poet": "^6.6.0",
     "ufo": "^1.3.1",
     "undent": "^0.1.0",