@cedarjs/cli 0.0.4

package/dist/commands/generate/layout/layoutHandler.js

@@ -0,0 +1,59 @@
+import { transformTSToJS } from "../../../lib/index.js";
+import { removeGeneratorName } from "../helpers.js";
+import {
+  templateForComponentFile,
+  createHandler
+} from "../yargsHandlerHelpers.js";
+const COMPONENT_SUFFIX = "Layout";
+const REDWOOD_WEB_PATH_NAME = "layouts";
+const files = async ({ name, typescript = false, ...options }) => {
+  const layoutName = removeGeneratorName(name, "layout");
+  const extension = typescript ? ".tsx" : ".jsx";
+  const layoutFile = await templateForComponentFile({
+    name: layoutName,
+    suffix: COMPONENT_SUFFIX,
+    webPathSection: REDWOOD_WEB_PATH_NAME,
+    extension,
+    generator: "layout",
+    templatePath: options.skipLink ? "layout.tsx.a11y.template" : "layout.tsx.template"
+  });
+  const testFile = await templateForComponentFile({
+    name: layoutName,
+    suffix: COMPONENT_SUFFIX,
+    extension: `.test${extension}`,
+    webPathSection: REDWOOD_WEB_PATH_NAME,
+    generator: "layout",
+    templatePath: "test.tsx.template"
+  });
+  const storyFile = await templateForComponentFile({
+    name: layoutName,
+    suffix: COMPONENT_SUFFIX,
+    extension: `.stories${extension}`,
+    webPathSection: REDWOOD_WEB_PATH_NAME,
+    generator: "layout",
+    templatePath: "stories.tsx.template"
+  });
+  const files2 = [layoutFile];
+  if (options.stories) {
+    files2.push(storyFile);
+  }
+  if (options.tests) {
+    files2.push(testFile);
+  }
+  return files2.reduce(async (accP, [outputPath, content]) => {
+    const acc = await accP;
+    const template = typescript ? content : await transformTSToJS(outputPath, content);
+    return {
+      [outputPath]: template,
+      ...acc
+    };
+  }, Promise.resolve({}));
+};
+const handler = createHandler({
+  componentName: "layout",
+  filesFn: files
+});
+export {
+  files,
+  handler
+};

package/dist/commands/generate/layout/templates/layout.tsx.a11y.template

@@ -0,0 +1,27 @@
+import { SkipNavLink, SkipNavContent } from '@cedarjs/router'
+import '@cedarjs/router/skip-nav.css'
+
+/**
+ * since the main content isn't usually the first thing in the document,
+ * it's important to provide a shortcut for keyboard and screen-reader users to skip to the main content
+ * API docs: https://reach.tech/skip-nav/#reach-skip-nav
+ */
+
+type ${singularPascalName}LayoutProps = {
+  children?: React.ReactNode
+}
+
+const ${singularPascalName}Layout = ({ children }: ${singularPascalName}LayoutProps) => {
+  return (
+    <>
+      {/* renders a link that remains hidden till focused; put it at the top of your layout */}
+      <SkipNavLink />
+      <nav></nav>
+      {/* renders a div as the target for the link; put it next to your main content */}
+      <SkipNavContent />
+      <main>{children}</main>
+    </>
+  )
+}
+
+export default ${singularPascalName}Layout

package/dist/commands/generate/layout/templates/layout.tsx.template

@@ -0,0 +1,9 @@
+type ${singularPascalName}LayoutProps = {
+  children?: React.ReactNode
+}
+
+const ${singularPascalName}Layout = ({ children }: ${singularPascalName}LayoutProps) => {
+  return <>{children}</>
+}
+
+export default ${singularPascalName}Layout

package/dist/commands/generate/layout/templates/stories.tsx.template

@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from '@storybook/react'
+
+import ${singularPascalName}Layout from './${pascalName}Layout'
+
+const meta: Meta<typeof ${singularPascalName}Layout> = {
+  component: ${singularPascalName}Layout,
+}
+
+export default meta
+
+type Story = StoryObj<typeof ${singularPascalName}Layout>
+
+export const Primary: Story = {}

package/dist/commands/generate/layout/templates/test.tsx.template

@@ -0,0 +1,14 @@
+import { render } from '@cedarjs/testing/web'
+
+import ${pascalName}Layout from './${pascalName}Layout'
+
+//   Improve this test with help from the Redwood Testing Doc:
+//   https://redwoodjs.com/docs/testing#testing-pages-layouts
+
+describe('${pascalName}Layout', () => {
+  it('renders successfully', () => {
+    expect(() => {
+      render(<${pascalName}Layout />)
+    }).not.toThrow()
+  })
+})

package/dist/commands/generate/model/model.js

@@ -0,0 +1,29 @@
+import terminalLink from "terminal-link";
+import { createHandler, getYargsDefaults } from "../yargsCommandHelpers.js";
+const command = "model <name>";
+const description = "Generate a RedwoodRecord model";
+const builder = (yargs) => {
+  yargs.positional("name", {
+    description: "Name of the model to create",
+    type: "string"
+  }).option("rollback", {
+    description: "Revert all generator actions if an error occurs",
+    type: "boolean",
+    default: true
+  }).epilogue(
+    `Also see the ${terminalLink(
+      "RedwoodRecord Reference",
+      "https://redwoodjs.com/docs/redwoodrecord"
+    )}`
+  );
+  Object.entries(getYargsDefaults()).forEach(([option, config]) => {
+    yargs.option(option, config);
+  });
+};
+const handler = createHandler("model");
+export {
+  builder,
+  command,
+  description,
+  handler
+};

package/dist/commands/generate/model/modelHandler.js

@@ -0,0 +1,63 @@
+import path from "path";
+import { Listr } from "listr2";
+import { recordTelemetryAttributes } from "@cedarjs/cli-helpers";
+import c from "../../../lib/colors.js";
+import {
+  getPaths,
+  writeFilesTask,
+  generateTemplate
+} from "../../../lib/index.js";
+import { prepareForRollback } from "../../../lib/rollback.js";
+import { verifyModelName } from "../../../lib/schemaHelpers.js";
+import { validateName } from "../helpers.js";
+const TEMPLATE_PATH = path.resolve(
+  import.meta.dirname,
+  "templates",
+  "model.js.template"
+);
+const files = async ({ name, typescript = false }) => {
+  const outputFilename = `${name}.${typescript ? "ts" : "js"}`;
+  const outputPath = path.join(getPaths().api.models, outputFilename);
+  return {
+    [outputPath]: await generateTemplate(TEMPLATE_PATH, { name })
+  };
+};
+const handler = async ({ force, ...args }) => {
+  recordTelemetryAttributes({
+    command: "generate model",
+    force,
+    rollback: args.rollback
+  });
+  validateName(args.name);
+  const tasks = new Listr(
+    [
+      {
+        title: "Generating model file...",
+        task: async () => {
+          return writeFilesTask(await files(args), { overwriteExisting: force });
+        }
+      },
+      {
+        title: "Parsing datamodel, generating api/src/models/index.js...",
+        task: async () => {
+          const redwoodRecordModule = await import("@cedarjs/record");
+          await redwoodRecordModule.default.parseDatamodel();
+        }
+      }
+    ].filter(Boolean),
+    { rendererOptions: { collapseSubtasks: false } }
+  );
+  try {
+    await verifyModelName({ name: args.name });
+    if (args.rollback && !force) {
+      prepareForRollback(tasks);
+    }
+    await tasks.run();
+  } catch (e) {
+    console.log(c.error(e.message));
+    process.exit(1);
+  }
+};
+export {
+  handler
+};

package/dist/commands/generate/model/templates/model.js.template

@@ -0,0 +1,3 @@
+import { RedwoodRecord } from '@cedarjs/record'
+
+export default class ${name} extends RedwoodRecord {}

package/dist/commands/generate/ogImage/ogImage.js

@@ -0,0 +1,43 @@
+import terminalLink from "terminal-link";
+import { isTypeScriptProject } from "../../../lib/project.js";
+import { createHandler } from "../yargsCommandHelpers.js";
+const description = "Generate an og:image component";
+const command = "og-image <path>";
+const aliases = ["ogImage", "ogimage"];
+const builder = (yargs) => {
+  yargs.positional("path", {
+    description: `Path to the page to create the og:image component for (ex: \`Products/ProductPage\`)`,
+    type: "string"
+  }).epilogue(
+    `Also see the ${terminalLink(
+      "Redwood CLI Reference",
+      `https://redwoodjs.com/docs/cli-commands#generate-og-image`
+    )}`
+  ).option("typescript", {
+    alias: "ts",
+    description: "Generate TypeScript files",
+    type: "boolean",
+    default: isTypeScriptProject()
+  }).option("force", {
+    alias: "f",
+    description: "Overwrite existing files",
+    type: "boolean",
+    default: false
+  }).option("verbose", {
+    description: "Print all logs",
+    type: "boolean",
+    default: false
+  }).option("rollback", {
+    description: "Revert all generator actions if an error occurs",
+    type: "boolean",
+    default: true
+  });
+};
+const handler = createHandler("ogImage");
+export {
+  aliases,
+  builder,
+  command,
+  description,
+  handler
+};

package/dist/commands/generate/ogImage/ogImageHandler.js

@@ -0,0 +1,111 @@
+import fs from "node:fs";
+import path from "node:path";
+import fg from "fast-glob";
+import { Listr } from "listr2";
+import { recordTelemetryAttributes } from "@cedarjs/cli-helpers";
+import { ensurePosixPath } from "@cedarjs/project-config";
+import { errorTelemetry } from "@cedarjs/telemetry";
+import c from "../../../lib/colors.js";
+import {
+  generateTemplate,
+  getPaths,
+  transformTSToJS,
+  writeFilesTask
+} from "../../../lib/index.js";
+import { prepareForRollback } from "../../../lib/rollback.js";
+import { customOrDefaultTemplatePath } from "../yargsHandlerHelpers.js";
+const files = async ({ pagePath, typescript = false }) => {
+  const extension = typescript ? ".tsx" : ".jsx";
+  const componentOutputPath = path.join(
+    getPaths().web.pages,
+    pagePath + ".og" + extension
+  );
+  const fullTemplatePath = customOrDefaultTemplatePath({
+    generator: "ogImage",
+    templatePath: "ogImage.og.tsx.template",
+    side: "web"
+  });
+  const content = await generateTemplate(fullTemplatePath, {
+    name: "ogImage",
+    outputPath: ensurePosixPath(
+      `./${path.relative(getPaths().base, componentOutputPath)}`
+    ),
+    pageName: pagePath.split("/").pop()
+  });
+  const template = typescript ? content : await transformTSToJS(componentOutputPath, content);
+  return {
+    [componentOutputPath]: template
+  };
+};
+const normalizedPath = (pagePath) => {
+  const parts = pagePath.split("/");
+  if (parts[0] === "pages") {
+    parts.shift();
+  }
+  if (parts.length === 1) {
+    return [parts[0], parts[0]].join("/");
+  }
+  if (parts[parts.length - 1] === parts[parts.length - 2]) {
+    return parts.join("/");
+  } else {
+    const dir = parts.pop();
+    return [...parts, dir, dir].join("/");
+  }
+};
+const validatePath = async (pagePath, extension, options) => {
+  const finalPath = `${pagePath}.${extension}`;
+  const pages = await fg(finalPath, {
+    cwd: getPaths().web.pages,
+    fs: options?.fs || fs
+  });
+  if (!pages.length) {
+    throw Error(`The page ${path.join(pagePath)}.${extension} does not exist`);
+  }
+  return true;
+};
+const handler = async (options) => {
+  recordTelemetryAttributes({
+    command: `generate og-image`,
+    verbose: options.verbose,
+    rollback: options.rollback,
+    force: options.force
+  });
+  const normalizedPagePath = normalizedPath(options.path);
+  const extension = options.typescript ? "tsx" : "jsx";
+  try {
+    await validatePath(normalizedPagePath, extension);
+    const tasks = new Listr(
+      [
+        {
+          title: `Generating og:image component...`,
+          task: async () => {
+            const f = await files({
+              pagePath: normalizedPagePath,
+              typescript: options.typescript
+            });
+            return writeFilesTask(f, { overwriteExisting: options.force });
+          }
+        }
+      ],
+      {
+        rendererOptions: { collapseSubtasks: false },
+        exitOnError: true,
+        renderer: options.verbose && "verbose"
+      }
+    );
+    if (options.rollback && !options.force) {
+      prepareForRollback(tasks);
+    }
+    await tasks.run();
+  } catch (e) {
+    errorTelemetry(process.argv, e.message);
+    console.error(c.error(e.message));
+    process.exit(e?.exitCode || 1);
+  }
+};
+export {
+  files,
+  handler,
+  normalizedPath,
+  validatePath
+};

package/dist/commands/generate/ogImage/templates/ogImage.og.tsx.template

@@ -0,0 +1,13 @@
+export const data = async () => {
+  return new Date()
+}
+
+export const output = ({ data }) => {
+  return (
+    <>
+      <h1>${pageName} og:image</h1>
+      <p>Find me in <code>${outputPath}</code></p>
+      <p>The time is now {data.toISOString()}</p>
+    </>
+  )
+}

package/dist/commands/generate/page/page.js

@@ -0,0 +1,22 @@
+import {
+  createBuilder,
+  createCommand,
+  createDescription,
+  createHandler
+} from "../yargsCommandHelpers.js";
+const positionalsObj = {
+  path: {
+    description: "URL path to the page, or just {param}. Defaults to name",
+    type: "string"
+  }
+};
+const command = createCommand("page", positionalsObj);
+const description = createDescription("page");
+const builder = createBuilder({ componentName: "page", positionalsObj });
+const handler = createHandler("page");
+export {
+  builder,
+  command,
+  description,
+  handler
+};

package/dist/commands/generate/page/pageHandler.js

@@ -0,0 +1,227 @@
+import { execSync } from "child_process";
+import camelcase from "camelcase";
+import { Listr } from "listr2";
+import pascalcase from "pascalcase";
+import { recordTelemetryAttributes } from "@cedarjs/cli-helpers";
+import { generate as generateTypes } from "@cedarjs/internal/dist/generate/generate";
+import { getConfig } from "@cedarjs/project-config";
+import { errorTelemetry } from "@cedarjs/telemetry";
+import c from "../../../lib/colors.js";
+import {
+  addRoutesToRouterTask,
+  transformTSToJS,
+  writeFilesTask
+} from "../../../lib/index.js";
+import {
+  prepareForRollback,
+  addFunctionToRollback
+} from "../../../lib/rollback.js";
+import {
+  pathName,
+  mapRouteParamTypeToTsType,
+  removeGeneratorName,
+  validateName
+} from "../helpers.js";
+import { templateForComponentFile } from "../yargsHandlerHelpers.js";
+const COMPONENT_SUFFIX = "Page";
+const REDWOOD_WEB_PATH_NAME = "pages";
+const mapRouteParamTypeToDefaultValue = (paramType) => {
+  switch (paramType) {
+    case "Int":
+      return 42;
+    case "Float":
+      return 42.1;
+    case "Boolean":
+      return true;
+    default:
+      return "42";
+  }
+};
+const paramVariants = (path) => {
+  const param = path?.match(/(\{[\w:]+\})/)?.[1];
+  const paramName = param?.replace(/:[^}]+/, "").slice(1, -1);
+  if (param === void 0) {
+    return {
+      propParam: "",
+      propValueParam: "",
+      argumentParam: "",
+      paramName: "",
+      paramValue: "",
+      paramType: ""
+    };
+  }
+  const routeParamType = param?.match(/:/) ? param?.replace(/[^:]+/, "").slice(1, -1) : "String";
+  const defaultValue = mapRouteParamTypeToDefaultValue(routeParamType);
+  const defaultValueAsProp = routeParamType === "String" ? `'${defaultValue}'` : defaultValue;
+  return {
+    propParam: `{ ${paramName} }`,
+    propValueParam: `${paramName}={${defaultValueAsProp}}`,
+    // used in story
+    argumentParam: `{ ${paramName}: ${defaultValueAsProp} }`,
+    paramName,
+    paramValue: defaultValue,
+    paramType: mapRouteParamTypeToTsType(routeParamType)
+  };
+};
+const files = async ({ name, tests, stories, typescript, ...rest }) => {
+  const extension = typescript ? ".tsx" : ".jsx";
+  const pageFile = await templateForComponentFile({
+    name,
+    suffix: COMPONENT_SUFFIX,
+    extension,
+    webPathSection: REDWOOD_WEB_PATH_NAME,
+    generator: "page",
+    templatePath: "page.tsx.template",
+    templateVars: {
+      rscEnabled: getConfig().experimental?.rsc?.enabled,
+      ...rest
+    }
+  });
+  const testFile = await templateForComponentFile({
+    name,
+    suffix: COMPONENT_SUFFIX,
+    extension: `.test${extension}`,
+    webPathSection: REDWOOD_WEB_PATH_NAME,
+    generator: "page",
+    templatePath: "test.tsx.template",
+    templateVars: rest
+  });
+  const storiesFile = await templateForComponentFile({
+    name,
+    suffix: COMPONENT_SUFFIX,
+    extension: `.stories${extension}`,
+    webPathSection: REDWOOD_WEB_PATH_NAME,
+    generator: "page",
+    templatePath: rest.paramName !== "" ? "stories.tsx.parameters.template" : "stories.tsx.template",
+    templateVars: rest
+  });
+  const files2 = [pageFile];
+  if (tests) {
+    files2.push(testFile);
+  }
+  if (stories) {
+    files2.push(storiesFile);
+  }
+  return files2.reduce(async (accP, [outputPath, content]) => {
+    const acc = await accP;
+    const template = typescript ? content : await transformTSToJS(outputPath, content);
+    return {
+      [outputPath]: template,
+      ...acc
+    };
+  }, Promise.resolve({}));
+};
+const routes = ({ name, path }) => {
+  return [
+    `<Route path="${path}" page={${pascalcase(name)}Page} name="${camelcase(
+      name
+    )}" />`
+  ];
+};
+const handler = async ({
+  name,
+  path,
+  force,
+  tests,
+  stories,
+  typescript = false,
+  rollback
+}) => {
+  const pageName = removeGeneratorName(name, "page");
+  validateName(pageName);
+  if (tests === void 0) {
+    tests = getConfig().generate.tests;
+  }
+  if (stories === void 0) {
+    stories = getConfig().generate.stories;
+  }
+  recordTelemetryAttributes({
+    command: "generate page",
+    force,
+    tests,
+    stories,
+    typescript,
+    rollback
+  });
+  if (process.platform === "win32") {
+    try {
+      const slashPath = execSync("cygpath -m /", {
+        stdio: ["ignore", "pipe", "ignore"]
+      }).toString().trim();
+      path = path.replace(new RegExp(`^${slashPath}?`), "/");
+    } catch {
+    }
+  }
+  const tasks = new Listr(
+    [
+      {
+        title: "Generating page files...",
+        task: async () => {
+          path = pathName(path, pageName);
+          const f = await files({
+            name: pageName,
+            path,
+            tests,
+            stories,
+            typescript,
+            ...paramVariants(path)
+          });
+          return writeFilesTask(f, { overwriteExisting: force });
+        }
+      },
+      {
+        title: "Updating routes file...",
+        task: async () => {
+          addRoutesToRouterTask(
+            routes({ name: pageName, path: pathName(path, pageName) })
+          );
+        }
+      },
+      {
+        title: `Generating types...`,
+        task: async () => {
+          const { errors } = await generateTypes();
+          for (const { message, error } of errors) {
+            console.error(message);
+            console.log();
+            console.error(error);
+            console.log();
+          }
+          addFunctionToRollback(generateTypes, true);
+        }
+      },
+      {
+        title: "One more thing...",
+        task: (ctx, task) => {
+          task.title = `One more thing...
+
+   ${c.warning("Page created! A note about <Metadata>:")}
+
+   At the top of your newly created page is a <Metadata> component,
+   which contains the title and description for your page, essential
+   to good SEO. Check out this page for best practices: 
+
+   https://developers.google.com/search/docs/advanced/appearance/good-titles-snippets
+`;
+        }
+      }
+    ].filter(Boolean),
+    { rendererOptions: { collapseSubtasks: false } }
+  );
+  try {
+    if (rollback && !force) {
+      prepareForRollback(tasks);
+    }
+    await tasks.run();
+  } catch (e) {
+    errorTelemetry(process.argv, e.message);
+    console.error(c.error(e.message));
+    process.exit(e?.exitCode || 1);
+  }
+};
+export {
+  files,
+  handler,
+  paramVariants,
+  routes
+};

package/dist/commands/generate/page/templates/page.tsx.template

@@ -0,0 +1,35 @@
+<% if (rscEnabled) { %>
+import { Link } from '@cedarjs/router/Link'
+import { namedRoutes as routes } from '@cedarjs/router/namedRoutes'
+import { Metadata } from '@cedarjs/web/Metadata'
+<% } else { %>
+// import { Link, routes } from '@cedarjs/router'
+import { Metadata } from '@cedarjs/web'
+<% } %>
+
+<% if (paramName !== '') { %>
+type ${pascalName}PageProps = {
+  ${paramName}: ${paramType}
+}
+<% } %>
+const ${pascalName}Page = (<%- paramName === '' ? '' : `${propParam}: ${pascalName}PageProps` %>) => {
+  return (
+    <>
+      <Metadata title="${pascalName}" description="${pascalName} page" />
+
+      <h1>${pascalName}Page</h1>
+      <p>
+        Find me in <code>${outputPath}</code>
+      </p><% if (paramName !== '') { %>
+      <p>
+        The parameter passed to me is <code>{${ paramName }}</code>
+      </p><% } %>
+      {/*
+          My default route is named `${camelName}`, link to me with:
+          `<Link to={routes.${camelName}(${ argumentParam })}>${pascalName}<%= argumentParam !== '' ? ' 42' : '' %></Link>`
+      */}
+    </>
+  )
+}
+
+export default ${pascalName}Page