@cedarjs/cli 0.0.4

package/dist/commands/generate/cell/cellHandler.js

@@ -0,0 +1,153 @@
+import pascalcase from "pascalcase";
+import { generate as generateTypes } from "@cedarjs/internal/dist/generate/generate";
+import { nameVariants, transformTSToJS } from "../../../lib/index.js";
+import { isWordPluralizable } from "../../../lib/pluralHelpers.js";
+import { addFunctionToRollback } from "../../../lib/rollback.js";
+import { isPlural, singularize } from "../../../lib/rwPluralize.js";
+import { getSchema } from "../../../lib/schemaHelpers.js";
+import { forcePluralizeWord, removeGeneratorName } from "../helpers.js";
+import {
+  createHandler,
+  templateForComponentFile
+} from "../yargsHandlerHelpers.js";
+import {
+  checkProjectForQueryField,
+  getIdName,
+  getIdType,
+  operationNameIsUnique,
+  uniqueOperationName
+} from "./utils/utils.js";
+const COMPONENT_SUFFIX = "Cell";
+const REDWOOD_WEB_PATH_NAME = "components";
+const files = async ({ name, typescript, ...argv }) => {
+  let cellName = removeGeneratorName(name, "cell");
+  let idName = "id";
+  let idType, mockIdValues = [42, 43, 44], model = null;
+  let templateNameSuffix = "";
+  let typeName = cellName;
+  const shouldGenerateList = (isWordPluralizable(cellName) ? isPlural(cellName) : argv.list) || argv.list;
+  try {
+    model = await getSchema(pascalcase(singularize(cellName)));
+    idName = getIdName(model);
+    idType = getIdType(model);
+    typeName = model.name;
+    mockIdValues = idType === "String" ? mockIdValues.map((value) => `'${value}'`) : mockIdValues;
+  } catch {
+    idType = "Int";
+  }
+  if (shouldGenerateList) {
+    cellName = forcePluralizeWord(cellName);
+    templateNameSuffix = "List";
+  }
+  let operationName = argv.query;
+  if (operationName) {
+    const userSpecifiedOperationNameIsUnique = await operationNameIsUnique(operationName);
+    if (!userSpecifiedOperationNameIsUnique) {
+      throw new Error(`Specified query name: "${operationName}" is not unique!`);
+    }
+  } else {
+    operationName = await uniqueOperationName(cellName, {
+      list: shouldGenerateList
+    });
+  }
+  const extension = typescript ? ".tsx" : ".jsx";
+  const cellFile = await templateForComponentFile({
+    name: cellName,
+    suffix: COMPONENT_SUFFIX,
+    extension,
+    webPathSection: REDWOOD_WEB_PATH_NAME,
+    generator: "cell",
+    templatePath: `cell${templateNameSuffix}.tsx.template`,
+    templateVars: {
+      operationName,
+      idName,
+      idType
+    }
+  });
+  const testFile = await templateForComponentFile({
+    name: cellName,
+    suffix: COMPONENT_SUFFIX,
+    extension: `.test${extension}`,
+    webPathSection: REDWOOD_WEB_PATH_NAME,
+    generator: "cell",
+    templatePath: "test.js.template",
+    templateVars: {
+      idName: shouldGenerateList ? void 0 : idName,
+      mockIdValues: shouldGenerateList ? void 0 : mockIdValues
+    }
+  });
+  const storiesFile = await templateForComponentFile({
+    name: cellName,
+    suffix: COMPONENT_SUFFIX,
+    extension: `.stories${extension}`,
+    webPathSection: REDWOOD_WEB_PATH_NAME,
+    generator: "cell",
+    templatePath: "stories.tsx.template"
+  });
+  const mockFile = await templateForComponentFile({
+    name: cellName,
+    suffix: COMPONENT_SUFFIX,
+    extension: typescript ? ".mock.ts" : ".mock.js",
+    webPathSection: REDWOOD_WEB_PATH_NAME,
+    generator: "cell",
+    templatePath: `mock${templateNameSuffix}.ts.template`,
+    templateVars: {
+      idName,
+      mockIdValues,
+      typeName
+    }
+  });
+  const files2 = [cellFile];
+  if (argv.stories) {
+    files2.push(storiesFile);
+  }
+  if (argv.tests) {
+    files2.push(testFile);
+  }
+  if (argv.stories || argv.tests) {
+    files2.push(mockFile);
+  }
+  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: "cell",
+  filesFn: files,
+  includeAdditionalTasks: ({ name: cellName }) => {
+    return [
+      {
+        title: `Generating types ...`,
+        task: async (_ctx, task) => {
+          const queryFieldName = nameVariants(
+            removeGeneratorName(cellName, "cell")
+          ).camelName;
+          const projectHasSdl = await checkProjectForQueryField(queryFieldName);
+          if (projectHasSdl) {
+            const { errors } = await generateTypes();
+            for (const { message, error } of errors) {
+              console.error(message);
+              console.log();
+              console.error(error);
+              console.log();
+            }
+            addFunctionToRollback(generateTypes, true);
+          } else {
+            task.skip(
+              `Skipping type generation: no SDL defined for "${queryFieldName}". To generate types, run 'yarn rw g sdl ${queryFieldName}'.`
+            );
+          }
+        }
+      }
+    ];
+  }
+});
+export {
+  files,
+  handler
+};

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

@@ -0,0 +1,34 @@
+import type { ${operationName}, ${operationName}Variables } from 'types/graphql'
+
+import type {
+  CellSuccessProps,
+  CellFailureProps,
+  TypedDocumentNode,
+} from '@cedarjs/web'
+
+export const QUERY: TypedDocumentNode<
+  ${operationName},
+  ${operationName}Variables
+> = gql`
+  query ${operationName}($id: ${idType}!) {
+    ${camelName}: ${camelName}(${idName}: $id) {
+      ${idName}
+    }
+  }
+`
+
+export const Loading = () => <div>Loading...</div>
+
+export const Empty = () => <div>Empty</div>
+
+export const Failure = ({
+  error,
+}: CellFailureProps<${operationName}Variables>) => (
+  <div style={{ color: 'red' }}>Error: {error?.message}</div>
+)
+
+export const Success = ({
+  ${camelName},
+}: CellSuccessProps<${operationName}, ${operationName}Variables>) => {
+  return <div>{JSON.stringify(${camelName})}</div>
+}

package/dist/commands/generate/cell/templates/cellList.tsx.template

@@ -0,0 +1,40 @@
+import type { ${operationName}, ${operationName}Variables  } from 'types/graphql'
+
+import type {
+  CellSuccessProps,
+  CellFailureProps,
+  TypedDocumentNode,
+} from '@cedarjs/web'
+
+export const QUERY: TypedDocumentNode<
+  ${operationName},
+  ${operationName}Variables
+> = gql`
+  query ${operationName} {
+    ${camelName} {
+      ${idName}
+    }
+  }
+`
+
+export const Loading = () => <div>Loading...</div>
+
+export const Empty = () => <div>Empty</div>
+
+export const Failure = ({
+  error,
+}: CellFailureProps<${operationName}Variables>) => (
+  <div style={{ color: 'red' }}>Error: {error?.message}</div>
+)
+
+export const Success = ({
+  ${camelName},
+}: CellSuccessProps<${operationName}, ${operationName}Variables>) => {
+  return (
+    <ul>
+      {${camelName}.map((item) => {
+        return <li key={item.${idName}}>{JSON.stringify(item)}</li>
+      })}
+    </ul>
+  )
+}

package/dist/commands/generate/cell/templates/mock.ts.template

@@ -0,0 +1,7 @@
+// Define your own mock data here:
+export const standard = (/* vars, { ctx, req } */) => ({
+  ${camelName}: {
+    __typename: "${typeName}" as const,
+    ${idName}: ${mockIdValues[0]}
+    }
+  })

package/dist/commands/generate/cell/templates/mockList.ts.template

@@ -0,0 +1,14 @@
+// Define your own mock data here:
+export const standard = (/* vars, { ctx, req } */) => ({
+  ${camelName}: [
+    {
+      __typename: "${typeName}" as const,
+      ${idName}: ${mockIdValues[0]} },
+    {
+      __typename: "${typeName}" as const,
+      ${idName}: ${mockIdValues[1]} },
+    {
+      __typename: "${typeName}" as const,
+      ${idName}: ${mockIdValues[2]} }
+    ]
+  })

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

@@ -0,0 +1,35 @@
+import type { Meta, StoryObj } from '@storybook/react'
+
+import { Loading, Empty, Failure, Success } from './${pascalName}Cell'
+import { standard } from './${pascalName}Cell.mock'
+
+const meta: Meta = {
+  title: 'Cells/${pascalName}Cell',
+  tags: ['autodocs']
+}
+
+export default meta
+
+export const loading: StoryObj<typeof Loading> = {
+  render: () => {
+    return Loading ? <Loading /> : <></>
+  },
+}
+
+export const empty: StoryObj<typeof Empty> = {
+  render: () => {
+    return Empty ? <Empty /> : <></>
+  }
+}
+
+export const failure: StoryObj<typeof Failure> = {
+  render: (args) => {
+    return Failure ? <Failure error={new Error('Oh no')} {...args} /> : <></>
+  }
+}
+
+export const success: StoryObj<typeof Success> = {
+  render: (args) => {
+    return Success ? <Success {...standard()} {...args} /> : <></>
+  }
+}

package/dist/commands/generate/cell/templates/test.js.template

@@ -0,0 +1,42 @@
+import { render } from '@cedarjs/testing/web'
+
+import { Loading, Empty, Failure, Success } from './${pascalName}Cell'
+import { standard } from './${pascalName}Cell.mock'
+
+// Generated boilerplate tests do not account for all circumstances
+// and can fail without adjustments, e.g. Float and DateTime types.
+//           Please refer to the RedwoodJS Testing Docs:
+//        https://redwoodjs.com/docs/testing#testing-cells
+// https://redwoodjs.com/docs/testing#jest-expect-type-considerations
+
+describe('${pascalName}Cell', () => {
+  it('renders Loading successfully', () => {
+    expect(() => {
+      render(<Loading />)
+    }).not.toThrow()
+  })
+
+  it('renders Empty successfully', async () => {
+    expect(() => {
+      render(<Empty />)
+    }).not.toThrow()
+  })
+
+  it('renders Failure successfully', async () => {
+    expect(() => {
+      render(<Failure <% if (idName) { %>${idName}={${mockIdValues[0]}} <% } %>error={new Error('Oh no')} />)
+    }).not.toThrow()
+  })
+
+  // When you're ready to test the actual output of your component render
+  // you could test that, for example, certain text is present:
+  //
+  // 1. import { screen } from '@cedarjs/testing/web'
+  // 2. Add test: expect(screen.getByText('Hello, world')).toBeInTheDocument()
+
+  it('renders Success successfully', async () => {
+    expect(() => {
+      render(<Success <% if (idName) { %>${idName}={${mockIdValues[0]}} <% } %>${camelName}={standard().${camelName}} />)
+    }).not.toThrow()
+  })
+})

package/dist/commands/generate/cell/utils/utils.js

@@ -0,0 +1,43 @@
+import pascalcase from "pascalcase";
+import { listQueryTypeFieldsInProject } from "@cedarjs/internal/dist/gql";
+const getCellOperationNames = async () => {
+  const { getProject } = await import("@cedarjs/structure");
+  return getProject().cells.map((x) => {
+    return x.queryOperationName;
+  }).filter(Boolean);
+};
+const uniqueOperationName = async (name, { index = 1, list = false }) => {
+  let operationName = pascalcase(
+    index <= 1 ? `find_${name}_query` : `find_${name}_query_${index}`
+  );
+  if (list) {
+    operationName = index <= 1 ? `${pascalcase(name)}Query` : `${pascalcase(name)}Query_${index}`;
+  }
+  const cellOperationNames = await getCellOperationNames();
+  if (!cellOperationNames.includes(operationName)) {
+    return operationName;
+  }
+  return uniqueOperationName(name, { index: index + 1 });
+};
+const operationNameIsUnique = async (operationName) => {
+  const cellOperationNames = await getCellOperationNames();
+  return !cellOperationNames.includes(operationName);
+};
+const getIdType = (model) => {
+  return model.fields.find((field) => field.isId)?.type;
+};
+const getIdName = (model) => {
+  return model.fields.find((field) => field.isId)?.name;
+};
+const checkProjectForQueryField = async (queryFieldName) => {
+  const queryFields = await listQueryTypeFieldsInProject();
+  return queryFields.includes(queryFieldName);
+};
+export {
+  checkProjectForQueryField,
+  getCellOperationNames,
+  getIdName,
+  getIdType,
+  operationNameIsUnique,
+  uniqueOperationName
+};

package/dist/commands/generate/component/component.js

@@ -0,0 +1,15 @@
+import {
+  createCommand,
+  createBuilder,
+  createHandler
+} from "../yargsCommandHelpers.js";
+const command = createCommand("component");
+const description = "Generate a component";
+const builder = createBuilder({ componentName: "component" });
+const handler = createHandler("component");
+export {
+  builder,
+  command,
+  description,
+  handler
+};

package/dist/commands/generate/component/componentHandler.js

@@ -0,0 +1,55 @@
+import { transformTSToJS } from "../../../lib/index.js";
+import {
+  createHandler,
+  templateForComponentFile
+} from "../yargsHandlerHelpers.js";
+const REDWOOD_WEB_PATH_NAME = "components";
+const files = async ({ name, typescript = false, ...argv }) => {
+  const extension = typescript ? ".tsx" : ".jsx";
+  const componentFile = await templateForComponentFile({
+    name,
+    webPathSection: REDWOOD_WEB_PATH_NAME,
+    extension,
+    generator: "component",
+    templatePath: "component.tsx.template"
+  });
+  const testFile = await templateForComponentFile({
+    name,
+    extension: `.test${extension}`,
+    webPathSection: REDWOOD_WEB_PATH_NAME,
+    generator: "component",
+    templatePath: "test.tsx.template"
+  });
+  const storiesFile = await templateForComponentFile({
+    name,
+    extension: `.stories${extension}`,
+    webPathSection: REDWOOD_WEB_PATH_NAME,
+    generator: "component",
+    // Using two different template files here because we have a TS-specific
+    // information in a comment in the .tsx template
+    templatePath: typescript ? "stories.tsx.template" : "stories.jsx.template"
+  });
+  const files2 = [componentFile];
+  if (argv.stories) {
+    files2.push(storiesFile);
+  }
+  if (argv.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: "component",
+  filesFn: files
+});
+export {
+  files,
+  handler
+};

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

@@ -0,0 +1,10 @@
+const ${pascalName} = () => {
+  return (
+    <div>
+      <h2>{'${pascalName}'}</h2>
+      <p>{'Find me in ${outputPath}'}</p>
+    </div>
+  )
+}
+
+export default ${pascalName}

package/dist/commands/generate/component/templates/stories.jsx.template

@@ -0,0 +1,17 @@
+// Pass props to your component by passing an `args` object to your story
+//
+// ```jsx
+// export const Primary = {
+//  args: {
+//    propName: propValue
+//  }
+// }
+// ```
+//
+// See https://storybook.js.org/docs/7/writing-stories/args
+
+import ${pascalName} from './${pascalName}'
+
+export default { component: ${pascalName} }
+
+export const Primary = {}

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

@@ -0,0 +1,26 @@
+// Pass props to your component by passing an `args` object to your story
+//
+// ```tsx
+// export const Primary: Story = {
+//  args: {
+//    propName: propValue
+//  }
+// }
+// ```
+//
+// See https://storybook.js.org/docs/7/writing-stories/args
+
+import type { Meta, StoryObj } from '@storybook/react'
+
+import ${pascalName} from './${pascalName}'
+
+const meta: Meta<typeof ${pascalName}> = {
+  component: ${pascalName},
+  tags: ['autodocs']
+}
+
+export default meta
+
+type Story = StoryObj<typeof ${pascalName}>
+
+export const Primary: Story = {}

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

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

package/dist/commands/generate/dataMigration/dataMigration.js

@@ -0,0 +1,105 @@
+import path from "path";
+import { paramCase } from "change-case";
+import fs from "fs-extra";
+import { Listr } from "listr2";
+import terminalLink from "terminal-link";
+import { recordTelemetryAttributes } from "@cedarjs/cli-helpers";
+import c from "../../../lib/colors.js";
+import { getPaths, writeFilesTask } from "../../../lib/index.js";
+import { prepareForRollback } from "../../../lib/rollback.js";
+import { validateName } from "../helpers.js";
+import { getYargsDefaults } from "../yargsCommandHelpers.js";
+const POST_RUN_INSTRUCTIONS = `Next steps...
+
+   ${c.warning(
+  "After writing your migration, you can run it with:"
+)}
+
+     yarn rw dataMigrate up
+`;
+const TEMPLATE_PATHS = {
+  js: path.resolve(
+    import.meta.dirname,
+    "templates",
+    "dataMigration.js.template"
+  ),
+  ts: path.resolve(
+    import.meta.dirname,
+    "templates",
+    "dataMigration.ts.template"
+  )
+};
+const files = ({ name, typescript }) => {
+  const now = (/* @__PURE__ */ new Date()).toISOString();
+  const timestamp = now.split(".")[0].replace(/\D/g, "");
+  const basename = `${timestamp}-${paramCase(name)}`;
+  const extension = typescript ? "ts" : "js";
+  const outputFilename = basename + "." + extension;
+  const outputPath = path.join(getPaths().api.dataMigrations, outputFilename);
+  return {
+    [outputPath]: fs.readFileSync(TEMPLATE_PATHS[extension]).toString()
+  };
+};
+const command = "data-migration <name>";
+const aliases = ["dataMigration", "dm"];
+const description = "Generate a data migration";
+const builder = (yargs) => {
+  yargs.positional("name", {
+    description: "A descriptor of what this data migration does",
+    type: "string"
+  }).option("rollback", {
+    description: "Revert all generator actions if an error occurs",
+    type: "boolean",
+    default: true
+  }).epilogue(
+    `Also see the ${terminalLink(
+      "Redwood CLI Reference",
+      "https://redwoodjs.com/docs/cli-commands#generate-datamigration"
+    )}`
+  );
+  Object.entries(getYargsDefaults()).forEach(([option, config]) => {
+    yargs.option(option, config);
+  });
+};
+const handler = async (args) => {
+  recordTelemetryAttributes({
+    command: "generate data-migration",
+    force: args.force,
+    rollback: args.rollback
+  });
+  validateName(args.name);
+  const tasks = new Listr(
+    [
+      {
+        title: "Generating data migration file...",
+        task: () => {
+          return writeFilesTask(files(args));
+        }
+      },
+      {
+        title: "Next steps...",
+        task: (_ctx, task) => {
+          task.title = POST_RUN_INSTRUCTIONS;
+        }
+      }
+    ].filter(Boolean),
+    { rendererOptions: { collapseSubtasks: false } }
+  );
+  try {
+    if (args.rollback && !args.force) {
+      prepareForRollback(tasks);
+    }
+    await tasks.run();
+  } catch (e) {
+    console.log(c.error(e.message));
+    process.exit(1);
+  }
+};
+export {
+  aliases,
+  builder,
+  command,
+  description,
+  files,
+  handler
+};

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

@@ -0,0 +1,7 @@
+/**
+ * @typedef { import("@prisma/client").PrismaClient } PrismaClient
+ * @param {{db: PrismaClient}} db
+ */
+export default async ({ db }) => {
+  // Migration here...
+}

package/dist/commands/generate/dataMigration/templates/dataMigration.ts.template

@@ -0,0 +1,5 @@
+import type { PrismaClient } from '@prisma/client'
+
+export default async ({ db }: { db: PrismaClient }) => {
+  // Migration here...
+}