eddev 2.0.0-beta.52 → 2.0.0-beta.54

package/dist/app/lib/routing/types.d.ts

@@ -109,7 +109,13 @@ export type RouterAPI = {
     replaceQuery: (search: Record<string, string | string[]>) => void;
     /** Replace the hash */
     replaceHash: (hash: string) => void;
-    /** Handle link clicking events */
+    /**
+     * Handle a click event, potentially triggering a route change.
+     *
+     * @param e A pointer or mouse event.
+     * @param href An optional URL. This must be provided if no `href` property exists on the clicked element
+     * @param preferBack If set, clicking this link will send the user 'back', when clicking a link to the previous history item.
+     */
     handleClickEvent(e: PointerOrMouseEvent, href?: string, preferBack?: boolean | "exact"): void;
     /** A reference to the route loader (mostly for internal use) */
     loader: RouteLoader;
@@ -117,7 +123,7 @@ export type RouterAPI = {
     subscribe: (subscribe: RouterSubscriber) => () => void;
     /** This function is used by the routing system automatically */
     emitEvent: (event: RouterEvent) => void;
-    /** Returns the current RouterState */
+    /** Returns the current RouterAPIState */
     getState: () => RouterAPIState | null;
     /** Go back to a previous route in the history stack, or push it onto the stack if it isn't currently on the stack. */
     restoreRoute: (route: RouteState) => void;

package/dist/node/cli/cli-worker.js

@@ -106,7 +106,11 @@ if (!isMainThread) {
         pipeLog(frontendLog);
     }
     else if (mode === "graphql") {
-        const codegen = new GraphQLGenerator(project);
+        const codegen = new GraphQLGenerator(project, {
+            generate: true,
+            optimize: true,
+            watch: true,
+        });
         codegen.start();
         pipeLog(graphqlLog);
     }

package/dist/node/cli/cli.js

@@ -6,7 +6,7 @@ import { AdminBundler, adminLog } from "../compiler/bundler.admin.js";
 import { FrontendBundler, frontendLog } from "../compiler/bundler.frontend.js";
 import { DevServer, serverlessLog } from "../compiler/dev-server.js";
 import { createVinxiCodegen } from "../compiler/vinxi-codegen.js";
-import { graphqlLog } from "../graphql/graphql-codegen.js";
+import { GraphQLGenerator, graphqlLog } from "../graphql/graphql-codegen.js";
 import { BuildInfoWriter } from "../project/eddev-build-file.js";
 import { Project, projectLog } from "../project/project.js";
 import { describeBlockManifest } from "../types/block-type.js";
@@ -143,6 +143,9 @@ program
     .option("-s, --serverless", 'Build in "serverless" mode', false)
     .option("--verbose", "Show extra debugging info", false)
     .action(async (options) => {
+    process.env["NODE_ENV"] = "production";
+    /** Ignore self-signed certificate errors in dev mode */
+    process.env["NODE_TLS_REJECT_UNAUTHORIZED"] = "0";
     init(options.verbose);
     configureCliMode({
         interactive: false,
@@ -181,7 +184,10 @@ program
         const frontend = new FrontendBundler(project, {
             mode: "production",
         });
-        await Promise.all([admin.start(), frontend.start()]);
+        const graphql = new GraphQLGenerator(project, {
+            optimize: true,
+        });
+        await Promise.all([admin.start(), frontend.start(), graphql.start()]);
         console.log("Done building SPA WordPress");
     }
 });

package/dist/node/cli/display/CLIApp.js

@@ -37,7 +37,7 @@ export function CLIApp(props) {
                 process.stdout.write("\u001b[3J\u001b[1J");
                 console.clear();
                 props.logs.serverless?.resetLog();
-                redraw();
+                setImmediate(redraw);
             }
             else if (input === "q") {
                 process.exit(0);

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

@@ -1 +1 @@
-export declare const VERSION = "2.0.0-beta.52";
+export declare const VERSION = "2.0.0-beta.54";

package/dist/node/cli/version.js

@@ -1 +1 @@
-export const VERSION = "2.0.0-beta.52";
+export const VERSION = "2.0.0-beta.54";

package/dist/node/graphql/graphql-codegen.d.ts

@@ -1,7 +1,13 @@
 import { Project } from "../project/project.js";
 export declare const graphqlLog: import("../utils/stateful-log.js").StatefulLog<GraphQLGenerator>;
+type GraphQLGeneratorOptions = {
+    watch?: boolean;
+    optimize?: boolean;
+    generate?: boolean;
+};
 export declare class GraphQLGenerator {
     project: Project;
+    opts: GraphQLGeneratorOptions;
     private needsRegenerate;
     private needsReload;
     private regenerateReason;
@@ -9,14 +15,16 @@ export declare class GraphQLGenerator {
     private isGenerating;
     private schemaLoader;
     private fileLoader;
+    private optimizeWriter;
     private debouncer?;
     private retryTimer?;
-    constructor(project: Project);
+    constructor(project: Project, opts: GraphQLGeneratorOptions);
     queueRegenerate(full: boolean, reason: string, info?: string | string[]): Promise<void>;
     start(): Promise<void>;
     private listen;
     scheduleRetry(): void;
     generate(): Promise<void>;
+    private getOptimizedQueries;
     /**
      * Validates a GraphQL manifest against a schema, ensuring there are no user errors.
      */
@@ -28,3 +36,4 @@ export declare class GraphQLGenerator {
      */
     private writeSchemaFile;
 }
+export {};

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

@@ -1,5 +1,5 @@
 import { codegen } from "@graphql-codegen/core";
-import { Kind, visit } from "graphql";
+import { Kind, visit, print, } from "graphql";
 import { NoUnusedFragmentsRule, specifiedRules, validate } from "graphql/validation/index.js";
 import { join, relative, resolve } from "path";
 import { ProjectEnvUtils } from "../project/env.js";
@@ -16,6 +16,7 @@ import { watchFileTreeForChanges } from "../utils/watch-file-tree.js";
 import pluginFiles from "./plugins/gql-plugin-files.js";
 import pluginNoDuplicates from "./plugins/gql-plugin-no-duplicates.js";
 import pluginQueries from "./plugins/gql-plugin-queries.js";
+import { FSCodegen } from "../utils/fs-codegen.js";
 export const graphqlLog = createConsole("GraphQL Codegen", "graphql");
 const console = graphqlLog;
 class GraphQLValidationError {
@@ -49,6 +50,7 @@ class GraphQLValidationError {
 }
 export class GraphQLGenerator {
     project;
+    opts;
     needsRegenerate = false;
     needsReload = true;
     regenerateReason = "";
@@ -56,11 +58,13 @@ export class GraphQLGenerator {
     isGenerating = false;
     schemaLoader;
     fileLoader;
+    optimizeWriter;
     debouncer;
     retryTimer;
-    constructor(project) {
+    constructor(project, opts) {
         this.project = project;
-        this.schemaLoader = new GraphQLSchemaLoader(ProjectEnvUtils.get("DEBUG_GRAPHQL_URL"));
+        this.opts = opts;
+        this.schemaLoader = new GraphQLSchemaLoader(ProjectEnvUtils.getSafe("DEBUG_GRAPHQL_URL"));
         this.fileLoader = createGraphQLFileLoader(this.project, [
             {
                 baseFolder: "queries/fragments",
@@ -83,6 +87,38 @@ export class GraphQLGenerator {
                 key: "queries",
             },
         ]);
+        this.optimizeWriter = new FSCodegen(project, {
+            outDir: "./.eddev/queries",
+        });
+        this.optimizeWriter.register({
+            getFiles: async () => {
+                const files = await this.fileLoader.get();
+                const { queries, fragments } = this.getOptimizedQueries(files, true);
+                const optimizedQueries = Object.entries(queries).flatMap(([_, group]) => {
+                    return Object.entries(group).flatMap(([name, ast]) => {
+                        let content = [
+                            ast.leadingComments ? ast.leadingComments + "\n" : "",
+                            print(ast),
+                            ast.trailingComments ? "\n" + ast.trailingComments : "",
+                        ].join("");
+                        return {
+                            name,
+                            content,
+                        };
+                    });
+                });
+                return [
+                    ...optimizedQueries,
+                    {
+                        name: "fragments.json",
+                        content: JSON.stringify(Object.values(fragments).map(print), null, 2),
+                    },
+                ];
+            },
+            susbcribe: (callback) => {
+                return this.fileLoader.subscribe(callback);
+            },
+        });
     }
     async queueRegenerate(full, reason, info) {
         this.needsRegenerate = true;
@@ -107,14 +143,26 @@ export class GraphQLGenerator {
         // Do initial load of blocks
         await this.project.blocks.get();
         await this.project.views.get();
-        try {
-            await this.generate();
+        if (this.opts.generate) {
+            try {
+                await this.generate();
+            }
+            catch (err) { }
+        }
+        if (this.opts.watch) {
+            this.project.blocks.subscribeFuture(() => {
+                this.generateUtilTypes();
+            });
+            this.listen();
+        }
+        if (this.opts.optimize) {
+            if (this.opts.watch) {
+                await this.optimizeWriter.runAndWatch();
+            }
+            else {
+                await this.optimizeWriter.run();
+            }
         }
-        catch (err) { }
-        this.project.blocks.subscribeFuture(() => {
-            this.generateUtilTypes();
-        });
-        this.listen();
     }
     async listen() {
         // Subscribe to changes in block names
@@ -138,14 +186,23 @@ export class GraphQLGenerator {
             this.queueRegenerate(false, "GraphQL file(s) modifed", events?.map(stringifyFileEvent));
         });
         // Look out for PHP and acf-json file changes
-        watchFileTreeForChanges(["backend/**/*.php"], (event) => {
-            this.queueRegenerate(true, "PHP file change detected", stringifyFileEvent(event));
+        watchFileTreeForChanges({
+            pattern: ["backend/**/*.php"],
+            callback: (event) => {
+                this.queueRegenerate(true, "PHP file change detected", stringifyFileEvent(event));
+            },
         });
-        watchFileTreeForChanges(["vendor/**/*.php"], (change) => {
-            this.queueRegenerate(true, "PHP Vendor folder change detected", stringifyFileEvent(change));
+        watchFileTreeForChanges({
+            pattern: ["vendor/**/*.php"],
+            callback: (change) => {
+                this.queueRegenerate(true, "PHP Vendor folder change detected", stringifyFileEvent(change));
+            },
         });
-        watchFileTreeForChanges(["acf-json/**/*.json"], (change) => {
-            this.queueRegenerate(true, "ACF Field change detected", stringifyFileEvent(change));
+        watchFileTreeForChanges({
+            pattern: ["acf-json/**/*.json"],
+            callback: (change) => {
+                this.queueRegenerate(true, "ACF Field change detected", stringifyFileEvent(change));
+            },
         });
     }
     scheduleRetry() {
@@ -337,14 +394,9 @@ export class GraphQLGenerator {
             this.generate();
         }
     }
-    /**
-     * Validates a GraphQL manifest against a schema, ensuring there are no user errors.
-     */
-    validateGraphQLFiles(graphQLFiles, schema) {
-        /**
-         * Use all rules, except for No Unused Fragments — since we prepend those fragments to every test
-         */
-        const validationRules = specifiedRules.filter((rule) => rule !== NoUnusedFragmentsRule);
+    getOptimizedQueries(graphQLFiles, rewrite = false) {
+        const result = {};
+        const allFragments = {};
         /**
          * Get all the base fragment definitions
          */
@@ -355,7 +407,11 @@ export class GraphQLGenerator {
             .flat()
             .filter((n) => n.kind === Kind.FRAGMENT_DEFINITION)
             .forEach((node) => baseFragments.set(node.name.value, node));
+        baseFragments.forEach((node) => {
+            allFragments[node.name.value] = node;
+        });
         function findFragments(defs, map = new Map()) {
+            // console.log("findFragments", defs.length)
             for (let def of defs) {
                 if (def.kind === Kind.FRAGMENT_DEFINITION) {
                     map.set(def.name.value, def);
@@ -379,6 +435,40 @@ export class GraphQLGenerator {
                 definitions: defs.filter((n) => n.kind !== Kind.FRAGMENT_DEFINITION),
             };
         }
+        for (let [groupName, fileMap] of Object.entries(graphQLFiles)) {
+            result[groupName] = {};
+            for (let [path, file] of Object.entries(fileMap)) {
+                if (!file.parseError) {
+                    // Find all fragments
+                    const { fragments, definitions } = findFragments(file?.ast?.definitions ?? []);
+                    const ast = {
+                        kind: Kind.DOCUMENT,
+                        definitions: [...definitions, ...fragments],
+                        loc: file.ast.loc,
+                        leadingComments: file.leadingComments,
+                        trailingComments: file.trailingComments,
+                    };
+                    result[groupName][path] = ast;
+                }
+            }
+        }
+        return {
+            queries: result,
+            fragments: allFragments,
+        };
+    }
+    /**
+     * Validates a GraphQL manifest against a schema, ensuring there are no user errors.
+     */
+    validateGraphQLFiles(graphQLFiles, schema) {
+        /**
+         * Use all rules, except for No Unused Fragments — since we prepend those fragments to every test
+         */
+        const validationRules = specifiedRules.filter((rule) => rule !== NoUnusedFragmentsRule);
+        /**
+         * Get the optimized files — queries with all fragments included
+         */
+        const { queries } = this.getOptimizedQueries(graphQLFiles);
         /**
          * Only report the same error once (mostly for preventing repeats of the same fragment errors)
          */
@@ -388,18 +478,17 @@ export class GraphQLGenerator {
          */
         const report = [];
         for (let [groupName, fileMap] of Object.entries(graphQLFiles)) {
+            const group = queries[groupName];
             for (let [path, file] of Object.entries(fileMap)) {
                 if (file.parseError) {
                     report.push(new GraphQLValidationError(file.parseError.message, path, file.parseError.line, file.parseError.column, file.contents));
                 }
                 else {
                     // Find all fragments
-                    const { fragments, definitions } = findFragments(file?.ast?.definitions ?? []);
-                    const validationAST = {
-                        kind: Kind.DOCUMENT,
-                        definitions: [...fragments, ...definitions],
-                        loc: file.ast.loc,
-                    };
+                    const validationAST = group[path];
+                    if (!validationAST) {
+                        continue;
+                    }
                     const errors = validate(schema, validationAST, validationRules);
                     if (errors.length > 0) {
                         for (let error of errors) {

package/dist/node/graphql/plugins/gql-plugin-queries.js

@@ -67,7 +67,7 @@ export default {
                     // Another convention, the query name and file name should be the same
                     const baseName = basename(fileName);
                     if (baseName.replace(".graphql", "") !== name) {
-                        throwErrorAtLocation(item.name.loc, `Expected your query name and file name to match, for conventions sake (eg. '${baseName}' should be '${name}.graphql')`);
+                        throwErrorAtLocation(item.name.loc, `Expected GraphQL operation name to match the filename.\nYou should either:\na) rename the file to '${name}.graphql'\nb) rename the operation to '${baseName}'`);
                     }
                     // Only import variables if the operation has variables
                     if (variablesTypeName) {

package/dist/node/graphql/query-files-loader.d.ts

@@ -10,6 +10,8 @@ type Entry = {
         line?: number;
         column?: number;
     } | null;
+    leadingComments?: string;
+    trailingComments?: string;
 };
 export type GraphQLManifest<TKeys extends string> = {
     [K in TKeys]: {
@@ -21,6 +23,7 @@ type PatternMap<TKeys extends string> = {
     key: TKeys;
     baseFolder: string;
     pattern: string;
+    ignore?: string[];
 }[];
 export declare function createGraphQLFileLoader<TKeys extends string>(project: Project, patterns: PatternMap<TKeys>): import("../project/manifest/manifest.js").ManifestGenerator<Entry, GraphQLManifest<TKeys>>;
 export {};

package/dist/node/graphql/query-files-loader.js

@@ -7,6 +7,7 @@ export function createGraphQLFileLoader(project, patterns) {
     return createManifestGenerator({
         baseDir: project.rootDir,
         pattern: patterns.map((p) => join(p.baseFolder, p.pattern)),
+        ignore: patterns.flatMap((p) => p.ignore?.map((ignore) => join(p.baseFolder, ignore)) ?? []),
         watch: cliMode.watch,
         async generateManifest(entries) {
             let result = {};
@@ -32,6 +33,8 @@ export function createGraphQLFileLoader(project, patterns) {
             const contents = await fs.readFile(path, "utf8");
             let ast = null;
             let parseError = null;
+            const leadingComments = contents.match(/^(\n|#[^\n]*)+\n/)?.[0].trim();
+            const trailingComments = contents.match(/(\n|#[^\n]*)+$/)?.[0].trim();
             try {
                 ast = parse(contents);
             }
@@ -48,6 +51,8 @@ export function createGraphQLFileLoader(project, patterns) {
                 contents,
                 ast,
                 parseError,
+                leadingComments,
+                trailingComments,
             };
         },
     });

package/dist/node/project/manifest/manifest.d.ts

@@ -8,6 +8,7 @@ type ManifestEntry<TEntryData> = {
 type ManifestGeneratorArgs<TEntryData, TManifest> = {
     baseDir: string;
     pattern: string | string[];
+    ignore?: string[];
     watch: boolean;
     loadValue: (path: string, key: string) => Promise<TEntryData>;
     getKey: (path: string) => string | null;

package/dist/node/project/manifest/manifest.js

@@ -31,20 +31,24 @@ export function createManifestGenerator(args) {
                 }
             };
             if (args.watch) {
-                const disposer = await watchFileTree(args.pattern, (fileList, event) => {
-                    files = fileList;
-                    cache = new Map();
-                    if (args.onFileChange)
-                        fileList.forEach(args.onFileChange);
-                    update();
-                    if (event) {
-                        events.push(event);
-                    }
+                const disposer = await watchFileTree({
+                    pattern: args.pattern,
+                    ignore: args.ignore,
+                    callback: (fileList, event) => {
+                        files = fileList;
+                        cache = new Map();
+                        if (args.onFileChange)
+                            fileList.forEach(args.onFileChange);
+                        update();
+                        if (event) {
+                            events.push(event);
+                        }
+                    },
                 });
                 disposers.push(disposer);
             }
             else {
-                files = await getFileTree(args.pattern);
+                files = await getFileTree({ pattern: args.pattern, ignore: args.ignore });
                 update();
             }
         });

package/dist/node/utils/fs-codegen.d.ts

@@ -15,6 +15,7 @@ export declare class FSCodegen {
     project: Project;
     opts: {
         outDir: string;
+        onWritten?: (opts: Set<string>) => void;
     };
     outDir: string;
     private generators;
@@ -23,6 +24,7 @@ export declare class FSCodegen {
     private flushScheduled;
     constructor(project: Project, opts: {
         outDir: string;
+        onWritten?: (opts: Set<string>) => void;
     });
     register(generator: CodeGenerator): void;
     registerFile({ name, generate, subscribe, }: {

package/dist/node/utils/fs-codegen.js

@@ -77,7 +77,7 @@ export class FSCodegen {
     }
     async flush() {
         const files = Array.from(this.generatorFiles.values()).flat();
-        const existing = (await globby(this.outDir + "/**/*")).map((path) => resolve(this.project.rootDir, path));
+        const existing = (await globby(join(this.outDir, "/**/*"))).map((path) => resolve(this.project.rootDir, path));
         const written = new Set();
         await Promise.all(files.map(async (file) => {
             const path = join(this.project.rootDir, this.outDir, file.name);
@@ -89,6 +89,7 @@ export class FSCodegen {
                 await fs.rm(path);
             }
         }));
+        this.opts.onWritten?.(written);
     }
     stop() {
         this.unsubscribers.forEach((unsub) => unsub());

package/dist/node/utils/watch-file-tree.d.ts

@@ -5,7 +5,21 @@ export type FileEvent = {
     type: FileWatchEvent;
     file: string;
 };
-export declare function watchFileTree(pattern: string | string[], callback: (files: FileList, event?: FileEvent) => void): Promise<Disposer>;
-export declare function watchFileTreeForChanges(pattern: string | string[], callback: (event: FileEvent) => void): Promise<Disposer>;
-export declare function getFileTree(pattern: string | string[]): Promise<FileList>;
+type WatchTreeOpts = {
+    pattern: string | string[];
+    ignore?: string[];
+    callback: (files: FileList, event?: FileEvent) => void;
+};
+export declare function watchFileTree({ pattern, callback, ignore }: WatchTreeOpts): Promise<Disposer>;
+type WatchTreeChangesOpts = {
+    pattern: string | string[];
+    ignore?: string | RegExp | string[];
+    callback: (event: FileEvent) => void;
+};
+export declare function watchFileTreeForChanges({ pattern, callback, ignore }: WatchTreeChangesOpts): Promise<Disposer>;
+type GetTreeOpts = {
+    pattern: string | string[];
+    ignore?: string[];
+};
+export declare function getFileTree(opts: GetTreeOpts): Promise<FileList>;
 export {};

package/dist/node/utils/watch-file-tree.js

@@ -1,11 +1,13 @@
 import chokidar from "chokidar";
 import { globby } from "globby";
-export function watchFileTree(pattern, callback) {
+export function watchFileTree({ pattern, callback, ignore }) {
     const files = [];
     let ready = false;
     return new Promise((resolve) => {
         const watcher = chokidar
-            .watch(pattern)
+            .watch(pattern, {
+            ignored: ignore,
+        })
             .on("add", (path) => {
             files.push(path);
             if (ready)
@@ -31,7 +33,7 @@ export function watchFileTree(pattern, callback) {
         });
     });
 }
-export function watchFileTreeForChanges(pattern, callback) {
+export function watchFileTreeForChanges({ pattern, callback, ignore }) {
     let ready = false;
     return new Promise((resolve) => {
         const watcher = chokidar
@@ -50,9 +52,14 @@ export function watchFileTreeForChanges(pattern, callback) {
         })
             .on("ready", () => {
             ready = true;
+            resolve(() => {
+                watcher.close();
+            });
         });
     });
 }
-export function getFileTree(pattern) {
-    return globby(pattern);
+export function getFileTree(opts) {
+    return globby(opts.pattern, {
+        ignore: opts.ignore,
+    });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eddev",
-  "version": "2.0.0-beta.52",
+  "version": "2.0.0-beta.54",
   "description": "",
   "main": "index.js",
   "type": "module",