The graph

src/config.ts

@@ -9,6 +9,13 @@ const config: Config = {
       extensions: ["hardhat", "foundry", null],
       default: "hardhat",
     }),
+    typedQuestion({
+      type: "multi-select",
+      name: "Extension",
+      message: "Which extensions do you want to install?",
+      extensions: ["subgraph"],
+      default: undefined,
+    }),
   ],
 };
 export default config;

src/types.ts

@@ -15,9 +15,7 @@ type NonNullableRawOptions = {
 
 export type Options = NonNullableRawOptions;
 
-export type Extension =
-  | "hardhat"
-  | "foundry"
+export type Extension = "hardhat" | "foundry" | "subgraph";
 type NullExtension = null;
 export type ExtensionOrNull = Extension | NullExtension;
 // corresponds to inquirer question types:

src/utils/render-outro-message.ts

@@ -12,6 +12,18 @@ export async function renderOutroMessage(options: Options) {
   ${chalk.dim("cd")} ${options.project}
   `;
 
+  if (!options.install) {
+    message += `
+    \t${chalk.bold("Install dependencies")}
+    \t${chalk.dim("yarn")} install
+    `;
+
+    message += `
+    \t${chalk.bold("Format files with prettier")}
+    \t${chalk.dim("yarn")} format
+    `;
+  }
+
   if (
     options.extensions.includes("hardhat") ||
     options.extensions.includes("foundry")
@@ -45,6 +57,10 @@ export async function renderOutroMessage(options: Options) {
   \t${chalk.dim("yarn")} start
   `;
 
+  message += `
+  \t${chalk.bold("Check out the README.md for more information")}
+  `;
+
   message += `
   ${chalk.bold.green("Thanks for using Scaffold-ETH 2 🙏, Happy Building!")}
   `;

templates/base/README.md.template.mjs

@@ -62,6 +62,7 @@ const contents = ({
   contractsPath,
   scriptsPath,
   testCommand,
+  extraContents,
 }) =>
   `# 🏗 Scaffold-ETH 2
 
@@ -102,6 +103,7 @@ ${getQuickStart({
   scriptsPath,
   testCommand,
 })}
+${extraContents.filter(Boolean).join("\n")}
 ## Documentation
 
 Visit our [docs](https://docs.scaffoldeth.io) to learn how to start building with Scaffold-ETH 2.
@@ -120,4 +122,5 @@ export default withDefaults(contents, {
   contractsPath: "",
   scriptsPath: "",
   testCommand: "",
+  extraContents: "",
 });

templates/base/packages/nextjs/components/Header.tsx → templates/base/packages/nextjs/components/Header.tsx.template.mjs

@@ -1,4 +1,6 @@
-"use client";
+import { withDefaults } from "../../../../utils.js";
+const contents = ({ menuIconImports, menuObjects }) => {
+  return `"use client";
 
 import React, { useCallback, useRef, useState } from "react";
 import Image from "next/image";
@@ -7,6 +9,7 @@ import { usePathname } from "next/navigation";
 import { Bars3Icon, BugAntIcon } from "@heroicons/react/24/outline";
 import { FaucetButton, RainbowKitCustomConnectButton } from "~~/components/scaffold-eth";
 import { useOutsideClick } from "~~/hooks/scaffold-eth";
+${menuIconImports.filter(Boolean).join("\n")}
 
 type HeaderMenuLink = {
   label: string;
@@ -24,6 +27,7 @@ export const menuLinks: HeaderMenuLink[] = [
     href: "/debug",
     icon: <BugAntIcon className="h-4 w-4" />,
   },
+  ${menuObjects.filter(Boolean).join(",\n")}
 ];
 
 export const HeaderMenuLinks = () => {
@@ -38,9 +42,9 @@ export const HeaderMenuLinks = () => {
             <Link
               href={href}
               passHref
-              className={`${
+              className={\`\${
                 isActive ? "bg-secondary shadow-md" : ""
-              } hover:bg-secondary hover:shadow-md focus:!bg-secondary active:!text-neutral py-1.5 px-3 text-sm rounded-full gap-2 grid grid-flow-col`}
+              } hover:bg-secondary hover:shadow-md focus:!bg-secondary active:!text-neutral py-1.5 px-3 text-sm rounded-full gap-2 grid grid-flow-col\`}
             >
               {icon}
               <span>{label}</span>
@@ -69,7 +73,7 @@ export const Header = () => {
         <div className="lg:hidden dropdown" ref={burgerMenuRef}>
           <label
             tabIndex={0}
-            className={`ml-1 btn btn-ghost ${isDrawerOpen ? "hover:bg-secondary" : "hover:bg-transparent"}`}
+            className={\`ml-1 btn btn-ghost \${isDrawerOpen ? "hover:bg-secondary" : "hover:bg-transparent"}\`}
             onClick={() => {
               setIsDrawerOpen(prevIsOpenState => !prevIsOpenState);
             }}
@@ -107,4 +111,10 @@ export const Header = () => {
       </div>
     </div>
   );
+};`;
 };
+
+export default withDefaults(contents, {
+  menuIconImports: "",
+  menuObjects: "",
+});

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

@@ -1,4 +1,12 @@
-"use client";
+import { withDefaults } from "../../../../utils.js";
+
+const contents = ({ providerNames, providerSetups, providerImports, providerProps }) => {
+  // filter out empty strings
+  const providerOpeningTags = providerNames.filter(Boolean).map((name, index) => `<${name} ${providerProps[index]}>`);
+
+  const providerClosingTags = providerNames.filter(Boolean).map(name => `</${name}>`);
+
+  return `"use client";
 
 import { useEffect, useState } from "react";
 import { RainbowKitProvider, darkTheme, lightTheme } from "@rainbow-me/rainbowkit";
@@ -13,6 +21,7 @@ import { ProgressBar } from "~~/components/scaffold-eth/ProgressBar";
 import { useNativeCurrencyPrice } from "~~/hooks/scaffold-eth";
 import { useGlobalState } from "~~/services/store/store";
 import { wagmiConfig } from "~~/services/web3/wagmiConfig";
+${providerImports.filter(Boolean).join("\n")}
 
 const ScaffoldEthApp = ({ children }: { children: React.ReactNode }) => {
   const price = useNativeCurrencyPrice();
@@ -44,6 +53,8 @@ export const queryClient = new QueryClient({
   },
 });
 
+${providerSetups.filter(Boolean).join("\n")}
+
 export const ScaffoldEthAppWithProviders = ({ children }: { children: React.ReactNode }) => {
   const { resolvedTheme } = useTheme();
   const isDarkMode = resolvedTheme === "dark";
@@ -61,9 +72,19 @@ export const ScaffoldEthAppWithProviders = ({ children }: { children: React.Reac
           avatar={BlockieAvatar}
           theme={mounted ? (isDarkMode ? darkTheme() : lightTheme()) : lightTheme()}
         >
+          ${providerOpeningTags.join("\n")}
           <ScaffoldEthApp>{children}</ScaffoldEthApp>
+          ${providerClosingTags.join("\n")}
         </RainbowKitProvider>
       </QueryClientProvider>
     </WagmiProvider>
   );
+};`;
 };
+
+export default withDefaults(contents, {
+  providerNames: "",
+  providerSetups: "",
+  providerImports: "",
+  providerProps: "",
+});

templates/extensions/foundry/README.md.args.mjs

@@ -3,3 +3,4 @@ export const networkConfigPath = `\`packages/foundry/foundry.toml\``;
 export const contractsPath = `\`packages/foundry/contracts\``;
 export const scriptsPath = `\`packages/foundry/script\``;
 export const testCommand = `\`yarn foundry:test\``;
+export const extraContents = "";

templates/extensions/hardhat/README.md.args.mjs

@@ -3,3 +3,4 @@ export const networkConfigPath = `\`packages/hardhat/hardhat.config.ts\``;
 export const contractsPath = `\`packages/hardhat/contracts\``;
 export const scriptsPath = `\`packages/hardhat/deploy\``;
 export const testCommand = `\`yarn hardhat:test\``;
+export const extraContents = "";