cli: allow more template files (#74)

.changeset/rotten-timers-sit.md

@@ -0,0 +1,5 @@
+---
+"create-eth": patch
+---
+
+add onchainkit to curated extension

.changeset/shy-horses-type.md

@@ -0,0 +1,5 @@
+---
+"create-eth": patch
+---
+
+feat: template files update

src/curated-extensions.ts

@@ -13,6 +13,10 @@ const CURATED_EXTENSIONS: { [key: string]: ExternalExtension } = {
     repository: "https://github.com/scaffold-eth/create-eth-extensions",
     branch: "ponder",
   },
+  onchainkit: {
+    repository: "https://github.com/scaffold-eth/create-eth-extensions",
+    branch: "onchainkit",
+  },
 };
 
 export { CURATED_EXTENSIONS };

templates/base/packages/nextjs/.env.example → templates/base/packages/nextjs/.env.example.template.mjs

@@ -1,13 +1,23 @@
-# Template for NextJS environment variables.
+import { withDefaults } from "../../../utils.js";
+
+const contents = ({ additionalVars }) => {
+  return `# Template for NextJS environment variables.
 
 # For local development, copy this file, rename it to .env.local, and fill in the values.
 # When deploying live, you'll need to store the vars in Vercel/System config.
 
-# If not set, we provide default values (check `scaffold.config.ts`) so developers can start prototyping out of the box,
+# If not set, we provide default values (check \`scaffold.config.ts\`) so developers can start prototyping out of the box,
 # but we recommend getting your own API Keys for Production Apps.
 
 # To access the values stored in this env file you can use: process.env.VARIABLENAME
 # You'll need to prefix the variables names with NEXT_PUBLIC_ if you want to access them on the client side.
 # More info: https://nextjs.org/docs/pages/building-your-application/configuring/environment-variables
 NEXT_PUBLIC_ALCHEMY_API_KEY=
 NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID=
+${additionalVars.join("\n")}
+`
+};
+
+export default withDefaults(contents, {
+  additionalVars: ""
+});

templates/base/packages/nextjs/app/layout.tsx → templates/base/packages/nextjs/app/layout.tsx.template.mjs

@@ -1,3 +1,8 @@
+import { withDefaults } from "../../../../utils.js";
+
+const contents = ({ imports }) => {
+  return `
+${imports.filter(Boolean).join("\n")}
 import "@rainbow-me/rainbowkit/styles.css";
 import { ScaffoldEthAppWithProviders } from "~~/components/ScaffoldEthAppWithProviders";
 import { ThemeProvider } from "~~/components/ThemeProvider";
@@ -21,4 +26,9 @@ const ScaffoldEthApp = ({ children }: { children: React.ReactNode }) => {
   );
 };
 
-export default ScaffoldEthApp;
+export default ScaffoldEthApp;`;
+};
+
+export default withDefaults(contents, {
+  imports: ""
+});

templates/base/packages/nextjs/components/ScaffoldEthAppWithProviders.tsx.template.mjs

@@ -4,7 +4,7 @@ const contents = ({ providerNames, providerSetups, providerImports, providerProp
   // filter out empty strings
   const providerOpeningTags = providerNames.filter(Boolean).map((name, index) => `<${name} ${providerProps[index]}>`);
 
-  const providerClosingTags = providerNames.filter(Boolean).map(name => `</${name}>`);
+  const providerClosingTags = providerNames.filter(Boolean).map(name => `</${name}>`).reverse();
 
   return `"use client";
 

templates/base/packages/nextjs/scaffold.config.ts.template.mjs

@@ -13,7 +13,7 @@ export type ScaffoldConfig = {
 
 const scaffoldConfig = {
   // The networks on which your DApp is live
-  targetNetworks: [chains.${chainName[0]}],
+  targetNetworks: [${chainName.map(chain => `chains.${chain}`).join(', ')}],
 
   // The interval at which your front-end polls the RPC servers for new data
   // it has no effect if you only target the local network (default is 4000)