create-puck-app 0.10.1-canary.5dabebb → 0.10.1-canary.cc20c52

package/index.js

@@ -125,7 +125,7 @@ program
       const targetPath = filePath
         .replace(templatePath, appPath)
         .replace(".hbs", "")
-        .replace("gitignore", ".gitignore"); // .gitignore gets ignored by npm during publish, so we have to rename it
+        .replace("gitignore", ".gitignore"); // Rename gitignore back to .gitignore (.gitignore) gets ignored by npm during publish
 
       let data;
 

package/package.json

@@ -1,12 +1,16 @@
 {
   "name": "create-puck-app",
-  "version": "0.10.1-canary.5dabebb",
+  "version": "0.10.1-canary.cc20c52",
   "private": false,
   "license": "MIT",
   "type": "module",
   "bin": {
     "create-puck-app": "./index.js"
   },
+  "scripts": {
+    "generate": "node scripts/generate.js",
+    "prepublishOnly": "yarn generate"
+  },
   "dependencies": {
     "commander": "^10.0.1",
     "glob": "^10.3.4",

package/scripts/generate.js

@@ -0,0 +1,72 @@
+#!/usr/bin/env node
+
+import fs from "fs";
+import path from "path";
+import { glob } from "glob";
+import { dirname } from "path";
+import { fileURLToPath } from "url";
+
+const verbose = false;
+
+const run = async () => {
+  const __filename = fileURLToPath(import.meta.url);
+  const __dirname = dirname(__filename);
+
+  // Copy template files to the new directory
+  const recipePath = path.join(__dirname, "../../../recipes");
+  const templatePath = path.join(__dirname, "../templates");
+
+  if (!fs.existsSync(recipePath)) {
+    console.error(`No recipe directory could be found at ${recipePath}.`);
+    return;
+  }
+
+  if (!fs.existsSync(templatePath)) {
+    console.error(`No template directory could be found at ${templatePath}.`);
+    return;
+  }
+
+  // Compile handlebars templates
+  const recipeFiles = glob.sync(`**/*`, {
+    cwd: recipePath,
+    nodir: true,
+    dot: true,
+  });
+
+  console.warn(
+    `⚠️   The following files use handlebars templates. Please manually update them:`
+  );
+
+  let counter = 0;
+
+  for (const recipeFile of recipeFiles) {
+    const filePath = path.join(recipePath, recipeFile);
+
+    const targetPath = filePath
+      .replace(recipePath, templatePath)
+      .replace(".gitignore", "gitignore"); // rename .gitignore to gitignore so NPM publish doesn't ignore it
+
+    // Don't copy file if it's templated by handlebars
+    if (fs.existsSync(`${targetPath}.hbs`)) {
+      console.warn(`- ${recipeFile}`);
+    } else {
+      if (verbose) {
+        console.log(`Copying ${filePath} -> ${targetPath}`);
+      }
+
+      const data = await fs.readFileSync(filePath, "utf-8");
+
+      const dir = path.dirname(targetPath);
+
+      await fs.mkdirSync(dir, { recursive: true });
+
+      await fs.writeFileSync(targetPath, data);
+
+      counter += 1;
+    }
+  }
+
+  console.log(`Copied ${counter} files into generator!`);
+};
+
+await run();

package/templates/next/.eslintrc.js

@@ -1,4 +0,0 @@
-module.exports = {
-  root: true,
-  extends: ["custom"],
-};

package/templates/next/app/[...puckPath]/client.tsx

@@ -1,32 +0,0 @@
-"use client";
-
-import type { Data } from "@measured/puck";
-import { Puck, Render } from "@measured/puck";
-import config from "../../puck.config";
-
-export function Client({
-  path,
-  data,
-  isEdit,
-}: {
-  path: string;
-  data: Data;
-  isEdit: boolean;
-}) {
-  if (isEdit) {
-    return (
-      <Puck
-        config={config}
-        data={data}
-        onPublish={async (data: Data) => {
-          await fetch("/api/puck", {
-            method: "post",
-            body: JSON.stringify({ data, path }),
-          });
-        }}
-      />
-    );
-  }
-
-  return <Render config={config} data={data} />;
-}

package/templates/next/app/[...puckPath]/page.tsx

@@ -1,49 +0,0 @@
-import { Client } from "./client";
-import { notFound } from "next/navigation";
-import resolvePuckPath from "./resolve-puck-path";
-import { Metadata } from "next";
-import { Data } from "@measured/puck";
-import fs from "fs";
-
-// Replace with call to your database
-const getPage = (path: string) => {
-  const allData: Record<string, Data> | null = fs.existsSync("database.json")
-    ? JSON.parse(fs.readFileSync("database.json", "utf-8"))
-    : null;
-
-  return allData ? allData[path] : null;
-};
-
-export async function generateMetadata({
-  params,
-}: {
-  params: { puckPath: string[] };
-}): Promise<Metadata> {
-  const { isEdit, path } = resolvePuckPath(params.puckPath);
-
-  if (isEdit) {
-    return {
-      title: "Puck: " + path,
-    };
-  }
-
-  return {
-    title: getPage(path)?.root.title,
-  };
-}
-
-export default async function Page({
-  params,
-}: {
-  params: { puckPath: string[] };
-}) {
-  const { isEdit, path } = resolvePuckPath(params.puckPath);
-
-  const data = getPage(path);
-
-  if (!data && !isEdit) {
-    return notFound();
-  }
-
-  return <Client isEdit={isEdit} path={path} data={data} />;
-}

package/templates/next/app/[...puckPath]/resolve-puck-path.ts

@@ -1,15 +0,0 @@
-const resolvePuckPath = (puckPath: string[] = []) => {
-  const hasPath = puckPath.length > 0;
-
-  const isEdit = hasPath ? puckPath[puckPath.length - 1] === "edit" : false;
-
-  return {
-    isEdit,
-    path: `/${(isEdit
-      ? [...puckPath].slice(0, puckPath.length - 1)
-      : [...puckPath]
-    ).join("/")}`,
-  };
-};
-
-export default resolvePuckPath;

package/templates/next/app/api/puck/route.ts

@@ -1,25 +0,0 @@
-import { revalidatePath } from "next/cache";
-import { NextResponse } from "next/server";
-import fs from "fs";
-
-export async function POST(request: Request) {
-  const payload = await request.json();
-
-  const existingData = JSON.parse(
-    fs.existsSync("database.json")
-      ? fs.readFileSync("database.json", "utf-8")
-      : "{}"
-  );
-
-  const updatedData = {
-    ...existingData,
-    [payload.path]: payload.data,
-  };
-
-  fs.writeFileSync("database.json", JSON.stringify(updatedData));
-
-  // Purge Next.js cache
-  revalidatePath(payload.path);
-
-  return NextResponse.json({ status: "ok" });
-}

package/templates/next/app/layout.tsx

@@ -1,14 +0,0 @@
-import "@measured/puck/dist/index.css";
-import "./styles.css";
-
-export default function RootLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
-  return (
-    <html lang="en">
-      <body>{children}</body>
-    </html>
-  );
-}

package/templates/next/app/page.tsx

@@ -1 +0,0 @@
-export { default, generateMetadata } from "./[...puckPath]/page";

package/templates/next/app/styles.css

@@ -1,5 +0,0 @@
-html,
-body {
-  margin: 0;
-  padding: 0;
-}

package/templates/next/database.json

@@ -1 +0,0 @@
-{"/":{"content":[{"type":"HeadingBlock","props":{"title":"Edit this page by adding /edit to the end of the URL","id":"HeadingBlock-1694032984497"}}],"root":{"title":""}}}

package/templates/next/gitignore

@@ -1,36 +0,0 @@
-# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
-
-# dependencies
-/node_modules
-/.pnp
-.pnp.js
-
-# testing
-/coverage
-
-# next.js
-/.next/
-/out/
-
-# production
-/build
-
-# misc
-.DS_Store
-*.pem
-
-# debug
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-
-# local env files
-.env.local
-.env.development.local
-.env.test.local
-.env.production.local
-
-# vercel
-.vercel
-
-database.json

package/templates/next/next-env.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="next" />
-/// <reference types="next/image-types/global" />
-
-// NOTE: This file should not be edited
-// see https://nextjs.org/docs/basic-features/typescript for more information.

package/templates/next/next.config.js

@@ -1,4 +0,0 @@
-module.exports = {
-  reactStrictMode: true,
-  transpilePackages: ["ui"],
-};

package/templates/next/puck.config.tsx

@@ -1,25 +0,0 @@
-import type { Config } from "@measured/puck";
-
-type Props = {
-  HeadingBlock: { title: string };
-};
-
-export const config: Config<Props> = {
-  components: {
-    HeadingBlock: {
-      fields: {
-        title: { type: "text" },
-      },
-      defaultProps: {
-        title: "Heading",
-      },
-      render: ({ title }) => (
-        <div style={{ padding: 64 }}>
-          <h1>{title}</h1>
-        </div>
-      ),
-    },
-  },
-};
-
-export default config;

package/templates/next/tsconfig/base.json

@@ -1,20 +0,0 @@
-{
-  "$schema": "https://json.schemastore.org/tsconfig",
-  "display": "Default",
-  "compilerOptions": {
-    "composite": false,
-    "declaration": true,
-    "declarationMap": true,
-    "esModuleInterop": true,
-    "forceConsistentCasingInFileNames": true,
-    "inlineSources": false,
-    "isolatedModules": true,
-    "moduleResolution": "node",
-    "noUnusedLocals": false,
-    "noUnusedParameters": false,
-    "preserveWatchOutput": true,
-    "skipLibCheck": true,
-    "strict": true
-  },
-  "exclude": ["node_modules"]
-}

package/templates/next/tsconfig/nextjs.json

@@ -1,21 +0,0 @@
-{
-  "$schema": "https://json.schemastore.org/tsconfig",
-  "display": "Next.js",
-  "extends": "./base.json",
-  "compilerOptions": {
-    "plugins": [{ "name": "next" }],
-    "allowJs": true,
-    "declaration": false,
-    "declarationMap": false,
-    "incremental": true,
-    "jsx": "preserve",
-    "lib": ["dom", "dom.iterable", "esnext"],
-    "module": "esnext",
-    "noEmit": true,
-    "resolveJsonModule": true,
-    "strict": false,
-    "target": "es5"
-  },
-  "include": ["src", "next-env.d.ts"],
-  "exclude": ["node_modules"]
-}

package/templates/next/tsconfig.json

@@ -1,8 +0,0 @@
-{
-  "extends": "./tsconfig/nextjs.json",
-  "compilerOptions": {
-    "plugins": [{ "name": "next" }]
-  },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
-  "exclude": ["node_modules"]
-}