eddev 2.0.0-beta.24 → 2.0.0-beta.241

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

@@ -1,5 +1,8 @@
-import { code } from "ts-poet";
+import { camelCase, pascalCase } from "change-case-all";
+import { code, imp } from "ts-poet";
+import { ProjectEnvUtils } from "../project/env.js";
 import { FSCodegen } from "../utils/fs-codegen.js";
+import { getCacheConfig } from "./cache-config.js";
 export function getVinxiFolder(opts) {
     return (opts.mode === "development" ? "dev" : "prod") + (opts.serverless ? "" : "-spa");
 }
@@ -17,22 +20,26 @@ export function createVinxiCodegen(opts) {
     if (opts.serverless) {
         codegen.registerFile({
             name: "context.ts",
-            generate: () => {
+            generate: async () => {
                 const args = {
-                    dev: true,
+                    dev: opts.mode === "development",
                     origin: project.origin,
                     replaceUrls: {
                         from: project.origin,
                         to: opts.endpoint ?? "",
                         prefixes: [
-                            { prefix: "/wp-content/uploads", replace: project.config?.serverless.uploads === "proxy" },
-                            { prefix: "/wp-content/plugins", replace: project.config?.serverless.plugins === "proxy" },
+                            { prefix: "/wp-content/uploads", replace: project.config?.serverless.uploads === "remote" },
+                            { prefix: "/wp-content/plugins", replace: project.config?.serverless.plugins === "remote" },
                         ],
                     },
+                    rpcBases: (await project.serverRoutes.get()).bases ?? [],
+                    config: project.config,
+                    cacheConfig: getCacheConfig(project.origin, project.config),
                 };
                 return code /* tsx */ `
           import { ServerContext } from "eddev/server"
           import { getManifest } from "vinxi/manifest"
+          import { apiConfig } from 'eddev/hooks'
 
           ServerContext.setRuntime({
             getManifest
@@ -42,6 +49,8 @@ export function createVinxiCodegen(opts) {
                     .map(([key, value]) => `${key}: ${JSON.stringify(value)}`)
                     .join(",\n")}
           })
+
+          apiConfig.apiKey = ${JSON.stringify(ProjectEnvUtils.getSafe("SITE_API_KEY") ?? "")}
         `.toString();
             },
         });
@@ -81,7 +90,7 @@ export function createVinxiCodegen(opts) {
             return code /* tsx */ `
         ${opts.serverless ? `import "./react-shim.js"` : ""}
         ${opts.serverless ? `import "vinxi/client"` : ""}
-        import "../../views/index.css"
+        import "../../${project.cssEntryFile}"
         import "./manifest/admin"
         import "./manifest/blocks"
         import "./manifest/styles"
@@ -106,7 +115,7 @@ export function createVinxiCodegen(opts) {
            * Also ensures that the assets used during SSR are loaded.
            */
           import "vinxi/client"
-          import "../../views/index.css"
+          import "../../${project.cssEntryFile}"
           import "./manifest/blocks"
           import "./manifest/views"
           
@@ -117,6 +126,16 @@ export function createVinxiCodegen(opts) {
           import { createAssets } from "@vinxi/react"
           import { devToolsStore } from 'eddev/devtools'
 
+          ${process.env.VERCEL_SKEW_PROTECTION_ENABLED &&
+                    code /* tsx*/ `
+              // Skew protection
+              const updateSkewCookie = () => {
+                document.cookie = "__vdpl=${process.env.VERCEL_DEPLOYMENT_ID}; expires=" + new Date(Date.now() + 24 * 60 * 60 * 1000).toUTCString() + "; path=/"
+              }
+              window.onfocus = updateSkewCookie
+              updateSkewCookie()
+          `}
+
           // Set up a dynamic entry which will load the configured tailwind manifest
           devToolsStore.loadTailwindConfig = () => import('./manifest/tailwind-config.js')
 
@@ -129,15 +148,17 @@ export function createVinxiCodegen(opts) {
           window.$reactRoot =
             window.$reactRoot ||
             hydrateRoot(
-              document,
-              <SSRClientRoot assets={getAssets()} metaTags={window._PAGE_DATA.meta.head} />,
+              document.getElementById('root')!,
+              <React.Suspense><SSRClientRoot assets={getAssets()} metaTags={window._PAGE_DATA?.meta?.head} /></React.Suspense>,
+              {
+                identifierPrefix: "ed",
+              }
             )
 
           if (import.meta.hot) {
             import.meta.hot.accept((mod) => {
               if (mod) {
-                const Assets = createAssets(getManifest("client").handler, getManifest("client"))
-                const app = <SSRClientRoot assets={getAssets()} metaTags={window._PAGE_DATA.meta.head} />
+                const app = <React.Suspense><SSRClientRoot assets={getAssets()} metaTags={window._PAGE_DATA?.meta?.head} /></React.Suspense>
                 window.$reactRoot?.render(app)
               }
             })
@@ -160,7 +181,7 @@ export function createVinxiCodegen(opts) {
            */
           import "./manifest/blocks"
           import "./manifest/views"
-          import "../../views/index.css"
+          import "../../${project.cssEntryFile}"
           import { devToolsStore } from 'eddev/devtools'
           import { createRoot } from "react-dom/client"
           import { SPARoot } from "eddev/_internal/spa-root.js"
@@ -168,72 +189,55 @@ export function createVinxiCodegen(opts) {
 
           devToolsStore.loadTailwindConfig = () => import('./manifest/tailwind-config')
 
-          createRoot(document.getElementById("root")!).render(<SPARoot />)
+          createRoot(document.getElementById("root")!).render(<React.Suspense><SPARoot /></React.Suspense>)
         `;
             }
         },
     });
     if (opts.serverless) {
         codegen.registerFile({
-            name: "handler.data-api.ts",
+            name: "handler.bypass.ts",
             generate: code /* tsx */ `
         /// <reference types="vinxi/types/server" />
-        import { createRouter, eventHandler, getRouterParam, getQuery, getWebRequest, getRequestHeaders } from "vinxi/http"
-        import { serverContext } from "./context.js"
+        import { createRouter, eventHandler, getCookie, setCookie } from "vinxi/http"
+
+        const BYPASS_TOKEN = process.env.VERCEL_BYPASS_TOKEN
+        const COOKIE_NAME = "__prerender_bypass"
 
         const router = createRouter()
           .get(
-            "/route/",
+            "/enable",
             eventHandler(async (event) => {
-              const id = "/"
+              if (!BYPASS_TOKEN) return false
 
-              return await serverContext.fetchRouteData({
-                pathname: id,
-                withAppData: false,
+              setCookie(event, COOKIE_NAME, BYPASS_TOKEN, {
+                expires: new Date(Date.now() + 1000 * 60 * 60 * 24),
               })
+
+              return true
             }),
           )
           .get(
-            "/route/**:name",
+            "/disable",
             eventHandler(async (event) => {
-              const id = "/" + getRouterParam(event, "name")
+              setCookie(event, COOKIE_NAME, "")
 
-              return await serverContext.fetchRouteData({
-                pathname: id,
-                withAppData: false,
-              })
+              return true
             }),
           )
           .get(
-            "/query/**:name",
+            "/check",
             eventHandler(async (event) => {
-              const id = "/" + getRouterParam(event, "name")
-              const paramString = getQuery(event).params
+              const cookie = getCookie(event, COOKIE_NAME)
 
-              const params = typeof paramString === "string" && paramString.length ? JSON.parse(paramString) : {}
+              if (cookie === BYPASS_TOKEN) {
+                return true
+              }
 
-              return await serverContext.fetchNamedQuery({
-                name: id,
-                params: params,
-                headers: getRequestHeaders(event),
-              })
-            }),
-          )
-          .post(
-            "/mutation/**:name",
-            eventHandler(async (event) => {
-              const id = "/" + getRouterParam(event, "name")
-              const body = await getWebRequest(event).json()
-              return await serverContext.fetchMutation({
-                name: id,
-                body,
-                headers: {},
-              })
+              return false
             }),
           )
-
         export default router.handler
-
       `,
         });
     }
@@ -242,94 +246,237 @@ export function createVinxiCodegen(opts) {
             name: "handler.ssr-page.ts",
             generate: code /* tsx */ `
         /// <reference types="vinxi/types/server" />
-        import "../../views/index.css"
+        import "../../${project.cssEntryFile}"
         import "./manifest/blocks.js"
         import "./manifest/styles.js"
         import "./manifest/views.js"
-
-        import { proxyWpAdmin, renderPageToSSRStream } from "eddev/server"
-        import { eventHandler, getRequestURL, setResponseHeader, setResponseStatus } from "vinxi/http"
+        import "./context.js"
+        import { proxyWpAdmin, renderPage, renderPageForIndexing, ServerContext } from "eddev/server"
+        import {
+          createRouter,
+          eventHandler,
+          getQuery,
+          getRequestHeaders,
+          getRequestURL,
+          getRouterParam,
+          getWebRequest,
+          getCookie,
+          setCookie
+        } from "vinxi/http"
+        import { handleRPC } from "./rpc.js"
         import { serverContext } from "./context.js"
-        import { RouteData } from "eddev/routing"
+        import { getManifest } from "vinxi/manifest"
+        import { inspect } from "node:util"
+        import { withTrailingSlash } from 'ufo'
+        import { viewManifestReader, blockManifestReader } from 'eddev/_internal'
+
+        const router = createRouter()
+          .get(
+            "/_data/route/",
+            eventHandler(async (event) => {
+              const id = "/"
+              const url = getRequestURL(event)
+
+              return await serverContext.fetchRouteData({ pathname: id, newOrigin: url.origin, bypass: serverContext.shouldBypass(event) })
+            }),
+          )
+          .get(
+            "/_data/route/**:name",
+            eventHandler(async (event) => {
+              const id = "/" + getRouterParam(event, "name")
+              const url = getRequestURL(event)
+
+              return await serverContext.fetchRouteData({ pathname: id, newOrigin: url.origin, bypass: serverContext.shouldBypass(event) })
+            }),
+          )
+          .get(
+            "/_data/query/**:name",
+            eventHandler(async (event) => {
+              const url = getRequestURL(event)
+
+              const [id, paramString] = event.path.replace("/_data/query", "").split("=", 2)
+
+              let params = {}
+              try {
+                params =
+                  typeof paramString === "string" && paramString.length
+                    ? JSON.parse(decodeURIComponent(paramString.replace(/\\/$/, "")))
+                    : {}
+              } catch (e) {
+                throw new Error("Invalid query parameters")
+              }
+
+              return await serverContext.fetchNamedQuery({ name: id, newOrigin: url.origin, params: params, headers: getRequestHeaders(event), bypass: serverContext.shouldBypass(event) })
+            }),
+          )
+          .get(
+            "/_data/manifest/**:input",
+            eventHandler(async (event) => {
+              const manifest = getManifest("client")
+              const id = getRouterParam(event, "input")
+              const input = manifest.inputs[id === 'handler' ? manifest.handler : id]
+              const result = {
+                ...input,
+                id,
+                assets: await input.assets(),
+              }
+              const code = inspect(result, { depth: 10 })
+              return new Response(code, { headers: { "Content-Type": "text/plain" } })
+            }),
+          )
+          .post(
+            "/_data/mutation/**:name",
+            eventHandler(async (event) => {
+              const id = "/" + getRouterParam(event, "name")
+              const body = await getWebRequest(event).json()
+              return await serverContext.fetchMutation({ name: id, body, headers: getRequestHeaders(event) })
+            }),
+          )
+          .post(
+            "/_data/submit-gf",
+            eventHandler(async (event) => {
+              const req = getWebRequest(event)
+              const headers = new Headers(req.headers)
+              headers.delete("content-length")
+              headers.delete("host")
+              headers.delete("connection")
+              headers.delete("pragma")
+              return await serverContext.fetchOrigin("/wp-json/ed/v1/gf/submit/", {
+                method: "POST",
+                headers: headers,
+                body: await req.blob(),
+              })
+            }),
+          )
+        
+        const aiRouter = createRouter()
+          .get(
+            "/_ai/page",
+            eventHandler(async (event) => {
+              const id = "/"
+              const url = getRequestURL(event)
+              const page = await renderPageForIndexing({ pathname: id, newOrigin: url.origin, hostname: url.hostname })
+              return new Response(page.contents, {
+                headers: {
+                  "Content-Type": "text/html; charset=utf-8",
+                  "Cache-Control": "no-store",
+                },
+              })
+            }),
+          )
+          .get(
+            "/_ai/page/**:name",
+            eventHandler(async (event) => {
+              const id = "/" + getRouterParam(event, "name")
+              const url = getRequestURL(event)
+
+              const page = await renderPageForIndexing({ pathname: id, newOrigin: url.origin, hostname: url.hostname })
+              return new Response(page.contents, {
+                headers: {
+                  "Content-Type": "text/html; charset=utf-8",
+                  "Cache-Control": "no-store",
+                },
+              })
+            }),
+          )
 
         export default eventHandler({
           handler: async (event) => {
+            const serverContext = ServerContext.main
             const url = getRequestURL(event)
 
-            if (url.pathname.includes(".")) {
-              return proxyWpAdmin(event, serverContext)
+            await Promise.allSettled([viewManifestReader.preloadAll(), blockManifestReader.preloadAll()])
+
+            // RPC
+            const isRPC = serverContext.rpcBases.some((base) => url.pathname.startsWith(base))
+            if (isRPC) {
+              return handleRPC(event)
             }
 
-            try {
-              const [appData, response] = await Promise.all([
-                serverContext.fetchAppData(),
-                serverContext.fetchRouteData({
-                  pathname: url.pathname,
-                  withAppData: true,
-                  headers: {},
-                  query: {},
-                }),
-              ])
-
-              let data: RouteData
-              try {
-                data = await response.json()
-                data.appData = appData
-              } catch (err) {
-                data = {
-                  view: "_error",
-                  viewType: "react",
-                  viewData: {},
-                  appData: appData,
-                }
-                console.error(err)
-                setResponseStatus(event, 500)
-              }
-              setResponseHeader(event, "Content-Type", "text/html; charset=utf-8")
-              return renderPageToSSRStream(url.pathname, data, serverContext)
-            } catch (err) {
-              console.error(err)
-              setResponseStatus(event, 500)
-              setResponseHeader(event, "Content-Type", "text/html; charset=utf-8")
-              return '<!DOCTYPE html><html><head><title>500 Internal Server Error</title></head><body><h1>500 Internal Server Error</h1><p>"'+err.message+'"</p></body></html>'
+            // Data API
+            if (url.pathname.startsWith("/_data/")) {
+              return router.handler(event)
+            }
+
+            // LLM indexing route
+            if (url.pathname.startsWith("/_ai/")) {
+              return aiRouter.handler(event)
+            }
+
+            // Outdated build assets
+            if (url.pathname.match(/^\\/(_build|_admin)/)) {
+              return new Response("", { status: 404 })
+            }
+
+            // Proxy WordPress
+            if (url.pathname.includes(".") || url.pathname.startsWith("/graphql") || url.pathname.startsWith("/wp-")) {
+              return proxyWpAdmin(event)
+            }
+
+            // Enforce trailing slashes
+            if (!url.pathname.endsWith("/")) {
+              url.pathname = withTrailingSlash(url.pathname)
+              return Response.redirect(url, 301)
             }
+
+            ${process.env.VERCEL_SKEW_PROTECTION_ENABLED &&
+                code /* tsx*/ `
+                // Skew protection
+                setCookie(event, "__vdpl", ${JSON.stringify(process.env.VERCEL_DEPLOYMENT_ID ?? "")}, {
+                  httpOnly: false,
+                  path: "/",
+                })
+              `}
+
+            // SSR
+            return renderPage({ pathname: url.pathname, newOrigin: url.origin, hostname: url.hostname, bypass: serverContext.shouldBypass(event) })
           },
         })
     `,
         });
     }
     if (opts.serverless) {
-        codegen.registerFile({
-            name: "handler.wp-proxy.ts",
-            generate: code /* tsx */ `
-      /// <reference types="vinxi/types/server" />
-      import { proxyWpAdmin } from "eddev/server"
-      import { eventHandler } from "vinxi/http"
-      import { serverContext } from "./context.js"
-
-      export default eventHandler(async (event) => {
-        return proxyWpAdmin(event, serverContext)
-      })
-    `,
-        });
+        // codegen.registerFile({
+        //   name: "handler.wp-proxy.ts",
+        //   generate: code/* tsx */ `
+        //   /// <reference types="vinxi/types/server" />
+        //   import { proxyWpAdmin } from "eddev/server"
+        //   import { eventHandler } from "vinxi/http"
+        //   import  "./context.js"
+        //   export default eventHandler(async (event) => {
+        //     return proxyWpAdmin(event)
+        //   })
+        // `,
+        // })
     }
     codegen.registerFile({
         name: "manifest/blocks.ts",
         generate: async () => {
             const blockManifest = await project.blocks.get();
+            let blockImports = [];
+            let blockEntries = [];
+            for (const [name, block] of Object.entries(blockManifest.blocks)) {
+                if (name.match(/^_[a-z]+$/i))
+                    continue;
+                const importSource = JSON.stringify("../../../" + block.fileName);
+                const jsName = pascalCase(name);
+                if (block.dynamic) {
+                    const importStatement = `dynamic(() => import(${importSource}), ${JSON.stringify(block.fileName)})`;
+                    blockEntries.push(JSON.stringify(block.acfName) + ": " + importStatement);
+                }
+                else {
+                    blockImports.push(`import ${jsName} from ${importSource}`);
+                    blockEntries.push(JSON.stringify(block.acfName) + ": " + jsName);
+                }
+            }
             return code /* ts */ `
         import { blockManifestReader } from 'eddev/_internal'
         import { dynamic } from 'eddev/dynamic'
         import core from '../../../blocks/_core'
+        ${blockImports.join("\n")}
 
         const manifest = {
-          ${Object.entries(blockManifest.blocks)
-                .filter(([name]) => !name.match(/^_[a-z]+$/i))
-                .map(([name, block]) => {
-                const importStatement = `dynamic(() => import(${JSON.stringify("../../../" + block.fileName)}))`;
-                return JSON.stringify(block.acfName) + ": " + importStatement;
-            })
-                .join(",\n")},
+          ${blockEntries.join(",\n")},
           ...core
         }
 
@@ -410,14 +557,19 @@ 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)}), ${JSON.stringify(view.fileName)})`;
+                }
+                return code `${JSON.stringify(view.slug)}: ${importStatement},\n`;
+            })}}
 
-        viewManifestReader.value = manifest
+        viewManifestReader.set(manifest)
         
         export default manifest
 
@@ -454,5 +606,99 @@ export function createVinxiCodegen(opts) {
       `;
         },
     });
+    if (opts.serverless) {
+        codegen.registerFile({
+            name: "manifest/routes.ts",
+            generate: async () => {
+                const routeManifest = await project.serverRoutes.get();
+                return code /* ts */ `
+        import { instantiateRouter } from "eddev/server"
+          ${routeManifest.contextFileName
+                    ? code /*ts*/ `
+            import createContext from "../../../${routeManifest.contextFileName}"
+          `
+                    : code /*ts*/ `
+            const createContext = () => ({})
+          `}
+
+          const router = instantiateRouter({${Object.entries(routeManifest.routes).map(([name, route]) => {
+                    const src = "../../../" + route.fileName;
+                    const importStatement = imp(camelCase(name) + "=" + src);
+                    return code `${JSON.stringify(route.prefix)}: ${importStatement},\n`;
+                })}})
+
+          export { createContext, router }
+        `;
+            },
+            subscribe: project.serverRoutes.subscribe,
+        });
+        codegen.registerFile({
+            name: "rpc.ts",
+            generate: code /* tsx */ `
+        /// <reference types="vinxi/types/server" />
+        import "./context.js"
+        import { fetchRequestHandler } from "@trpc/server/adapters/fetch"
+        import { parseURL, stringifyParsedURL } from "ufo"
+        import { EventHandlerRequest, getWebRequest, H3Event, setResponseHeaders } from "vinxi/http"
+        import { createContext, router } from "./manifest/routes.ts"
+        import { ServerContext } from "eddev/server"
+
+        export function handleRPC(event: H3Event<EventHandlerRequest>) {
+          const serverContext = ServerContext.main
+          
+          // Handle CORS
+          setResponseHeaders(event, serverContext.getCorsHeaders(event.headers.get("origin") ?? event.headers.get("referer") ?? ""))
+          if (event.method === "OPTIONS") {
+            event.node.res.statusCode = 204
+            event.node.res.statusMessage = "No Content."
+            return "OK"
+          }
+            
+          // Update URLs with dots, which tRPC prefers
+          const originalReq = getWebRequest(event)
+          const parsed = parseURL(originalReq.url)
+          parsed.pathname = "/" + parsed.pathname.replace(/(^\\/|\\/$)/g, "").replace(/\\//g, ".")
+          const req = new Request(stringifyParsedURL(parsed), originalReq)
+
+          // Handle any early results which are Responses
+          function processEarlyResult(value: any): Response | undefined {
+            if (value instanceof Response) {
+              return value
+            }
+          }
+
+          return new Promise(async (resolve) => {
+            let sent = false
+            const defaultResponse = await fetchRequestHandler({
+              endpoint: "/",
+              req: req,
+              router: router,
+              createContext: async (opts) => {
+                return {
+                  ...(await createContext(opts)),
+                  searchParams: opts.info.url?.searchParams,
+                  server: serverContext,
+                }
+              },
+              onError: (err) => console.error(err),
+              batching: { enabled: false },
+              // If a Response object is returned by a route, it will be sent as the response
+              responseMeta(opts) {
+                const value = opts?.data?.[0]?.["result"]?.["data"]
+                const response = processEarlyResult(value)
+                if (response) {
+                  sent = true
+                  resolve(response)
+                }
+                return {}
+              },
+            })
+            if (sent) return
+            resolve(defaultResponse)
+          })
+        }
+      `,
+        });
+    }
     return codegen;
 }

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,22 +15,27 @@ 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.
      */
     private validateGraphQLFiles;
     private generateTS;
     generateUtilTypes(): Promise<unknown[]>;
+    generateAPITypes(): Promise<unknown[]>;
     /**
      * Saves the schema to a file, for use by the VSCode GraphQL extension
      */
     private writeSchemaFile;
 }
+export {};
+//# sourceMappingURL=graphql-codegen.d.ts.map