From b8d42f68180863adaf4a7df10a3fef7823c10ff3 Mon Sep 17 00:00:00 2001
From: Dario Piotrowicz <dario@cloudflare.com>
Date: Fri, 24 Jan 2025 22:53:01 +0000
Subject: [PATCH] update experimental Next.js template to work on
 `@opennextjs/cloudflare@0.4.x`

---
 .changeset/cyan-suits-move.md                 |  5 ++++
 .../templates-experimental/next/c3.ts         | 27 ++++++++++++++++++-
 2 files changed, 31 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/cyan-suits-move.md

diff --git a/.changeset/cyan-suits-move.md b/.changeset/cyan-suits-move.md
new file mode 100644
index 000000000000..3c363e6bbb73
--- /dev/null
+++ b/.changeset/cyan-suits-move.md
@@ -0,0 +1,5 @@
+---
+"create-cloudflare": patch
+---
+
+update experimental Next.js template to work on `@opennextjs/cloudflare@0.4.x`
diff --git a/packages/create-cloudflare/templates-experimental/next/c3.ts b/packages/create-cloudflare/templates-experimental/next/c3.ts
index 9835461cfd9a..37aabc3d7821 100644
--- a/packages/create-cloudflare/templates-experimental/next/c3.ts
+++ b/packages/create-cloudflare/templates-experimental/next/c3.ts
@@ -1,5 +1,7 @@
 import { brandColor, dim } from "@cloudflare/cli/colors";
+import { spinner } from "@cloudflare/cli/interactive";
 import { runFrameworkGenerator } from "frameworks/index";
+import { readFile, writeFile } from "helpers/files";
 import { installPackages } from "helpers/packages";
 import type { TemplateConfig } from "../../src/templates";
 import type { C3Context } from "types";
@@ -19,7 +21,7 @@ const generate = async (ctx: C3Context) => {
 
 const configure = async () => {
 	const packages = [
-		"@opennextjs/cloudflare@0.3.x",
+		"@opennextjs/cloudflare@0.4.x",
 		"@cloudflare/workers-types",
 	];
 	await installPackages(packages, {
@@ -27,6 +29,29 @@ const configure = async () => {
 		startText: "Adding the Cloudflare adapter",
 		doneText: `${brandColor(`installed`)} ${dim(packages.join(", "))}`,
 	});
+
+	updateNextConfig();
+};
+
+const updateNextConfig = () => {
+	const s = spinner();
+
+	const configFile = "next.config.mjs";
+	s.start(`Updating \`${configFile}\``);
+
+	const configContent = readFile(configFile);
+
+	const updatedConfigFile =
+		configContent +
+		`
+		// added by create cloudflare to enable calling \`getCloudflareContext()\` in \`next dev\`
+		import { initOpenNextCloudflareForDev } from '@opennextjs/cloudflare';
+		initOpenNextCloudflareForDev();
+		`.replace(/\n\t*/g, "\n");
+
+	writeFile(configFile, updatedConfigFile);
+
+	s.stop(`${brandColor(`updated`)} ${dim(`\`${configFile}\``)}`);
 };
 
 export default {