chore: refactor withPayload back to js (#15159)

withPayload file has been migrated to ts however this breaks being able
to use `pnpm dev` in our templates

Fixes #14994

Author: paulpopus

packages/next/package.json

@@ -32,8 +32,8 @@
       "default": "./src/index.js"
     },
     "./withPayload": {
-      "import": "./src/withPayload/withPayload.ts",
-      "default": "./src/withPayload/withPayload.ts"
+      "import": "./src/withPayload/withPayload.js",
+      "default": "./src/withPayload/withPayload.js"
     },
     "./layouts": {
       "import": "./src/exports/layouts.ts",

…ages/next/src/withPayload/withPayload.ts …ages/next/src/withPayload/withPayload.jspackages/next/src/withPayload/withPayload.ts renamed to packages/next/src/withPayload/withPayload.js packages/next/src/withPayload/withPayload.ts renamed to packages/next/src/withPayload/withPayload.js

@@ -1,7 +1,9 @@
-/* eslint-disable no-console */
-/* eslint-disable no-restricted-exports */
-import type { NextConfig } from 'next'
-
+/**
+ * These files must remain as plain JavaScript (.js) rather than TypeScript (.ts) because they are
+ * imported directly in next.config.mjs files. Since next.config files run before the build process,
+ * TypeScript compilation is not available. This ensures compatibility with all templates and
+ * user projects regardless of their TypeScript setup.
+ */
 import {
   getNextjsVersion,
   supportsTurbopackExternalizeTransitiveDependencies,
@@ -18,10 +20,7 @@ const poweredByHeader = {
  * @param {Object} [options] - Optional configuration options
  * @param {boolean} [options.devBundleServerPackages] - Whether to bundle server packages in development mode. @default false
  * */
-export const withPayload = (
-  nextConfig: NextConfig = {},
-  options: { devBundleServerPackages?: boolean } = {},
-): NextConfig => {
+export const withPayload = (nextConfig = {}, options = {}) => {
   const nextjsVersion = getNextjsVersion()
 
   const supportsTurbopackBuild = supportsTurbopackExternalizeTransitiveDependencies(nextjsVersion)
@@ -35,7 +34,8 @@ export const withPayload = (
     env.NEXT_PUBLIC_ENABLE_ROUTER_CACHE_REFRESH = 'true'
   }
 
-  const baseConfig: NextConfig = {
+  /** @type {import('next').NextConfig} */
+  const baseConfig = {
     ...nextConfig,
     env,
     outputFileTracingExcludes: {

…ext/src/withPayload/withPayload.utils.ts …ext/src/withPayload/withPayload.utils.jspackages/next/src/withPayload/withPayload.utils.ts renamed to packages/next/src/withPayload/withPayload.utils.js packages/next/src/withPayload/withPayload.utils.ts renamed to packages/next/src/withPayload/withPayload.utils.js

@@ -1,4 +1,4 @@
-/* eslint-disable no-console */
+ 
 /**
  * This was taken and modified from https://github.com/getsentry/sentry-javascript/blob/15256034ee8150a5b7dcb97d23eca1a5486f0cae/packages/nextjs/src/config/util.ts
  *
@@ -28,34 +28,35 @@
 import { readFileSync } from 'fs'
 import { fileURLToPath } from 'url'
 
-function _parseInt(input: string | undefined): number {
+/**
+ * @param {string | undefined} input
+ * @returns {number}
+ */
+function _parseInt(input) {
   return parseInt(input || '', 10)
 }
 
 /**
  * Represents Semantic Versioning object
+ * @typedef {Object} SemVer
+ * @property {string} [buildmetadata]
+ * @property {number} [canaryVersion] - undefined if not a canary version
+ * @property {number} [major]
+ * @property {number} [minor]
+ * @property {number} [patch]
+ * @property {string} [prerelease]
  */
-type SemVer = {
-  buildmetadata?: string
-  /**
-   * undefined if not a canary version
-   */
-  canaryVersion?: number
-  major?: number
-  minor?: number
-  patch?: number
-  prerelease?: string
-}
 
 // https://semver.org/#is-there-a-suggested-regular-expression-regex-to-check-a-semver-string
 const SEMVER_REGEXP =
   /^(0|[1-9]\d*)\.(0|[1-9]\d*)\.(0|[1-9]\d*)(?:-((?:0|[1-9]\d*|\d*[a-z-][0-9a-z-]*)(?:\.(?:0|[1-9]\d*|\d*[a-z-][0-9a-z-]*))*))?(?:\+([0-9a-z-]+(?:\.[0-9a-z-]+)*))?$/i
 
 /**
  * Parses input into a SemVer interface
- * @param input string representation of a semver version
+ * @param {string} input - string representation of a semver version
+ * @returns {SemVer}
  */
-export function parseSemver(input: string): SemVer {
+export function parseSemver(input) {
   const match = input.match(SEMVER_REGEXP) || []
   const major = _parseInt(match[1])
   const minor = _parseInt(match[2])
@@ -78,10 +79,12 @@ export function parseSemver(input: string): SemVer {
 
 /**
  * Returns the version of Next.js installed in the project, or undefined if it cannot be determined.
+ * @returns {SemVer | undefined}
  */
-export function getNextjsVersion(): SemVer | undefined {
+export function getNextjsVersion() {
   try {
-    let pkgPath: string
+    /** @type {string} */
+    let pkgPath
 
     // Check if we're in ESM or CJS environment
     if (typeof import.meta?.resolve === 'function') {
@@ -106,10 +109,10 @@ export function getNextjsVersion(): SemVer | undefined {
 /**
  * Checks if the current Next.js version supports Turbopack externalize transitive dependencies.
  * This was introduced in Next.js v16.1.0-canary.3
+ * @param {SemVer | undefined} version
+ * @returns {boolean}
  */
-export function supportsTurbopackExternalizeTransitiveDependencies(
-  version: SemVer | undefined,
-): boolean {
+export function supportsTurbopackExternalizeTransitiveDependencies(version) {
   if (!version) {
     return false
   }

…ext/src/withPayload/withPayloadLegacy.ts …ext/src/withPayload/withPayloadLegacy.jspackages/next/src/withPayload/withPayloadLegacy.ts renamed to packages/next/src/withPayload/withPayloadLegacy.js packages/next/src/withPayload/withPayloadLegacy.ts renamed to packages/next/src/withPayload/withPayloadLegacy.js

@@ -1,10 +1,9 @@
-/* eslint-disable no-console */
-import type { NextConfig } from 'next'
-
 /**
  * Applies config options required to support Next.js versions before 16.1.0 and 16.1.0-canary.3.
+ * @param {import('next').NextConfig} nextConfig
+ * @returns {import('next').NextConfig}
  */
-export const withPayloadLegacy = (nextConfig: NextConfig = {}): NextConfig => {
+export const withPayloadLegacy = (nextConfig = {}) => {
   if (process.env.PAYLOAD_PATCH_TURBOPACK_WARNINGS !== 'false') {
     // TODO: This warning is thrown because we cannot externalize the entry-point package for client-s3, so we patch the warning to not show it.
     // We can remove this once Next.js implements https://github.com/vercel/next.js/discussions/76991
@@ -52,7 +51,8 @@ export const withPayloadLegacy = (nextConfig: NextConfig = {}): NextConfig => {
     )
   }
 
-  const toReturn: NextConfig = {
+  /** @type {import('next').NextConfig} */
+  const toReturn = {
     ...nextConfig,
     serverExternalPackages: [
       // serverExternalPackages = webpack.externals, but with turbopack support and an additional check