zudoku 0.1.1-dev.20 → 0.1.1-dev.21

package/src/config/config.ts

@@ -1,56 +0,0 @@
-import { Options } from "@mdx-js/rollup";
-import { NavigationItem } from "../lib/core/DevPortalContext.js";
-import { OasPluginConfig } from "../lib/plugins/openapi/index.js";
-import { type MdxComponentsType } from "../lib/util/MdxComponents.js";
-
-export interface ZudokuConfig {
-  ui?: UIConfig;
-  mdx?: {
-    components?: MdxComponentsType;
-  };
-
-  authentication?: AuthenticationConfig;
-
-  navigation?: NavigationItem[];
-
-  docs?: DocsConfig;
-  apis?: ApiConfig | ApiConfig[];
-
-  build?: {
-    remarkPlugins?: Options["remarkPlugins"];
-    rehypePlugins?: Options["rehypePlugins"];
-  };
-}
-
-export interface ZudokuPluginOptions extends ZudokuConfig {
-  rootDir: string;
-}
-
-export interface UIConfig {
-  /**
-   * The site title
-   */
-  headerTitle?: string;
-  pageTitle?: string;
-  // description: string;
-  logo?: string;
-
-  metadata?: MetadataConfig;
-}
-
-export interface MetadataConfig {
-  favicon?: string;
-}
-
-export interface DocsConfig {
-  files?: string;
-}
-
-export type ApiConfig = OasPluginConfig;
-
-export interface ClerkAuthenticationConfig {
-  type: "clerk";
-  clerkPubKey: string;
-}
-
-export type AuthenticationConfig = ClerkAuthenticationConfig;

package/src/index.ts

@@ -1,8 +0,0 @@
-// Config
-export type { ZudokuConfig } from "./config/config.js";
-export type {
-  NavigationCategory,
-  NavigationCategoryItem,
-  NavigationItem,
-} from "./lib/core/DevPortalContext.js";
-export type { MDXImport } from "./lib/plugins/markdown/index.js";

package/src/ts.ts

@@ -1,94 +0,0 @@
-import path from "path";
-import ts from "typescript";
-
-/**
- * Function to check if a TypeScript string is valid
- * Used for tests
- */
-export async function checkTypescriptString(code: string) {
-  const rootDir = process.cwd();
-  const inMemoryFileName = path.join(rootDir, "/src/temp.ts");
-  const configPath = ts.findConfigFile(
-    rootDir,
-    ts.sys.fileExists,
-    "tsconfig.json",
-  );
-  if (!configPath) {
-    throw new Error("Could not find a valid tsconfig.json");
-  }
-  const configFile = ts.readConfigFile(configPath, ts.sys.readFile);
-  const parsedCommandLine = ts.parseJsonConfigFileContent(
-    configFile.config,
-    ts.sys,
-    path.dirname(configPath),
-  );
-
-  // Custom compiler host to handle in-memory file and delegate to default host for others
-  const compilerHost: ts.CompilerHost = {
-    ...ts.createCompilerHost(parsedCommandLine.options),
-    getSourceFile: (
-      fileName,
-      languageVersion,
-      onError,
-      shouldCreateNewSourceFile,
-    ) => {
-      if (fileName === inMemoryFileName) {
-        return ts.createSourceFile(fileName, code, languageVersion, true);
-      }
-      return ts
-        .createCompilerHost(parsedCommandLine.options)
-        .getSourceFile(
-          fileName,
-          languageVersion,
-          onError,
-          shouldCreateNewSourceFile,
-        );
-    },
-    fileExists: (fileName) => {
-      if (fileName === inMemoryFileName) {
-        return true;
-      }
-      return ts.sys.fileExists(fileName);
-    },
-    readFile: (fileName) => {
-      if (fileName === inMemoryFileName) {
-        return code;
-      }
-      return ts.sys.readFile(fileName);
-    },
-  };
-
-  // Create a source file in memory
-  const sourceFile = ts.createSourceFile("tempFile.ts", code, 99, true);
-
-  // Create a program using the in-memory source file
-  const program = ts.createProgram({
-    rootNames: parsedCommandLine.fileNames.concat(inMemoryFileName),
-    options: parsedCommandLine.options,
-    host: compilerHost,
-  });
-
-  // Get all diagnostics for the program, which includes syntax and semantic errors
-  const diagnostics = ts.getPreEmitDiagnostics(program);
-
-  diagnostics.forEach((diagnostic) => {
-    if (diagnostic.file) {
-      const { line, character } = diagnostic.file.getLineAndCharacterOfPosition(
-        diagnostic.start!,
-      );
-      const message = ts.flattenDiagnosticMessageText(
-        diagnostic.messageText,
-        "\n",
-      );
-      console.log(
-        `${diagnostic.file.fileName} (${line + 1},${character + 1}): ${message}`,
-      );
-    } else {
-      console.log(
-        ts.flattenDiagnosticMessageText(diagnostic.messageText, "\n"),
-      );
-    }
-  });
-
-  return diagnostics;
-}

package/src/types.d.ts

@@ -1,24 +0,0 @@
-declare module "slugify" {
-  declare function slugify(
-    string: string,
-    options?:
-      | {
-          replacement?: string;
-          remove?: RegExp;
-          lower?: boolean;
-          strict?: boolean;
-          locale?: string;
-          trim?: boolean;
-        }
-      | string,
-  ): string;
-
-  export default slugify;
-}
-
-declare module "virtual:zudoku-docs-plugins";
-declare module "virtual:zudoku-api-plugins";
-declare module "virtual:zudoku-config";
-declare module "virtual:zudoku-auth";
-declare module "virtual:zudoku-component";
-declare module "zudoku/open-api-worker";

package/src/vite/build.ts

@@ -1,33 +0,0 @@
-import { writeFile } from "fs/promises";
-import { build as viteBuild } from "vite";
-import { getViteConfig } from "./config.js";
-import { getBuildHtml } from "./html.js";
-
-export async function runBuild(options: { dir: string }) {
-  const viteConfig = await getViteConfig({ dir: options.dir, mode: "build" });
-
-  const result = await viteBuild(viteConfig);
-
-  if (Array.isArray(result)) {
-    throw new Error("Build failed");
-  }
-
-  if ("output" in result) {
-    const jsEntry = result.output.find(
-      (o) => "isEntry" in o && o.isEntry,
-    )?.fileName;
-    const cssEntry = result.output.find((o) =>
-      o.fileName.endsWith(".css"),
-    )?.fileName;
-
-    const html = getBuildHtml({
-      jsEntry: `/${jsEntry}`,
-      cssEntry: `/${cssEntry}`,
-    });
-
-    await writeFile(`${options.dir}/dist/index.html`, html, "utf-8");
-    return;
-  }
-
-  throw new Error("Build failed");
-}

package/src/vite/config.test.ts

@@ -1,10 +0,0 @@
-import assert from "node:assert";
-import path from "node:path";
-import test from "node:test";
-import { loadConfig } from "./config.js";
-
-test("Should correctly load zudoku.config.ts file", async (t) => {
-  const rootPath = path.resolve("../../samples/with-config/");
-  const config = await loadConfig(rootPath, "zudoku.config.ts");
-  assert.equal(config.default.ui.headerTitle, "My Portal");
-});

package/src/vite/config.ts

@@ -1,183 +0,0 @@
-import autoprefixer from "autoprefixer";
-import esbuild from "esbuild";
-import { stat } from "node:fs/promises";
-import path from "node:path";
-import tailwindcss from "tailwindcss";
-import { InlineConfig, LogLevel } from "vite";
-import tailwindConfig from "../app/tailwind.js";
-import { logger } from "../cli/common/logger.js";
-import { isPortAvailable } from "../cli/common/utils/ports.js";
-import { ZudokuConfig } from "../config/config.js";
-import viteComponentPlugin from "./plugin-component.js";
-import vitePlugin from "./plugin.js";
-
-const extensions = ["js", "jsx", "ts", "tsx", "mjs"];
-
-export interface ZudokuViteConfig extends InlineConfig {
-  root: string;
-}
-
-const fileExists = (path: string) =>
-  stat(path)
-    .then(() => true)
-    .catch(() => false);
-
-export async function loadZuploConfig(rootDir: string): Promise<ZudokuConfig> {
-  for (const ext of extensions) {
-    const fileName = `zudoku.config.${ext}`;
-    const configPath = path.join(rootDir, fileName);
-
-    try {
-      if (await fileExists(configPath)) {
-        logger.info(`Loading zudoku.config file: ${configPath}`);
-        const config = await loadConfig(rootDir, fileName);
-        return config.default as ZudokuConfig;
-      }
-    } catch (e) {
-      logger.error(e);
-    }
-  }
-
-  // Default config
-  logger.warn("No zudoku.config file found");
-  return {};
-}
-
-function getModuleDir() {
-  // NOTE: This is relative to the /dist folder because the dev server
-  // runs the compiled JS files, but vite uses the raw TS files
-  return new URL("../../", import.meta.url).pathname;
-}
-
-export function getAppMainTsxPath() {
-  const modDir = getModuleDir();
-  return path.join(modDir, "src", "app", "main.tsx");
-}
-
-export async function getViteConfig({
-  dir,
-  mode,
-}: {
-  dir: string;
-  mode: "dev" | "build";
-}): Promise<ZudokuViteConfig> {
-  const rootDir = path.resolve(process.cwd(), dir);
-  const moduleDir = getModuleDir();
-  const config = await loadZuploConfig(rootDir);
-
-  let websocketPort = 9800;
-  while (
-    !(await isPortAvailable("localhost", websocketPort)) &&
-    websocketPort < 9999
-  ) {
-    websocketPort++;
-  }
-
-  const viteConfig: ZudokuViteConfig = {
-    root: rootDir,
-    appType: "custom",
-    configFile: false,
-    clearScreen: false,
-    logLevel: (process.env.LOG_LEVEL || "info") as LogLevel,
-    customLogger: logger,
-    envPrefix: "PUBLIC_",
-    worker: {
-      format: "es",
-    },
-    server: {
-      middlewareMode: true,
-      open: true,
-      hmr: {
-        port: websocketPort,
-      },
-      watch: {
-        ignored: [
-          `${rootDir}/dist`,
-          `${rootDir}/lib`,
-          `${rootDir}/.git`,
-          `${rootDir}/node_modules`,
-          `${rootDir}/zuplo.config.ts`,
-        ],
-      },
-      // sourcemapIgnoreList: (sourcePath) => {
-      //   return (
-      //     sourcePath.includes("node_modules/openapi-types/") ||
-      //     sourcePath.includes("node_modules/value-or-promise/")
-      //   );
-      // },
-    },
-    build: {
-      outDir: path.resolve(rootDir, "dist"),
-      rollupOptions: {
-        // external: ["@mdx-js/react"],
-        input: mode === "build" ? "zudoku/app/main.tsx" : undefined,
-      },
-    },
-    optimizeDeps: {
-      entries: [getAppMainTsxPath()],
-      exclude: ["zudoku/open-api-worker"],
-      include: [
-        "hast-util-to-jsx-runtime > style-to-object",
-        "debug",
-        "extend",
-        "stringify-object",
-        "url",
-        "@zudoku/httpsnippet > qs",
-        "react-fast-compare",
-        "invariant",
-        "shallowequal",
-        "slugify",
-        "zustand",
-      ],
-    },
-    plugins: [vitePlugin({ ...config, rootDir }), viteComponentPlugin()],
-    css: {
-      postcss: {
-        plugins: [
-          tailwindcss({
-            ...tailwindConfig,
-            content: [
-              `${moduleDir}/src/**/*.{js,ts,jsx,tsx,md,mdx}`,
-              // Tailwind seems to crash if it tries to parse compiled .js files
-              // as a workaround, we will just ship the source file and use those
-              // `${moduleDir}/lib/**/*.{js,ts,jsx,tsx,md,mdx}`,
-              `${rootDir}/src/**/*.{js,ts,jsx,tsx,md,mdx}`,
-            ],
-          }),
-          autoprefixer,
-        ],
-      },
-    },
-  };
-
-  return viteConfig;
-}
-
-export async function loadConfig(rootPath: string, fileName: string) {
-  const compiledFilepath = path.join(
-    rootPath,
-    "node_modules",
-    ".zudoku",
-    "zudoku.config.mjs",
-  );
-  const filepath = path.join(rootPath, fileName);
-  try {
-    await esbuild.build({
-      entryPoints: [filepath],
-      bundle: true,
-      keepNames: true,
-      treeShaking: true,
-      minifyIdentifiers: false,
-      minifySyntax: false,
-      minifyWhitespace: false,
-      platform: "node",
-      target: "es2022",
-      format: "esm",
-      outfile: compiledFilepath,
-    });
-  } catch (error) {
-    error.message = `TypeScript Error in ${filepath}:\n${error.message}`;
-    throw error;
-  }
-  return await import(compiledFilepath);
-}

package/src/vite/dev-server.ts

@@ -1,64 +0,0 @@
-import express from "express";
-import { Server } from "node:http";
-import { createServer as createViteServer } from "vite";
-
-import { createGraphQLServer } from "../lib/oas/graphql/index.js";
-import { getAppMainTsxPath, getViteConfig } from "./config.js";
-import { getDevHtml } from "./html.js";
-
-export class DevServer {
-  private server: Server | undefined;
-
-  constructor(private options: { port: number; dir: string }) {}
-
-  async start() {
-    const app = express();
-
-    const viteConfig = await getViteConfig({
-      dir: this.options.dir,
-      mode: "dev",
-    });
-
-    const vite = await createViteServer(viteConfig);
-
-    const graphql = createGraphQLServer({
-      graphqlEndpoint: "/__z/graphql",
-    });
-
-    app.use(graphql.graphqlEndpoint, graphql);
-    app.use(vite.middlewares);
-
-    app.use("*", async (req, res) => {
-      try {
-        const entryJs = getAppMainTsxPath();
-        const rawHtml = getDevHtml(entryJs);
-        const indexHtml = await vite.transformIndexHtml(req.url, rawHtml);
-
-        // Send the transformed index.html back to the client
-        res.status(200).set({ "Content-Type": "text/html" }).end(indexHtml);
-      } catch (e) {
-        vite.ssrFixStacktrace(e);
-        console.error(e);
-        res.status(500).end(e.message);
-      }
-    });
-
-    return new Promise<void>((resolve) => {
-      this.server = app.listen(this.options.port, resolve);
-    });
-  }
-
-  async stop() {
-    if (this.server) {
-      return new Promise<void>((resolve, reject) => {
-        this.server!.close((err) => {
-          if (err) {
-            reject(err);
-          } else {
-            resolve();
-          }
-        });
-      });
-    }
-  }
-}

package/src/vite/html.ts

@@ -1,37 +0,0 @@
-export function getDevHtml(jsEntry: string) {
-  return `<!doctype html>
-<html lang="en" class="dark">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="${jsEntry}"></script>
-  </body>
-</html>
-`;
-}
-
-export function getBuildHtml({
-  jsEntry,
-  cssEntry,
-}: {
-  jsEntry: string;
-  cssEntry: string;
-}) {
-  return `<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + React + TS</title>
-    <script type="module" crossorigin src="${jsEntry}"></script>
-    <link rel="stylesheet" crossorigin href="${cssEntry}">
-  </head>
-  <body>
-    <div id="root"></div>
-  </body>
-</html>`;
-}

package/src/vite/plugin-api.ts

@@ -1,57 +0,0 @@
-import { Plugin } from "vite";
-import { ZudokuPluginOptions } from "../config/config.js";
-import { getConfigExportCode } from "./plugin-config.js";
-
-const viteApiPlugin = (config: ZudokuPluginOptions): Plugin => {
-  const virtualModuleId = "virtual:zudoku-api-plugins";
-  const resolvedVirtualModuleId = "\0" + virtualModuleId;
-
-  return {
-    name: "vite-zudoku-api-plugins",
-    resolveId(id) {
-      if (id === virtualModuleId) {
-        return resolvedVirtualModuleId;
-      }
-    },
-    load(id) {
-      if (id === resolvedVirtualModuleId) {
-        const code: string[] = [
-          // IMPORTANT! This path here is important, we MUST resolve
-          // files here as Typescript from the appDir
-          getConfigExportCode(config.rootDir),
-          `import { openApiPlugin } from "zudoku/plugins";`,
-          `const configuredApiPlugins = [];`,
-        ];
-
-        if (config?.apis) {
-          if (Array.isArray(config.apis)) {
-            config.apis.forEach((c, i) => {
-              code.push(
-                ...[
-                  `// @ts-ignore`, // To make tests pass
-                  `configuredApiPlugins.push(openApiPlugin(config.apis?[${i}]));`,
-                ],
-              );
-            });
-          } else {
-            code.push(
-              ...[
-                `// @ts-ignore`, // To make tests pass
-                `configuredApiPlugins.push(openApiPlugin(config.apis));`,
-              ],
-            );
-          }
-        }
-
-        code.push(`export { configuredApiPlugins };`);
-
-        return {
-          code: code.join("\n"),
-          map: null,
-        };
-      }
-    },
-  };
-};
-
-export default viteApiPlugin;

package/src/vite/plugin-auth.ts

@@ -1,32 +0,0 @@
-import { PluginOption } from "vite";
-import { ZudokuPluginOptions } from "../config/config.js";
-import { getConfigExportCode } from "./plugin-config.js";
-
-const viteAuthPlugin = (config: ZudokuPluginOptions): PluginOption => {
-  const virtualModuleId = "virtual:zudoku-auth";
-  const resolvedVirtualModuleId = "\0" + virtualModuleId;
-
-  return {
-    name: "zudoku-auth-plugin", // required, will show up in warnings and errors
-    resolveId(id) {
-      if (id === virtualModuleId) {
-        return resolvedVirtualModuleId;
-      }
-    },
-    load(id) {
-      if (id === resolvedVirtualModuleId) {
-        if (!config.authentication) {
-          return `export const configuredAuthProvider = undefined;`;
-        }
-        // TODO: Validate that the authConfig.type is a valid authentication provider
-        return [
-          getConfigExportCode(config.rootDir),
-          `import { clerkAuth } from "zudoku/auth";`,
-          `export const configuredAuthProvider = clerkAuth(config.authentication);`,
-        ].join("\n");
-      }
-    },
-  };
-};
-
-export default viteAuthPlugin;

package/src/vite/plugin-component.ts

@@ -1,26 +0,0 @@
-import { PluginOption } from "vite";
-
-const viteComponentPlugin = (): PluginOption => {
-  const virtualModuleId = "virtual:zudoku-component";
-  const resolvedVirtualModuleId = "\0" + virtualModuleId;
-
-  return {
-    name: "zudoku-component-plugin",
-    resolveId(id) {
-      if (id === virtualModuleId) {
-        return resolvedVirtualModuleId;
-      }
-    },
-    load(id) {
-      if (id === resolvedVirtualModuleId) {
-        const code: string[] = [
-          `export { DevPortal } from "zudoku/components";`,
-        ];
-
-        return code.join("\n");
-      }
-    },
-  };
-};
-
-export default viteComponentPlugin;

package/src/vite/plugin-config.ts

@@ -1,31 +0,0 @@
-import path from "path";
-import { PluginOption } from "vite";
-
-export function getConfigExportCode(rootDir: string) {
-  const configPath = path.join(
-    rootDir,
-    `/node_modules/.zudoku/zudoku.config.mjs`,
-  );
-  return `import config from "${configPath}"; export default config;`;
-}
-
-const viteConfigPlugin = ({ rootDir }: { rootDir: string }): PluginOption => {
-  const virtualModuleId = "virtual:zudoku-config";
-  const resolvedVirtualModuleId = "\0" + virtualModuleId;
-
-  return {
-    name: "zudoku-config-plugin",
-    resolveId(id) {
-      if (id === virtualModuleId) {
-        return resolvedVirtualModuleId;
-      }
-    },
-    load(id) {
-      if (id === resolvedVirtualModuleId) {
-        return getConfigExportCode(rootDir);
-      }
-    },
-  };
-};
-
-export default viteConfigPlugin;

package/src/vite/plugin-docs.test.ts

@@ -1,32 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-import assert from "node:assert";
-import test from "node:test";
-import { checkTypescriptString } from "../ts.js";
-import viteDocsPlugin from "./plugin-docs.js";
-
-test.only("Builds code", async (t) => {
-  const plugin = viteDocsPlugin({
-    docs: { files: "docs/**/*.md" },
-  } as any);
-  if (!plugin.load) {
-    throw new Error("Plugin does not have a load function");
-  }
-  if (typeof plugin.load !== "function") {
-    throw new Error("Plugin.load is not a function");
-  }
-
-  const result = await plugin.load.call(
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    {} as any,
-    "\0virtual:markdown-plugins",
-  );
-  if (result && typeof result === "object" && "code" in result) {
-    const diagnostics = await checkTypescriptString(result.code);
-    if (diagnostics.length > 0) {
-      console.error(diagnostics);
-    }
-    assert.equal(diagnostics.length, 0);
-  } else {
-    assert.fail("Invalid return value from plugin.load");
-  }
-});