docs: update to next 15 + eslint 9 (#9839)

* update next

* updated react

* update eslint

* finish updating eslint

* fix content lint errors

* fix docs test

* fix vale action

* fix installation errors

.github/workflows/docs-test.yml

@@ -39,6 +39,7 @@ jobs:
         run: yarn build
         env:
           NEXT_PUBLIC_BASE_URL: "http://localhost:3000"
+          NEXT_PUBLIC_BASE_PATH: /api
           NEXT_PUBLIC_DOCS_URL: "https://medusa-docs.vercel.app"
           NEXT_PUBLIC_UI_URL: "https://docs-ui.vercel.app"
           # TODO change once we have actual URLs
@@ -317,7 +318,7 @@ jobs:
       - name: Get Directories to Scan
         if: ${{ steps.pr-files.outputs.files_lt_threshold == 'true' }}
         working-directory: www/vale
-        run: ./get-files.sh api-reference app/_mdx
+        run: ./get-files.sh api-reference markdown
         id: directories
 
       - name: Vale Linter

www/.eslintrc.js

@@ -1,10 +0,0 @@
-module.exports = {
-  root: true,
-  // This tells ESLint to load the config from the package `eslint-config-docs`
-  extends: ["docs"],
-  settings: {
-    next: {
-      rootDir: ["apps/*/"],
-    },
-  },
-};

www/apps/api-reference/.eslintrc.js

@@ -1,11 +0,0 @@
-module.exports = {
-  root: true,
-  extends: [
-    "docs/next"
-  ],
-  settings: {
-    next: {
-      rootDir: ".",
-    },
-  }
-}

www/apps/api-reference/app/admin/page.tsx

@@ -1,11 +1,13 @@
+/* eslint-disable @typescript-eslint/ban-ts-comment */
 import AreaProvider from "@/providers/area"
-import AdminContent from "../_mdx/admin.mdx"
+import AdminContent from "@/markdown/admin.mdx"
 import Tags from "@/components/Tags"
 import PageTitleProvider from "@/providers/page-title"
 import { H1 } from "docs-ui"
 import { getBaseSpecs } from "../../lib"
 import BaseSpecsProvider from "../../providers/base-specs"
 import clsx from "clsx"
+import React from "react"
 
 const AdminPage = async () => {
   const data = await getBaseSpecs("admin")
@@ -23,6 +25,7 @@ const AdminPage = async () => {
           >
             Medusa V2 Admin API Reference
           </H1>
+          {/* @ts-ignore React v19 doesn't see MDX as valid component */}
           <AdminContent />
           <Tags tags={data?.tags} />
         </PageTitleProvider>

www/apps/api-reference/app/download/[area]/route.ts

@@ -3,12 +3,13 @@ import { NextResponse } from "next/server"
 import path from "path"
 
 type DownloadParams = {
-  params: {
+  params: Promise<{
     area: string
-  }
+  }>
 }
 
-export function GET(request: Request, { params }: DownloadParams) {
+export async function GET(request: Request, props: DownloadParams) {
+  const params = await props.params
   const { area } = params
   const filePath = path.join(process.cwd(), "specs", area, "openapi.full.yaml")
 

www/apps/api-reference/app/store/page.tsx

@@ -1,5 +1,6 @@
+/* eslint-disable @typescript-eslint/ban-ts-comment */
 import AreaProvider from "@/providers/area"
-import StoreContent from "../_mdx/store.mdx"
+import StoreContent from "@/markdown/store.mdx"
 import Tags from "@/components/Tags"
 import PageTitleProvider from "@/providers/page-title"
 import { H1 } from "docs-ui"
@@ -23,6 +24,7 @@ const StorePage = async () => {
           >
             Medusa V2 Store API Reference
           </H1>
+          {/* @ts-ignore React v19 doesn't see MDX as valid component */}
           <StoreContent />
           <Tags tags={data?.tags} />
         </PageTitleProvider>

www/apps/api-reference/components/Tags/Section/Schema/index.tsx

@@ -116,6 +116,7 @@ const TagSectionSchema = ({ schema, tagName }: TagSectionSchemaProps) => {
   return (
     <Suspense>
       <InView
+        // @ts-expect-error Type is being read as undefined
         as="div"
         id={schemaSlug}
         initialInView={true}

www/apps/api-reference/components/Tags/index.tsx

@@ -14,9 +14,7 @@ type TagsProps = {
 const Tags = ({ tags }: TagsProps) => {
   return (
     <Suspense>
-      {tags?.map((tag) => (
+      {tags?.map((tag) => <TagSection tag={tag} key={tag.name} />)}
-        <TagSection tag={tag} key={tag.name} />
-      ))}
     </Suspense>
   )
 }

www/apps/api-reference/eslint.config.mjs

@@ -0,0 +1,205 @@
+import prettier from "eslint-plugin-prettier/recommended"
+import globals from "globals"
+import babelParser from "@babel/eslint-parser"
+import typescriptEslintEslintPlugin from "@typescript-eslint/eslint-plugin"
+import tsParser from "@typescript-eslint/parser"
+import path from "node:path"
+import { fileURLToPath } from "node:url"
+import js from "@eslint/js"
+import { FlatCompat } from "@eslint/eslintrc"
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all,
+})
+
+export default [
+  prettier,
+  {
+    ignores: ["**/eslint-config-docs", "**/.eslintrc.js", "**/dist"],
+  },
+  ...compat.extends(
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:react/jsx-runtime",
+    "plugin:react-hooks/recommended",
+    "plugin:@next/next/recommended"
+  ),
+  {
+    languageOptions: {
+      globals: {
+        ...globals.node,
+        ...globals.jest,
+        ...globals.browser,
+      },
+
+      parser: babelParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        requireConfigFile: false,
+
+        ecmaFeatures: {
+          experimentalDecorators: true,
+          jsx: true,
+          modules: true,
+        },
+
+        project: true,
+      },
+    },
+
+    settings: {
+      react: {
+        version: "detect",
+      },
+    },
+
+    rules: {
+      curly: ["error", "all"],
+      "new-cap": "off",
+      "require-jsdoc": "off",
+      "no-unused-expressions": "off",
+      "no-unused-vars": "off",
+      camelcase: "off",
+      "no-invalid-this": "off",
+
+      "max-len": [
+        "error",
+        {
+          code: 80,
+          ignoreStrings: true,
+          ignoreRegExpLiterals: true,
+          ignoreComments: true,
+          ignoreTrailingComments: true,
+          ignoreUrls: true,
+          ignoreTemplateLiterals: true,
+        },
+      ],
+
+      semi: ["error", "never"],
+
+      quotes: [
+        "error",
+        "double",
+        {
+          allowTemplateLiterals: true,
+        },
+      ],
+
+      "comma-dangle": [
+        "error",
+        {
+          arrays: "always-multiline",
+          objects: "always-multiline",
+          imports: "always-multiline",
+          exports: "always-multiline",
+          functions: "never",
+        },
+      ],
+
+      "object-curly-spacing": ["error", "always"],
+      "arrow-parens": ["error", "always"],
+      "linebreak-style": 0,
+
+      "no-confusing-arrow": [
+        "error",
+        {
+          allowParens: false,
+        },
+      ],
+
+      "space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "space-infix-ops": "error",
+      "eol-last": ["error", "always"],
+
+      "no-console": [
+        "error",
+        {
+          allow: ["error", "warn"],
+        },
+      ],
+
+      "react/prop-types": [
+        2,
+        {
+          ignore: ["className"],
+        },
+      ],
+    },
+  },
+  ...compat
+    .extends(
+      "plugin:@typescript-eslint/recommended",
+      "plugin:react/recommended"
+    )
+    .map((config) => ({
+      ...config,
+      files: ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"],
+    })),
+  {
+    files: ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"],
+
+    plugins: {
+      "@typescript-eslint": typescriptEslintEslintPlugin,
+    },
+
+    languageOptions: {
+      parser: tsParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        project: "./tsconfig.json",
+      },
+    },
+    settings: {
+      next: {
+        rootDir: ".",
+      },
+    },
+    ignores: [
+      "**/next.config.js",
+      "**/spec",
+      "**/node_modules",
+      "**/public",
+      "**/.eslintrc.js",
+    ],
+
+    rules: {
+      "react/react-in-jsx-scope": "off",
+      "@typescript-eslint/prefer-ts-expect-error": "off",
+      "valid-jsdoc": "off",
+      "@typescript-eslint/no-non-null-assertion": "off",
+      "@typescript-eslint/no-floating-promises": "error",
+      "@typescript-eslint/await-thenable": "error",
+      "@typescript-eslint/promise-function-async": "error",
+      "@/keyword-spacing": "error",
+
+      "@/space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "@/space-infix-ops": "error",
+      "@typescript-eslint/no-explicit-any": "warn",
+      "@typescript-eslint/no-unused-vars": "warn",
+    },
+  },
+]

www/apps/api-reference/next.config.mjs

@@ -1,10 +1,12 @@
-import mdx from "@next/mdx"
+import createMDX from "@next/mdx"
 import bundleAnalyzer from "@next/bundle-analyzer"
 import rehypeMdxCodeProps from "rehype-mdx-code-props"
 import rehypeSlug from "rehype-slug"
 
 /** @type {import('next').NextConfig} */
 const nextConfig = {
+  // Configure `pageExtensions` to include MDX files
+  pageExtensions: ["js", "jsx", "mdx", "ts", "tsx"],
   basePath: process.env.NEXT_PUBLIC_BASE_PATH || "/api",
   webpack: (config) => {
     config.ignoreWarnings = [{ module: /node_modules\/keyv\/src\/index\.js/ }]
@@ -23,8 +25,7 @@ const nextConfig = {
   },
 }
 
-const withMDX = mdx({
+const withMDX = createMDX({
-  extension: /\.mdx?$/,
   options: {
     rehypePlugins: [
       [
@@ -43,4 +44,4 @@ const withBundleAnalyzer = bundleAnalyzer({
   enabled: process.env.ANALYZE_BUNDLE === "true",
 })
 
-export default withBundleAnalyzer(withMDX(nextConfig))
+export default withMDX(nextConfig)

www/apps/api-reference/package.json

@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "next dev",
+    "dev": "NODE_OPTIONS='--inspect' next dev",
     "dev:monorepo": "yarn dev -p 3000",
     "build": "next build",
     "build:dev": "NODE_ENV=test next build",
@@ -13,40 +13,33 @@
     "lint": "next lint --fix"
   },
   "dependencies": {
-    "@mdx-js/loader": "^3.0.0",
+    "@mdx-js/loader": "^3.1.0",
-    "@mdx-js/react": "^3.0.0",
+    "@mdx-js/react": "^3.1.0",
     "@medusajs/icons": "^2.0.0",
     "@medusajs/ui": "^3.0.0",
-    "@next/mdx": "14.2.14",
+    "@next/mdx": "15.0.1",
     "@react-hook/resize-observer": "^2.0.2",
     "@readme/openapi-parser": "^2.5.0",
-    "@types/mapbox__rehype-prism": "^0.8.0",
-    "@types/mdx": "^2.0.5",
-    "@types/node": "20.4.5",
-    "@types/react": "^18.2.0",
-    "@types/react-dom": "^18.2.0",
-    "@types/react-transition-group": "^4.4.6",
     "algoliasearch": "4",
     "autoprefixer": "10.4.14",
     "clsx": "^2.0.0",
     "docs-ui": "*",
-    "eslint-config-docs": "*",
     "jsdom": "^22.1.0",
     "json-schema": "^0.4.0",
     "json-stringify-pretty-compact": "^4.0.0",
-    "next": "^14.2.14",
+    "next": "15.0.1",
-    "next-mdx-remote": "^4.4.1",
+    "next-mdx-remote": "5.0.0",
     "openapi-sampler": "^1.3.1",
     "openapi-types": "^12.1.3",
     "pluralize": "^8.0.0",
     "postcss": "8.4.27",
-    "prism-react-renderer": "2.3.1",
+    "prism-react-renderer": "2.4.0",
-    "react": "^18.2.0",
+    "react": "rc",
-    "react-dom": "^18.2.0",
+    "react-dom": "rc",
-    "react-intersection-observer": "^9.5.3",
+    "react-intersection-observer": "^9.13.1",
-    "react-tooltip": "^5.19.0",
+    "react-tooltip": "^5.28.0",
     "react-transition-group": "^4.4.5",
-    "rehype-mdx-code-props": "^2.0.0",
+    "rehype-mdx-code-props": "^3.0.1",
     "rehype-slug": "^6.0.0",
     "slugify": "^1.6.6",
     "swr": "^2.2.0",
@@ -56,12 +49,24 @@
     "yaml": "^2.3.1"
   },
   "devDependencies": {
-    "@next/bundle-analyzer": "^14.2.14",
+    "@next/bundle-analyzer": "15.0.1",
     "@types/jsdom": "^21.1.1",
+    "@types/mapbox__rehype-prism": "^0.8.0",
+    "@types/mdx": "^2.0.13",
+    "@types/node": "20.4.5",
     "@types/pluralize": "^0.0.33",
+    "@types/react": "npm:types-react@rc",
+    "@types/react-dom": "npm:types-react@rc",
+    "eslint": "^9.13.0",
+    "eslint-plugin-prettier": "^5.2.1",
+    "eslint-plugin-react-hooks": "^5.0.0",
     "types": "*"
   },
   "engines": {
     "node": ">=20"
+  },
+  "overrides": {
+    "@types/react": "npm:types-react@rc",
+    "@types/react-dom": "npm:types-react-dom@rc"
   }
 }

www/apps/api-reference/types/global.d.ts

@@ -1,4 +1,4 @@
-export declare global {
+declare global {
   interface Window {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     analytics?: any

www/apps/book/.content.eslint.mjs

@@ -0,0 +1,159 @@
+import prettier from "eslint-plugin-prettier"
+import markdown from "eslint-plugin-markdown"
+import globals from "globals"
+import babelParser from "@babel/eslint-parser"
+import typescriptEslintEslintPlugin from "@typescript-eslint/eslint-plugin"
+import tsParser from "@typescript-eslint/parser"
+import path from "node:path"
+import { fileURLToPath } from "node:url"
+import js from "@eslint/js"
+import { FlatCompat } from "@eslint/eslintrc"
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all,
+})
+
+export default [
+  {
+    ignores: [
+      "**/references/**/*",
+      "**/events-reference/**/*",
+      "**/_events-table/**/*",
+    ],
+  },
+  {
+    plugins: {
+      prettier,
+      markdown,
+    },
+
+    languageOptions: {
+      globals: {
+        ...globals.node,
+      },
+
+      parser: babelParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        requireConfigFile: false,
+
+        ecmaFeatures: {
+          experimentalDecorators: true,
+          modules: true,
+        },
+      },
+    },
+
+    settings: {
+      react: {
+        version: "detect",
+      },
+    },
+
+    rules: {
+      "no-undef": "off",
+      "no-unused-expressions": "off",
+      "no-unused-vars": "off",
+      "no-unused-labels": "off",
+      "no-console": "off",
+      curly: ["error", "all"],
+      "new-cap": "off",
+      "require-jsdoc": "off",
+      camelcase: "off",
+      "no-invalid-this": "off",
+
+      "max-len": [
+        "warn",
+        {
+          code: 64,
+        },
+      ],
+
+      semi: ["error", "never"],
+
+      quotes: [
+        "error",
+        "double",
+        {
+          allowTemplateLiterals: true,
+        },
+      ],
+
+      "comma-dangle": [
+        "error",
+        {
+          arrays: "always-multiline",
+          objects: "always-multiline",
+          imports: "always-multiline",
+          exports: "always-multiline",
+          functions: "never",
+        },
+      ],
+
+      "object-curly-spacing": ["error", "always"],
+      "arrow-parens": ["error", "always"],
+      "linebreak-style": 0,
+
+      "no-confusing-arrow": [
+        "error",
+        {
+          allowParens: false,
+        },
+      ],
+
+      "space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "space-infix-ops": "off",
+      "eol-last": ["error", "always"],
+      "react/prop-types": "off",
+      "react/jsx-no-undef": "off",
+    },
+  },
+  {
+    files: ["**/*.md", "**/*.mdx"],
+    processor: "markdown/markdown",
+  },
+  {
+    files: ["**/*.md/*.js", "**/*.mdx/*.js", "**/*.md/*.jsx", "**/*.mdx/*.jsx"],
+  },
+  ...compat.extends("plugin:@typescript-eslint/recommended").map((config) => ({
+    ...config,
+    files: ["**/*.md/*.ts", "**/*.mdx/*.ts", "**/*.md/*.tsx", "**/*.mdx/*.tsx"],
+  })),
+  {
+    files: ["**/*.md/*.ts", "**/*.mdx/*.ts", "**/*.md/*.tsx", "**/*.mdx/*.tsx"],
+
+    plugins: {
+      "@typescript-eslint": typescriptEslintEslintPlugin,
+    },
+
+    languageOptions: {
+      parser: tsParser,
+    },
+
+    rules: {
+      "@typescript-eslint/no-unused-vars": "off",
+      "@typescript-eslint/no-empty-function": "off",
+      "@typescript-eslint/no-explicit-any": "off",
+      "@typescript-eslint/no-non-null-assertion": "off",
+      "@typescript-eslint/no-var-requires": "off",
+      "prefer-rest-params": "off",
+      "@typescript-eslint/ban-ts-comment": "off",
+      "@typescript-eslint/no-non-null-asserted-optional-chain": "off",
+      "@typescript-eslint/ban-types": "off",
+    },
+  },
+]

www/apps/book/.content.eslintrc.js

@@ -1,6 +0,0 @@
-module.exports = {
-  root: true,
-  extends: [
-    "docs/content"
-  ],
-}

www/apps/book/.eslintrc.js

@@ -1,14 +0,0 @@
-module.exports = {
-  root: true,
-  extends: [
-    "docs/next"
-  ],
-  settings: {
-    next: {
-      rootDir: ".",
-    },
-  },
-  ignorePatterns: [
-    "generated"
-  ]
-}

www/apps/book/app/not-found.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/ban-ts-comment */
 import { TightLayout } from "docs-ui"
 import Feedback from "../components/Feedback"
 import EditButton from "../components/EditButton"
@@ -15,6 +16,7 @@ const NotFoundPage = () => {
       editComponent={<EditButton />}
       ProvidersComponent={Providers}
     >
+      {/* @ts-ignore React v19 doesn't recognize MDX import as component */}
       <NotFoundContent />
     </TightLayout>
   )

www/apps/book/components/Homepage/TopSection/index.tsx

@@ -1,4 +1,3 @@
-/* eslint-disable @next/next/no-img-element */
 import clsx from "clsx"
 import { BookIcon, Card, IconHeadline, WindowPaintbrushIcon } from "docs-ui"
 import { basePathUrl } from "../../../utils/base-path-url"

www/apps/book/eslint.config.mjs

@@ -0,0 +1,207 @@
+import prettier from "eslint-plugin-prettier/recommended"
+import globals from "globals"
+import babelParser from "@babel/eslint-parser"
+import typescriptEslintEslintPlugin from "@typescript-eslint/eslint-plugin"
+import tsParser from "@typescript-eslint/parser"
+import path from "node:path"
+import { fileURLToPath } from "node:url"
+import js from "@eslint/js"
+import { FlatCompat } from "@eslint/eslintrc"
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all,
+})
+
+export default [
+  prettier,
+  {
+    ignores: ["**/eslint-config-docs", "**/.eslintrc.js", "**/dist"],
+  },
+  ...compat.extends(
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:react/jsx-runtime",
+    "plugin:react-hooks/recommended",
+    "plugin:@next/next/recommended"
+  ),
+  {
+    languageOptions: {
+      globals: {
+        ...globals.node,
+        ...globals.jest,
+        ...globals.browser,
+      },
+
+      parser: babelParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        requireConfigFile: false,
+
+        ecmaFeatures: {
+          experimentalDecorators: true,
+          jsx: true,
+          modules: true,
+        },
+
+        project: true,
+      },
+    },
+
+    settings: {
+      react: {
+        version: "detect",
+      },
+    },
+
+    rules: {
+      curly: ["error", "all"],
+      "new-cap": "off",
+      "require-jsdoc": "off",
+      "no-unused-expressions": "off",
+      "no-unused-vars": "off",
+      camelcase: "off",
+      "no-invalid-this": "off",
+
+      "max-len": [
+        "error",
+        {
+          code: 80,
+          ignoreStrings: true,
+          ignoreRegExpLiterals: true,
+          ignoreComments: true,
+          ignoreTrailingComments: true,
+          ignoreUrls: true,
+          ignoreTemplateLiterals: true,
+        },
+      ],
+
+      semi: ["error", "never"],
+
+      quotes: [
+        "error",
+        "double",
+        {
+          allowTemplateLiterals: true,
+        },
+      ],
+
+      "comma-dangle": [
+        "error",
+        {
+          arrays: "always-multiline",
+          objects: "always-multiline",
+          imports: "always-multiline",
+          exports: "always-multiline",
+          functions: "never",
+        },
+      ],
+
+      "object-curly-spacing": ["error", "always"],
+      "arrow-parens": ["error", "always"],
+      "linebreak-style": 0,
+
+      "no-confusing-arrow": [
+        "error",
+        {
+          allowParens: false,
+        },
+      ],
+
+      "space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "space-infix-ops": "error",
+      "eol-last": ["error", "always"],
+
+      "no-console": [
+        "error",
+        {
+          allow: ["error", "warn"],
+        },
+      ],
+
+      "react/prop-types": [
+        2,
+        {
+          ignore: ["className"],
+        },
+      ],
+    },
+  },
+  ...compat
+    .extends(
+      "plugin:@typescript-eslint/recommended",
+      "plugin:react/recommended"
+    )
+    .map((config) => ({
+      ...config,
+      files: ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"],
+    })),
+  {
+    files: ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"],
+
+    plugins: {
+      "@typescript-eslint": typescriptEslintEslintPlugin,
+    },
+
+    languageOptions: {
+      parser: tsParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        project: "./tsconfig.json",
+      },
+    },
+
+    settings: {
+      next: {
+        rootDir: ".",
+      },
+    },
+    ignores: [
+      "**/next.config.js",
+      "**/spec",
+      "**/node_modules",
+      "**/public",
+      "**/.eslintrc.js",
+    ],
+
+    rules: {
+      "react/react-in-jsx-scope": "off",
+      "@typescript-eslint/prefer-ts-expect-error": "off",
+      "valid-jsdoc": "off",
+
+      "@typescript-eslint/no-non-null-assertion": "off",
+      "@typescript-eslint/no-floating-promises": "error",
+      "@typescript-eslint/await-thenable": "error",
+      "@typescript-eslint/promise-function-async": "error",
+      "@/keyword-spacing": "error",
+
+      "@/space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "@/space-infix-ops": "error",
+      "@typescript-eslint/no-explicit-any": "warn",
+      "@typescript-eslint/no-unused-vars": "warn",
+    },
+  },
+]

www/apps/book/package.json

@@ -10,33 +10,33 @@
     "start": "next start",
     "start:monorepo": "yarn start -p 3001",
     "lint": "next lint --fix",
-    "lint:content": "eslint --no-eslintrc -c .content.eslintrc.js app/**/*.mdx --fix",
+    "lint:content": "eslint --no-config-lookup -c .content.eslint.mjs app/**/*.mdx --fix",
     "prep": "node ./scripts/prepare.mjs"
   },
   "dependencies": {
-    "@mdx-js/loader": "^3.0.0",
+    "@mdx-js/loader": "^3.1.0",
-    "@mdx-js/react": "^3.0.0",
+    "@mdx-js/react": "^3.1.0",
     "@medusajs/icons": "^2.0.0",
-    "@next/mdx": "^14.2.14",
+    "@next/mdx": "15.0.1",
     "clsx": "^2.1.0",
     "docs-ui": "*",
-    "next": "14.2.14",
+    "next": "15.0.1",
-    "react": "^18.2.0",
+    "react": "rc",
-    "react-dom": "^18.2.0",
+    "react-dom": "rc",
     "rehype-mdx-code-props": "^2.0.0",
     "rehype-slug": "^6.0.0",
     "remark-rehype-plugins": "*"
   },
   "devDependencies": {
-    "@types/mdx": "^2.0.10",
+    "@types/mdx": "^2.0.13",
     "@types/node": "^20",
-    "@types/react": "^18.2.0",
+    "@types/react": "npm:types-react@rc",
-    "@types/react-dom": "^18.2.0",
+    "@types/react-dom": "npm:types-react@rc",
     "autoprefixer": "^10.0.1",
     "build-scripts": "*",
-    "eslint": "^8",
+    "eslint": "^9.13.0",
-    "eslint-config-docs": "*",
+    "eslint-plugin-prettier": "^5.2.1",
-    "eslint-config-next": "14.2.3",
+    "eslint-plugin-react-hooks": "^5.0.0",
     "postcss": "^8",
     "tailwind": "*",
     "tailwindcss": "^3.3.0",
@@ -46,5 +46,9 @@
   },
   "engines": {
     "node": ">=20"
+  },
+  "overrides": {
+    "@types/react": "npm:types-react@rc",
+    "@types/react-dom": "npm:types-react-dom@rc"
   }
 }

www/apps/resources/.content.eslintrc.js

@@ -1,6 +0,0 @@
-module.exports = {
-  root: true,
-  extends: [
-    "docs/content"
-  ],
-}

www/apps/resources/.content.eslintrc.mjs

@@ -0,0 +1,159 @@
+import prettier from "eslint-plugin-prettier"
+import markdown from "eslint-plugin-markdown"
+import globals from "globals"
+import babelParser from "@babel/eslint-parser"
+import typescriptEslintEslintPlugin from "@typescript-eslint/eslint-plugin"
+import tsParser from "@typescript-eslint/parser"
+import path from "node:path"
+import { fileURLToPath } from "node:url"
+import js from "@eslint/js"
+import { FlatCompat } from "@eslint/eslintrc"
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all,
+})
+
+export default [
+  {
+    ignores: [
+      "**/references/**/*",
+      "**/events-reference/**/*",
+      "**/_events-table/**/*",
+    ],
+  },
+  {
+    plugins: {
+      prettier,
+      markdown,
+    },
+
+    languageOptions: {
+      globals: {
+        ...globals.node,
+      },
+
+      parser: babelParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        requireConfigFile: false,
+
+        ecmaFeatures: {
+          experimentalDecorators: true,
+          modules: true,
+        },
+      },
+    },
+
+    settings: {
+      react: {
+        version: "detect",
+      },
+    },
+
+    rules: {
+      "no-undef": "off",
+      "no-unused-expressions": "off",
+      "no-unused-vars": "off",
+      "no-unused-labels": "off",
+      "no-console": "off",
+      curly: ["error", "all"],
+      "new-cap": "off",
+      "require-jsdoc": "off",
+      camelcase: "off",
+      "no-invalid-this": "off",
+
+      "max-len": [
+        "warn",
+        {
+          code: 64,
+        },
+      ],
+
+      semi: ["error", "never"],
+
+      quotes: [
+        "error",
+        "double",
+        {
+          allowTemplateLiterals: true,
+        },
+      ],
+
+      "comma-dangle": [
+        "error",
+        {
+          arrays: "always-multiline",
+          objects: "always-multiline",
+          imports: "always-multiline",
+          exports: "always-multiline",
+          functions: "never",
+        },
+      ],
+
+      "object-curly-spacing": ["error", "always"],
+      "arrow-parens": ["error", "always"],
+      "linebreak-style": 0,
+
+      "no-confusing-arrow": [
+        "error",
+        {
+          allowParens: false,
+        },
+      ],
+
+      "space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "space-infix-ops": "off",
+      "eol-last": ["error", "always"],
+      "react/prop-types": "off",
+      "react/jsx-no-undef": "off",
+    },
+  },
+  {
+    files: ["**/*.md", "**/*.mdx"],
+    processor: "markdown/markdown",
+  },
+  {
+    files: ["**/*.md/*.js", "**/*.mdx/*.js", "**/*.md/*.jsx", "**/*.mdx/*.jsx"],
+  },
+  ...compat.extends("plugin:@typescript-eslint/recommended").map((config) => ({
+    ...config,
+    files: ["**/*.md/*.ts", "**/*.mdx/*.ts", "**/*.md/*.tsx", "**/*.mdx/*.tsx"],
+  })),
+  {
+    files: ["**/*.md/*.ts", "**/*.mdx/*.ts", "**/*.md/*.tsx", "**/*.mdx/*.tsx"],
+
+    plugins: {
+      "@typescript-eslint": typescriptEslintEslintPlugin,
+    },
+
+    languageOptions: {
+      parser: tsParser,
+    },
+
+    rules: {
+      "@typescript-eslint/no-unused-vars": "off",
+      "@typescript-eslint/no-empty-function": "off",
+      "@typescript-eslint/no-explicit-any": "off",
+      "@typescript-eslint/no-non-null-assertion": "off",
+      "@typescript-eslint/no-var-requires": "off",
+      "prefer-rest-params": "off",
+      "@typescript-eslint/ban-ts-comment": "off",
+      "@typescript-eslint/no-non-null-asserted-optional-chain": "off",
+      "@typescript-eslint/ban-types": "off",
+    },
+  },
+]

www/apps/resources/.eslintrc.js

@@ -1,14 +0,0 @@
-module.exports = {
-  root: true,
-  extends: [
-    "docs/next"
-  ],
-  settings: {
-    next: {
-      rootDir: ".",
-    },
-  },
-  ignorePatterns: [
-    "generated"
-  ]
-}

www/apps/resources/app/admin-components/components/action-menu/page.mdx

@@ -20,7 +20,7 @@ To create a component that shows this menu in your customizations, create the fi
 import { 
   DropdownMenu,
   IconButton,
-  clx
+  clx,
 } from "@medusajs/ui"
 import { EllipsisHorizontal } from "@medusajs/icons"
 import { Link } from "react-router-dom"
@@ -202,10 +202,10 @@ const ProductWidget = () => {
               label: "Edit",
               onClick: () => {
                 alert("You clicked the edit action!")
-              }
+              },
-            }
+            },
-          ]
+          ],
-        }
+        },
       ]} />
     </Container>
   )
@@ -250,13 +250,13 @@ const ProductWidget = () => {
                       label: "Edit",
                       onClick: () => {
                         alert("You clicked the edit action!")
-                      }
+                      },
-                    }
+                    },
-                  ]
+                  ],
-                }
+                },
-              ]
+              ],
-            }
+            },
-          }
+          },
         ]}
       />
     </Container>

www/apps/resources/app/admin-components/components/container/page.mdx

@@ -17,7 +17,7 @@ To create a component that uses the same container styling in your widgets or UI
 ```tsx
 import { 
   Container as UiContainer,
-  clx
+  clx,
 } from "@medusajs/ui"
 
 type ContainerProps = React.ComponentProps<typeof UiContainer>

www/apps/resources/app/admin-components/components/forms/page.mdx

@@ -38,24 +38,24 @@ import {
   Heading,
   Label,
   Input,
-  Button
+  Button,
 } from "@medusajs/ui"
 import { 
   useForm, 
   FormProvider,
-  Controller
+  Controller,
 } from "react-hook-form"
 import * as zod from "zod"
 
 const schema = zod.object({
-  name: zod.string()
+  name: zod.string(),
 })
 
 export const CreateForm = () => {
   const form = useForm<zod.infer<typeof schema>>({
     defaultValues: {
-      name: ""
+      name: "",
-    }
+    },
   })
 
   const handleSubmit = form.handleSubmit(({ name }) => {
@@ -137,7 +137,7 @@ In `src/admin/components/create-form.tsx`, create a validation schema with Zod f
 import * as zod from "zod"
 
 const schema = zod.object({
-  name: zod.string()
+  name: zod.string(),
 })
 ```
 
@@ -158,8 +158,8 @@ import { useForm } from "react-hook-form"
 export const CreateForm = () => {
   const form = useForm<zod.infer<typeof schema>>({
     defaultValues: {
-      name: ""
+      name: "",
-    }
+    },
   })
 
   const handleSubmit = form.handleSubmit(({ name }) => {
@@ -190,11 +190,11 @@ import {
   Heading,
   Label,
   Input,
-  Button
+  Button,
 } from "@medusajs/ui"
 import { 
   FormProvider,
-  Controller
+  Controller,
 } from "react-hook-form"
 
 export const CreateForm = () => {
@@ -290,8 +290,8 @@ const ProductWidget = () => {
         actions={[
           {
             type: "custom",
-            children: <CreateForm />
+            children: <CreateForm />,
-          }
+          },
         ]}
       />
     </Container>
@@ -323,24 +323,24 @@ import {
   Heading,
   Label,
   Input,
-  Button
+  Button,
 } from "@medusajs/ui"
 import { 
   useForm, 
   FormProvider,
-  Controller
+  Controller,
 } from "react-hook-form"
 import * as zod from "zod"
 
 const schema = zod.object({
-  name: zod.string()
+  name: zod.string(),
 })
 
 export const EditForm = () => {
   const form = useForm<zod.infer<typeof schema>>({
     defaultValues: {
-      name: ""
+      name: "",
-    }
+    },
   })
 
   const handleSubmit = form.handleSubmit(({ name }) => {
@@ -416,7 +416,7 @@ In `src/admin/components/edit-form.tsx`, create a validation schema with Zod for
 import * as zod from "zod"
 
 const schema = zod.object({
-  name: zod.string()
+  name: zod.string(),
 })
 ```
 
@@ -437,8 +437,8 @@ import { useForm } from "react-hook-form"
 export const EditForm = () => {
   const form = useForm<zod.infer<typeof schema>>({
     defaultValues: {
-      name: ""
+      name: "",
-    }
+    },
   })
 
   const handleSubmit = form.handleSubmit(({ name }) => {
@@ -469,11 +469,11 @@ import {
   Heading,
   Label,
   Input,
-  Button
+  Button,
 } from "@medusajs/ui"
 import { 
   FormProvider,
-  Controller
+  Controller,
 } from "react-hook-form"
 
 export const EditForm = () => {
@@ -563,8 +563,8 @@ const ProductWidget = () => {
         actions={[
           {
             type: "custom",
-            children: <EditForm />
+            children: <EditForm />,
-          }
+          },
         ]}
       />
     </Container>

www/apps/resources/app/admin-components/components/header/page.mdx

@@ -45,7 +45,7 @@ export type HeadingProps = {
 export const Header = ({
   title,
   subtitle,
-  actions = []
+  actions = [],
 }: HeadingProps) => {
   return (
     <div className="flex items-center justify-between px-6 py-4">
@@ -172,9 +172,9 @@ const ProductWidget = () => {
               variant: "secondary",
               onClick: () => {
                 alert("You clicked the button.")
-              }
+              },
-            }
+            },
-          }
+          },
         ]}
       />
     </Container>

www/apps/resources/app/admin-components/components/json-view-section/page.mdx

@@ -222,7 +222,7 @@ import { JsonViewSection } from "../components/json-view-section"
 
 const ProductWidget = () => {
   return <JsonViewSection data={{
-    name: "John"
+    name: "John",
   }} />
 }
 

www/apps/resources/app/admin-components/components/table/page.mdx

@@ -39,7 +39,7 @@ export const Table = ({
   pageSize,
   count,
   currentPage,
-  setCurrentPage
+  setCurrentPage,
 }: TableProps) => {
   const pageCount = useMemo(() => {
     return Math.ceil(data.length / pageSize)
@@ -200,7 +200,7 @@ const ProductWidget = () => {
         columns={[
           {
             key: "name",
-            label: "Name"
+            label: "Name",
           },
           {
             key: "is_enabled",
@@ -213,18 +213,18 @@ const ProductWidget = () => {
                   {isEnabled ? "Enabled" : "Disabled"}
                 </StatusBadge>
               )
-            }
+            },
-          }
+          },
         ]}
         data={[
           {
             name: "John",
-            is_enabled: true
+            is_enabled: true,
           },
           {
             name: "Jane",
-            is_enabled: false
+            is_enabled: false,
-          }
+          },
         ]}
         pageSize={2}
         count={2}

www/apps/resources/app/admin-components/layouts/two-column/page.mdx

@@ -28,7 +28,7 @@ export type TwoColumnLayoutProps = {
 
 export const TwoColumnLayout = ({ 
   firstCol,
-  secondCol
+  secondCol,
 }: TwoColumnLayoutProps) => {
   return (
     <div className="flex flex-col gap-x-4 gap-y-3 xl:flex-row xl:items-start">

www/apps/resources/app/architectural-modules/cache/create/page.mdx

@@ -167,6 +167,6 @@ module.exports = defineConfig({
         ttl: 30,
       },
     },
-  ]
+  ],
 })
 ```

www/apps/resources/app/architectural-modules/cache/in-memory/page.mdx

@@ -37,7 +37,7 @@ module.exports = defineConfig({
         // optional options
       },
     },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/architectural-modules/cache/redis/page.mdx

@@ -39,7 +39,7 @@ module.exports = defineConfig({
         redisUrl: process.env.CACHE_REDIS_URL,
       },
     },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/architectural-modules/event/create/page.mdx

@@ -249,6 +249,6 @@ module.exports = defineConfig({
         // any options
       },
     },
-  ]
+  ],
 })
 ```

www/apps/resources/app/architectural-modules/event/local/page.mdx

@@ -31,9 +31,9 @@ module.exports = defineConfig({
   // ...
   modules: [
     {
-      resolve: "@medusajs/medusa/event-bus-local"
+      resolve: "@medusajs/medusa/event-bus-local",
-    }
+    },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/architectural-modules/event/redis/page.mdx

@@ -42,8 +42,8 @@ module.exports = defineConfig({
       options: { 
         redisUrl: process.env.EVENTS_REDIS_URL,
       },
-    }
+    },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/architectural-modules/file/local/page.mdx

@@ -54,7 +54,7 @@ module.exports = {
         ],
       },
     },
-  ]
+  ],
 }
 ```
 

www/apps/resources/app/architectural-modules/file/s3/page.mdx

@@ -141,7 +141,7 @@ module.exports = {
         ],
       },
     },
-  ]
+  ],
 }
 ```
 
@@ -370,7 +370,7 @@ module.exports = defineConfig({
         ],
       },
     },
-  ]
+  ],
 })
 ```
 ---

www/apps/resources/app/architectural-modules/notification/local/page.mdx

@@ -49,7 +49,7 @@ module.exports = defineConfig({
         ],
       },
     },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/architectural-modules/notification/page.mdx

@@ -54,7 +54,7 @@ module.exports = {
         ],
       },
     },
-  ]
+  ],
 }
 ```
 

www/apps/resources/app/architectural-modules/notification/sendgrid/page.mdx

@@ -62,7 +62,7 @@ module.exports = defineConfig({
         ],
       },
     },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/architectural-modules/workflow-engine/in-memory/page.mdx

@@ -33,8 +33,8 @@ module.exports = defineConfig({
   // ...
   modules: [
     {
-      resolve: "@medusajs/medusa/workflow-engine-inmemory"
+      resolve: "@medusajs/medusa/workflow-engine-inmemory",
-    }
+    },
   ],
 })
 ```

www/apps/resources/app/architectural-modules/workflow-engine/redis/page.mdx

@@ -41,7 +41,7 @@ module.exports = defineConfig({
         },
       },
     },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/commerce-modules/auth/module-options/page.mdx

@@ -48,7 +48,7 @@ module.exports = defineConfig({
         ],
       },
     },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/commerce-modules/customer/examples/page.mdx

@@ -195,7 +195,7 @@ export async function POST(request: MedusaRequest, res: MedusaResponse) {
 ```ts
 import { NextResponse } from "next/server"
 
-// eslint-disable-next-line prettier/prettier
+ 
 import { initialize as initializeCustomerModule } from "@medusajs/medusa/customer"
 
 export async function POST(request: Request) {

www/apps/resources/app/commerce-modules/fulfillment/module-options/page.mdx

@@ -42,7 +42,7 @@ module.exports = defineConfig({
         ],
       },
     },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/commerce-modules/payment/module-options/page.mdx

@@ -125,7 +125,7 @@ module.exports = defineConfig({
         ],
       },
     },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/commerce-modules/payment/payment-flow/page.mdx

@@ -44,7 +44,7 @@ Then, create a link between the payment collection and the resource it's storing
 ```ts
 import { 
   ContainerRegistrationKeys,
-  Modules
+  Modules,
 } from "@medusajs/framework/utils"
 
 // ...
@@ -56,11 +56,11 @@ const remoteLink = container.resolve(
 
 remoteLink.create({
   [Modules.CART]: {
-    cart_id: "cart_123"
+    cart_id: "cart_123",
   },
   [Modules.PAYMENT]: {
-    payment_collection_id: paymentCollection.id
+    payment_collection_id: paymentCollection.id,
-  }
+  },
 })
 ```
 

www/apps/resources/app/commerce-modules/payment/payment-provider/stripe/page.mdx

@@ -53,7 +53,7 @@ module.exports = defineConfig({
         ],
       },
     },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/commerce-modules/product/extend/page.mdx

@@ -68,13 +68,13 @@ Learn more about module links in [this guide](!docs!/module-links).
 Create the file `src/links/product-custom.ts` with the following content:
 
 ```ts title="src/links/product-custom.ts"
-import { defineLink } from "@medusajs/framework/utils";
+import { defineLink } from "@medusajs/framework/utils"
 import HelloModule from "../modules/hello"
 import ProductModule from "@medusajs/medusa/product"
 
 export default defineLink(
   ProductModule.linkable.product,
-  HelloModule.linkable.custom,
+  HelloModule.linkable.custom
 )
 ```
 
@@ -234,29 +234,29 @@ export const createCustomFromProductWorkflow = createWorkflow(
   (input: CreateCustomFromProductWorkflowInput) => {
     const customName = transform(
       {
-        input
+        input,
       },
       (data) => data.input.additional_data.custom_name || ""
     )
 
     const custom = createCustomStep({
-      custom_name: customName
+      custom_name: customName,
     })
 
     when(({ custom }), ({ custom }) => custom !== undefined)
       .then(() => {
         createRemoteLinkStep([{
           [Modules.PRODUCT]: {
-            product_id: input.product.id
+            product_id: input.product.id,
           },
           [HELLO_MODULE]: {
-            custom_id: custom.id
+            custom_id: custom.id,
-          }
+          },
         }])
       })
 
     return new WorkflowResponse({
-      custom
+      custom,
     })
   }
 )
@@ -282,19 +282,19 @@ To consume the hook, create the file `src/workflow/hooks/product-created.ts` wit
 import { createProductsWorkflow } from "@medusajs/medusa/core-flows"
 import { 
   createCustomFromProductWorkflow, 
-  CreateCustomFromProductWorkflowInput
+  CreateCustomFromProductWorkflowInput,
 } from "../create-custom-from-product"
 
 createProductsWorkflow.hooks.productsCreated(
 	async ({ products, additional_data }, { container }) => {
     const workflow = createCustomFromProductWorkflow(container)
     
-    for (let product of products) {
+    for (const product of products) {
       await workflow.run({
         input: {
           product,
-          additional_data
+          additional_data,
-        } as CreateCustomFromProductWorkflowInput
+        } as CreateCustomFromProductWorkflowInput,
       })
     }
 	}
@@ -556,16 +556,16 @@ const created = when({
 )
 .then(() => {
   const custom = createCustomStep({
-    custom_name: input.additional_data.custom_name
+    custom_name: input.additional_data.custom_name,
   })
 
   createRemoteLinkStep([{
     [Modules.PRODUCT]: {
-      product_id: input.product.id
+      product_id: input.product.id,
     },
     [HELLO_MODULE]: {
-      custom_id: custom.id
+      custom_id: custom.id,
-    }
+    },
   }])
 
   return custom
@@ -628,7 +628,7 @@ const updated = when({
 return new WorkflowResponse({
   created,
   updated,
-  deleted
+  deleted,
 })
 ```
 
@@ -646,19 +646,19 @@ Create the file `src/workflows/hooks/product-updated.ts` with the following cont
 import { updateProductsWorkflow } from "@medusajs/medusa/core-flows"
 import { 
   UpdateCustomFromProductStepInput, 
-  updateCustomFromProductWorkflow
+  updateCustomFromProductWorkflow,
 } from "../update-custom-from-product"
 
 updateProductsWorkflow.hooks.productsUpdated(
 	async ({ products, additional_data }, { container }) => {
     const workflow = updateCustomFromProductWorkflow(container)
     
-    for (let product of products) {
+    for (const product of products) {
       await workflow.run({
         input: {
           product,
-          additional_data
+          additional_data,
-        } as UpdateCustomFromProductStepInput
+        } as UpdateCustomFromProductStepInput,
       })
     }
 	}

www/apps/resources/app/commerce-modules/promotion/extend/page.mdx

@@ -68,13 +68,13 @@ Learn more about module links in [this guide](!docs!/module-links).
 Create the file `src/links/promotion-custom.ts` with the following content:
 
 ```ts title="src/links/promotion-custom.ts"
-import { defineLink } from "@medusajs/framework/utils";
+import { defineLink } from "@medusajs/framework/utils"
 import HelloModule from "../modules/hello"
 import PromotionModule from "@medusajs/medusa/promotion"
 
 export default defineLink(
   PromotionModule.linkable.promotion,
-  HelloModule.linkable.custom,
+  HelloModule.linkable.custom
 )
 ```
 
@@ -234,29 +234,29 @@ export const createCustomFromPromotionWorkflow = createWorkflow(
   (input: CreateCustomFromPromotionWorkflowInput) => {
     const customName = transform(
       {
-        input
+        input,
       },
       (data) => data.input.additional_data.custom_name || ""
     )
 
     const custom = createCustomStep({
-      custom_name: customName
+      custom_name: customName,
     })
 
     when(({ custom }), ({ custom }) => custom !== undefined)
       .then(() => {
         createRemoteLinkStep([{
           [Modules.PROMOTION]: {
-            promotion_id: input.promotion.id
+            promotion_id: input.promotion.id,
           },
           [HELLO_MODULE]: {
-            custom_id: custom.id
+            custom_id: custom.id,
-          }
+          },
         }])
       })
 
     return new WorkflowResponse({
-      custom
+      custom,
     })
   }
 )
@@ -282,19 +282,19 @@ To consume the hook, create the file `src/workflow/hooks/promotion-created.ts` w
 import { createPromotionsWorkflow } from "@medusajs/medusa/core-flows"
 import { 
   createCustomFromPromotionWorkflow, 
-  CreateCustomFromPromotionWorkflowInput
+  CreateCustomFromPromotionWorkflowInput,
 } from "../create-custom-from-promotion"
 
 createPromotionsWorkflow.hooks.promotionsCreated(
 	async ({ promotions, additional_data }, { container }) => {
     const workflow = createCustomFromPromotionWorkflow(container)
     
-    for (let promotion of promotions) {
+    for (const promotion of promotions) {
       await workflow.run({
         input: {
           promotion,
-          additional_data
+          additional_data,
-        } as CreateCustomFromPromotionWorkflowInput
+        } as CreateCustomFromPromotionWorkflowInput,
       })
     }
 	}
@@ -562,16 +562,16 @@ const created = when({
 )
 .then(() => {
   const custom = createCustomStep({
-    custom_name: input.additional_data.custom_name
+    custom_name: input.additional_data.custom_name,
   })
 
   createRemoteLinkStep([{
     [Modules.PROMOTION]: {
-      promotion_id: input.promotion.id
+      promotion_id: input.promotion.id,
     },
     [HELLO_MODULE]: {
-      custom_id: custom.id
+      custom_id: custom.id,
-    }
+    },
   }])
 
   return custom
@@ -634,7 +634,7 @@ const updated = when({
 return new WorkflowResponse({
   created,
   updated,
-  deleted
+  deleted,
 })
 ```
 
@@ -652,19 +652,19 @@ Create the file `src/workflows/hooks/promotion-updated.ts` with the following co
 import { updatePromotionsWorkflow } from "@medusajs/medusa/core-flows"
 import { 
   UpdateCustomFromPromotionStepInput, 
-  updateCustomFromPromotionWorkflow
+  updateCustomFromPromotionWorkflow,
 } from "../update-custom-from-promotion"
 
 updatePromotionsWorkflow.hooks.promotionsUpdated(
 	async ({ promotions, additional_data }, { container }) => {
     const workflow = updateCustomFromPromotionWorkflow(container)
     
-    for (let promotion of promotions) {
+    for (const promotion of promotions) {
       await workflow.run({
         input: {
           promotion,
-          additional_data
+          additional_data,
-        } as UpdateCustomFromPromotionStepInput
+        } as UpdateCustomFromPromotionStepInput,
       })
     }
 	}

www/apps/resources/app/commerce-modules/tax/module-options/page.mdx

@@ -40,7 +40,7 @@ module.exports = defineConfig({
         ],
       },
     },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/commerce-modules/user/module-options/page.mdx

@@ -28,7 +28,7 @@ module.exports = defineConfig({
         jwt_secret: process.env.JWT_SECRET,
       },
     },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/deployment/medusa-application/railway/page.mdx

@@ -158,7 +158,7 @@ module.exports = defineConfig({
         },
       },
     },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/examples/page.mdx

@@ -454,7 +454,7 @@ export default defineMiddlewares({
         authenticate(
           "user", 
           ["session", "bearer", "api-key"]
-        )
+        ),
       ],
     },
   ],
@@ -480,7 +480,7 @@ export default defineMiddlewares({
     {
       matcher: "/custom/customer*",
       middlewares: [
-        authenticate("customer", ["session", "bearer"])
+        authenticate("customer", ["session", "bearer"]),
       ],
     },
   ],
@@ -676,8 +676,8 @@ export default defineMiddlewares({
       matcher: "/webhooks/*",
       bodyParser: { preserveRawBody: true },
       method: ["POST"],
-    }
+    },
-  ]
+  ],
 })
 ```
 
@@ -762,8 +762,8 @@ module.exports = defineConfig({
   modules: [
     {
       resolve: "./modules/hello",
-    }
+    },
-  ]
+  ],
 })
 ```
 
@@ -790,11 +790,11 @@ export async function GET(
   )
 
   const my_custom = await helloModuleService.createMyCustoms({
-    name: "test"
+    name: "test",
   })
 
   res.json({
-    my_custom
+    my_custom,
   })
 }
 ```
@@ -863,7 +863,7 @@ module.exports = defineConfig({
         apiKey: true,
       },
     },
-  ]
+  ],
 })
 ```
 
@@ -2043,7 +2043,7 @@ export const GET = async (
     my_customs: myCustoms,
     count,
     take,
-    skip
+    skip,
   })
 }
 ```
@@ -2915,7 +2915,7 @@ import {
   LoaderOptions,
 } from "@medusajs/framework/types"
 import { 
-  ContainerRegistrationKeys
+  ContainerRegistrationKeys,
 } from "@medusajs/framework/utils"
 
 export default async function helloWorldLoader({
@@ -2972,7 +2972,7 @@ export default async function helloWorldLoader({
   container.registerAdd(
     "custom_data",
     asValue({
-      test: true
+      test: true,
     })
   )
 }
@@ -3690,7 +3690,7 @@ To accept payment using the Payment Module's main service:
 ```ts
 import { 
   ContainerRegistrationKeys,
-  Modules
+  Modules,
 } from "@medusajs/framework/utils"
 
 // ...
@@ -3710,11 +3710,11 @@ const remoteLink = container.resolve(
 // create a link between the cart and payment collection
 remoteLink.create({
   [Modules.CART]: {
-    cart_id: "cart_123"
+    cart_id: "cart_123",
   },
   [Modules.PAYMENT]: {
-    payment_collection_id: paymentCollection.id
+    payment_collection_id: paymentCollection.id,
-  }
+  },
 })
 ```
 
@@ -3814,7 +3814,7 @@ import {
 } from "@medusajs/framework/types"
 import { 
   QueryContext,
-  calculateAmountsWithTax
+  calculateAmountsWithTax,
 } from "@medusajs/framework/utils"
 // other imports...
 

www/apps/resources/app/js-sdk/page.mdx

@@ -296,7 +296,7 @@ import { DetailWidgetProps, HttpTypes } from "@medusajs/framework/types"
 const ProductWidget = () => {
   const { data, isLoading } = useQuery({
     queryFn: () => sdk.admin.product.list(),
-    queryKey: ["products"]
+    queryKey: ["products"],
   })
   
   return (
@@ -331,17 +331,17 @@ import { sdk } from "../lib/config"
 import { DetailWidgetProps, HttpTypes } from "@medusajs/framework/types"
 
 const ProductWidget = ({ 
-  data: productData
+  data: productData,
 }: DetailWidgetProps<HttpTypes.AdminProduct>) => {
   const { mutateAsync } = useMutation({
     mutationFn: (payload: HttpTypes.AdminUpdateProduct) => 
       sdk.admin.product.update(productData.id, payload),
-    onSuccess: () => alert("updated product")
+    onSuccess: () => alert("updated product"),
   })
 
   const handleUpdate = () => {
     mutateAsync({
-      title: "New Product Title"
+      title: "New Product Title",
     })
   }
   
@@ -375,8 +375,8 @@ For example:
 ```ts highlights={[["2", "next"], ["3", "tags", "An array of tags to cache the data under."]]}
 sdk.store.product.list({}, {
   next: {
-    tags: ["products"]
+    tags: ["products"],
-  }
+  },
 })
 ```
 
@@ -385,7 +385,7 @@ The `tags` property accepts an array of tags that the data is cached under.
 Then, to purge the cache later, use Next.js's `revalidateTag` utility:
 
 ```ts
-import { revalidateTag } from "next/cache";
+import { revalidateTag } from "next/cache"
 
 // ...
 

www/apps/resources/app/recipes/commerce-automation/page.mdx

@@ -159,7 +159,7 @@ export const restockModelHighlights = [
       {
         resolve: "./src/modules/restock-notification",
       },
-    ]
+    ],
   })
   ```
 

www/apps/resources/app/recipes/digital-products/examples/standard/page.mdx

@@ -202,7 +202,7 @@ module.exports = defineConfig({
     {
       resolve: "./src/modules/digital-product",
     },
-  ]
+  ],
 })
 ```
 
@@ -1545,7 +1545,7 @@ module.exports = defineConfig({
         ],
       },
     },
-  ]
+  ],
 })
 ```
 
@@ -2043,7 +2043,7 @@ module.exports = defineConfig({
         ],
       },
     },
-  ]
+  ],
 })
 
 ```

www/apps/resources/app/recipes/integrate-ecommerce-stack/page.mdx

@@ -128,7 +128,7 @@ export const serviceHighlights = [
           apiKey: process.env.ERP_API_KEY,
         },
       },
-    ]
+    ],
   })
   ```
 

www/apps/resources/app/recipes/marketplace/examples/restaurant-delivery/page.mdx

@@ -168,7 +168,7 @@ module.exports = defineConfig({
     {
       resolve: "./src/modules/restaurant",
     },
-  ]
+  ],
 })
 ```
 
@@ -312,7 +312,7 @@ module.exports = defineConfig({
     {
       resolve: "./src/modules/delivery",
     },
-  ]
+  ],
 })
 
 ```

www/apps/resources/app/recipes/marketplace/examples/vendors/page.mdx

@@ -148,7 +148,7 @@ module.exports = defineConfig({
     {
       resolve: "./src/modules/marketplace",
     },
-  ]
+  ],
 })
 ```
 
@@ -1151,7 +1151,7 @@ import {
   useQueryGraphStep,
   createRemoteLinkStep,
   completeCartWorkflow,
-  getOrderDetailWorkflow
+  getOrderDetailWorkflow,
 } from "@medusajs/medusa/core-flows"
 import groupVendorItemsStep from "./steps/group-vendor-items"
 import createVendorOrdersStep from "./steps/create-vendor-orders"
@@ -1194,8 +1194,8 @@ const createVendorOrdersWorkflow = createWorkflow(
           "shipping_address.*",
           "billing_address.*",
           "shipping_methods.*",
-        ]
+        ],
-      }
+      },
     })
 
     const { 

www/apps/resources/app/recipes/subscriptions/examples/standard/page.mdx

@@ -166,7 +166,7 @@ module.exports = defineConfig({
     {
       resolve: "./src/modules/subscription",
     },
-  ]
+  ],
 })
 ```
 

www/apps/resources/app/references/[...slug]/page.tsx

@@ -14,12 +14,13 @@ import { slugChanges } from "../../../generated/slug-changes.mjs"
 import { filesMap } from "../../../generated/files-map.mjs"
 
 type PageProps = {
-  params: {
+  params: Promise<{
     slug: string[]
-  }
+  }>
 }
 
-export default async function ReferencesPage({ params }: PageProps) {
+export default async function ReferencesPage(props: PageProps) {
+  const params = await props.params
   const { slug } = params
 
   // ensure that Vercel loads references files

www/apps/resources/eslint.config.mjs

@@ -0,0 +1,207 @@
+import prettier from "eslint-plugin-prettier/recommended"
+import globals from "globals"
+import babelParser from "@babel/eslint-parser"
+import typescriptEslintEslintPlugin from "@typescript-eslint/eslint-plugin"
+import tsParser from "@typescript-eslint/parser"
+import path from "node:path"
+import { fileURLToPath } from "node:url"
+import js from "@eslint/js"
+import { FlatCompat } from "@eslint/eslintrc"
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all,
+})
+
+export default [
+  prettier,
+  {
+    ignores: ["**/eslint-config-docs", "**/.eslintrc.js", "**/dist"],
+  },
+  ...compat.extends(
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:react/jsx-runtime",
+    "plugin:react-hooks/recommended",
+    "plugin:@next/next/recommended"
+  ),
+  {
+    languageOptions: {
+      globals: {
+        ...globals.node,
+        ...globals.jest,
+        ...globals.browser,
+      },
+
+      parser: babelParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        requireConfigFile: false,
+
+        ecmaFeatures: {
+          experimentalDecorators: true,
+          jsx: true,
+          modules: true,
+        },
+
+        project: true,
+      },
+    },
+
+    settings: {
+      react: {
+        version: "detect",
+      },
+    },
+
+    rules: {
+      curly: ["error", "all"],
+      "new-cap": "off",
+      "require-jsdoc": "off",
+      "no-unused-expressions": "off",
+      "no-unused-vars": "off",
+      camelcase: "off",
+      "no-invalid-this": "off",
+
+      "max-len": [
+        "error",
+        {
+          code: 80,
+          ignoreStrings: true,
+          ignoreRegExpLiterals: true,
+          ignoreComments: true,
+          ignoreTrailingComments: true,
+          ignoreUrls: true,
+          ignoreTemplateLiterals: true,
+        },
+      ],
+
+      semi: ["error", "never"],
+
+      quotes: [
+        "error",
+        "double",
+        {
+          allowTemplateLiterals: true,
+        },
+      ],
+
+      "comma-dangle": [
+        "error",
+        {
+          arrays: "always-multiline",
+          objects: "always-multiline",
+          imports: "always-multiline",
+          exports: "always-multiline",
+          functions: "never",
+        },
+      ],
+
+      "object-curly-spacing": ["error", "always"],
+      "arrow-parens": ["error", "always"],
+      "linebreak-style": 0,
+
+      "no-confusing-arrow": [
+        "error",
+        {
+          allowParens: false,
+        },
+      ],
+
+      "space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "space-infix-ops": "error",
+      "eol-last": ["error", "always"],
+
+      "no-console": [
+        "error",
+        {
+          allow: ["error", "warn"],
+        },
+      ],
+
+      "react/prop-types": [
+        2,
+        {
+          ignore: ["className"],
+        },
+      ],
+    },
+  },
+  ...compat
+    .extends(
+      "plugin:@typescript-eslint/recommended",
+      "plugin:react/recommended"
+    )
+    .map((config) => ({
+      ...config,
+      files: ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"],
+    })),
+  {
+    files: ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"],
+
+    plugins: {
+      "@typescript-eslint": typescriptEslintEslintPlugin,
+    },
+
+    languageOptions: {
+      parser: tsParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        project: "./tsconfig.json",
+      },
+    },
+
+    settings: {
+      next: {
+        rootDir: ".",
+      },
+    },
+    ignores: [
+      "**/next.config.js",
+      "**/spec",
+      "**/node_modules",
+      "**/public",
+      "**/.eslintrc.js",
+    ],
+
+    rules: {
+      "react/react-in-jsx-scope": "off",
+      "@typescript-eslint/prefer-ts-expect-error": "off",
+      "valid-jsdoc": "off",
+
+      "@typescript-eslint/no-non-null-assertion": "off",
+      "@typescript-eslint/no-floating-promises": "error",
+      "@typescript-eslint/await-thenable": "error",
+      "@typescript-eslint/promise-function-async": "error",
+      "@/keyword-spacing": "error",
+
+      "@/space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "@/space-infix-ops": "error",
+      "@typescript-eslint/no-explicit-any": "warn",
+      "@typescript-eslint/no-unused-vars": "warn",
+    },
+  },
+]

www/apps/resources/package.json

@@ -9,33 +9,33 @@
     "start": "next start",
     "start:monorepo": "yarn start -p 3003",
     "lint": "next lint --fix",
-    "lint:content": "eslint --no-eslintrc -c .content.eslintrc.js app/**/*.mdx --fix",
+    "lint:content": "eslint --no-config-lookup -c .content.eslintrc.mjs app/**/*.mdx --fix",
     "prep": "node ./scripts/prepare.mjs"
   },
   "dependencies": {
-    "@mdx-js/loader": "^3.0.1",
+    "@mdx-js/loader": "^3.1.0",
-    "@mdx-js/react": "^3.0.1",
+    "@mdx-js/react": "^3.1.0",
     "@medusajs/icons": "^2.0.0",
-    "@next/mdx": "^14.2.14",
+    "@next/mdx": "15.0.1",
     "clsx": "^2.1.0",
     "docs-ui": "*",
-    "next": "14.2.14",
+    "next": "15.0.1",
-    "react": "^18.2.0",
+    "react": "rc",
-    "react-dom": "^18.2.0",
+    "react-dom": "rc",
     "rehype-mdx-code-props": "^2.0.0",
     "remark-directive": "^3.0.0",
     "remark-frontmatter": "^5.0.0"
   },
   "devDependencies": {
-    "@types/mdx": "^2.0.11",
+    "@types/mdx": "^2.0.13",
     "@types/node": "^20",
-    "@types/react": "^18.2.0",
+    "@types/react": "npm:types-react@rc",
-    "@types/react-dom": "^18.2.0",
+    "@types/react-dom": "npm:types-react@rc",
     "autoprefixer": "^10.0.1",
     "build-scripts": "*",
-    "eslint": "^8",
+    "eslint": "^9.13.0",
-    "eslint-config-docs": "*",
+    "eslint-plugin-prettier": "^5.2.1",
-    "eslint-config-next": "14.2.3",
+    "eslint-plugin-react-hooks": "^5.0.0",
     "postcss": "^8",
     "remark-rehype-plugins": "*",
     "tailwind": "*",
@@ -47,5 +47,9 @@
   },
   "engines": {
     "node": ">=20"
+  },
+  "overrides": {
+    "@types/react": "npm:types-react@rc",
+    "@types/react-dom": "npm:types-react-dom@rc"
   }
 }

www/apps/ui/.content.eslintrc.js

@@ -1,6 +0,0 @@
-module.exports = {
-  root: true,
-  extends: [
-    "docs/content"
-  ],
-}

www/apps/ui/.content.eslintrc.mjs

@@ -0,0 +1,160 @@
+import prettier from "eslint-plugin-prettier"
+import markdown from "eslint-plugin-markdown"
+import globals from "globals"
+import babelParser from "@babel/eslint-parser"
+import typescriptEslintEslintPlugin from "@typescript-eslint/eslint-plugin"
+import tsParser from "@typescript-eslint/parser"
+import path from "node:path"
+import { fileURLToPath } from "node:url"
+import js from "@eslint/js"
+import { FlatCompat } from "@eslint/eslintrc"
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all,
+})
+
+export default [
+  {
+    ignores: [
+      "**/references/**/*",
+      "**/events-reference/**/*",
+      "**/_events-table/**/*",
+    ],
+  },
+  {
+    plugins: {
+      prettier,
+      markdown,
+    },
+
+    languageOptions: {
+      globals: {
+        ...globals.node,
+      },
+
+      parser: babelParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        requireConfigFile: false,
+
+        ecmaFeatures: {
+          experimentalDecorators: true,
+          modules: true,
+        },
+      },
+    },
+
+    settings: {
+      react: {
+        version: "detect",
+      },
+    },
+
+    rules: {
+      "no-undef": "off",
+      "no-unused-expressions": "off",
+      "no-unused-vars": "off",
+      "no-unused-labels": "off",
+      "no-console": "off",
+      curly: ["error", "all"],
+      "new-cap": "off",
+      "require-jsdoc": "off",
+      camelcase: "off",
+      "no-invalid-this": "off",
+
+      "max-len": [
+        "warn",
+        {
+          code: 64,
+        },
+      ],
+
+      semi: ["error", "never"],
+
+      quotes: [
+        "error",
+        "double",
+        {
+          allowTemplateLiterals: true,
+        },
+      ],
+
+      "comma-dangle": [
+        "error",
+        {
+          arrays: "always-multiline",
+          objects: "always-multiline",
+          imports: "always-multiline",
+          exports: "always-multiline",
+          functions: "never",
+        },
+      ],
+
+      "object-curly-spacing": ["error", "always"],
+      "arrow-parens": ["error", "always"],
+      "linebreak-style": 0,
+
+      "no-confusing-arrow": [
+        "error",
+        {
+          allowParens: false,
+        },
+      ],
+
+      "space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "space-infix-ops": "off",
+      "eol-last": ["error", "always"],
+      "react/prop-types": "off",
+      "react/jsx-no-undef": "off",
+    },
+  },
+  {
+    files: ["**/*.md", "**/*.mdx"],
+    processor: "markdown/markdown",
+  },
+  {
+    files: ["**/*.md/*.js", "**/*.mdx/*.js", "**/*.md/*.jsx", "**/*.mdx/*.jsx"],
+  },
+  ...compat.extends("plugin:@typescript-eslint/recommended").map((config) => ({
+    ...config,
+    files: ["**/*.md/*.ts", "**/*.mdx/*.ts", "**/*.md/*.tsx", "**/*.mdx/*.tsx"],
+  })),
+  {
+    files: ["**/*.md/*.ts", "**/*.mdx/*.ts", "**/*.md/*.tsx", "**/*.mdx/*.tsx"],
+
+    plugins: {
+      "@typescript-eslint": typescriptEslintEslintPlugin,
+    },
+
+    languageOptions: {
+      parser: tsParser,
+    },
+
+    rules: {
+      "@typescript-eslint/no-unused-vars": "off",
+      "@typescript-eslint/no-empty-function": "off",
+      "@typescript-eslint/no-explicit-any": "off",
+      "@typescript-eslint/no-non-null-assertion": "off",
+      "@typescript-eslint/no-var-requires": "off",
+      "prefer-rest-params": "off",
+      "@typescript-eslint/ban-ts-comment": "off",
+      "@typescript-eslint/no-non-null-asserted-optional-chain": "off",
+      "@typescript-eslint/ban-types": "off",
+      "@typescript-eslint/no-require-imports": "warn",
+    },
+  },
+]

www/apps/ui/.eslintrc.js

@@ -1,15 +0,0 @@
-module.exports = {
-  root: true,
-  extends: [
-    "docs/next"
-  ],
-  overrides: [
-    {
-      files: ["src/examples/*.tsx"],
-      rules: {
-        "@typescript-eslint/no-empty-function": "off",
-        "no-console": "off"
-      }
-    }
-  ],
-}

www/apps/ui/eslint.config.mjs

@@ -0,0 +1,212 @@
+import prettier from "eslint-plugin-prettier/recommended"
+import globals from "globals"
+import babelParser from "@babel/eslint-parser"
+import typescriptEslintEslintPlugin from "@typescript-eslint/eslint-plugin"
+import tsParser from "@typescript-eslint/parser"
+import path from "node:path"
+import { fileURLToPath } from "node:url"
+import js from "@eslint/js"
+import { FlatCompat } from "@eslint/eslintrc"
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all,
+})
+
+export default [
+  prettier,
+  {
+    ignores: [
+      "**/eslint-config-docs",
+      "**/.eslintrc.js",
+      "**/dist",
+      "src/examples",
+    ],
+  },
+  ...compat.extends(
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:react/jsx-runtime",
+    "plugin:react-hooks/recommended",
+    "plugin:@next/next/recommended"
+  ),
+  {
+    languageOptions: {
+      globals: {
+        ...globals.node,
+        ...globals.jest,
+        ...globals.browser,
+      },
+
+      parser: babelParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        requireConfigFile: false,
+
+        ecmaFeatures: {
+          experimentalDecorators: true,
+          jsx: true,
+          modules: true,
+        },
+
+        project: true,
+      },
+    },
+
+    settings: {
+      react: {
+        version: "detect",
+      },
+    },
+
+    rules: {
+      curly: ["error", "all"],
+      "new-cap": "off",
+      "require-jsdoc": "off",
+      "no-unused-expressions": "off",
+      "no-unused-vars": "off",
+      camelcase: "off",
+      "no-invalid-this": "off",
+
+      "max-len": [
+        "error",
+        {
+          code: 80,
+          ignoreStrings: true,
+          ignoreRegExpLiterals: true,
+          ignoreComments: true,
+          ignoreTrailingComments: true,
+          ignoreUrls: true,
+          ignoreTemplateLiterals: true,
+        },
+      ],
+
+      semi: ["error", "never"],
+
+      quotes: [
+        "error",
+        "double",
+        {
+          allowTemplateLiterals: true,
+        },
+      ],
+
+      "comma-dangle": [
+        "error",
+        {
+          arrays: "always-multiline",
+          objects: "always-multiline",
+          imports: "always-multiline",
+          exports: "always-multiline",
+          functions: "never",
+        },
+      ],
+
+      "object-curly-spacing": ["error", "always"],
+      "arrow-parens": ["error", "always"],
+      "linebreak-style": 0,
+
+      "no-confusing-arrow": [
+        "error",
+        {
+          allowParens: false,
+        },
+      ],
+
+      "space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "space-infix-ops": "error",
+      "eol-last": ["error", "always"],
+
+      "no-console": [
+        "error",
+        {
+          allow: ["error", "warn"],
+        },
+      ],
+
+      "react/prop-types": [
+        2,
+        {
+          ignore: ["className"],
+        },
+      ],
+    },
+  },
+  ...compat
+    .extends(
+      "plugin:@typescript-eslint/recommended",
+      "plugin:react/recommended"
+    )
+    .map((config) => ({
+      ...config,
+      files: ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"],
+    })),
+  {
+    files: ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"],
+
+    plugins: {
+      "@typescript-eslint": typescriptEslintEslintPlugin,
+    },
+
+    languageOptions: {
+      parser: tsParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        project: "./tsconfig.json",
+      },
+    },
+
+    settings: {
+      next: {
+        rootDir: ".",
+      },
+    },
+    ignores: [
+      "**/next.config.js",
+      "**/spec",
+      "**/node_modules",
+      "**/public",
+      "**/.eslintrc.js",
+    ],
+
+    rules: {
+      "react/react-in-jsx-scope": "off",
+      "@typescript-eslint/prefer-ts-expect-error": "off",
+      "valid-jsdoc": "off",
+
+      "@typescript-eslint/no-non-null-assertion": "off",
+      "@typescript-eslint/no-floating-promises": "error",
+      "@typescript-eslint/await-thenable": "error",
+      "@typescript-eslint/promise-function-async": "error",
+      "@/keyword-spacing": "error",
+
+      "@/space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "@/space-infix-ops": "error",
+      "@typescript-eslint/no-explicit-any": "warn",
+      "@typescript-eslint/no-unused-vars": "warn",
+    },
+  },
+]

www/apps/ui/package.json

@@ -10,33 +10,26 @@
     "start:monorepo": "yarn start -p 3002",
     "lint": "next lint --fix",
     "copy-colors": "ts-node ./scripts/copy-colors.ts",
-    "lint:content": "eslint --no-eslintrc -c .content.eslintrc.js src/content/docs --fix"
+    "lint:content": "eslint --no-config-lookup -c .content.eslintrc.mjs src/content/docs --fix"
   },
   "dependencies": {
     "@faker-js/faker": "^8.0.2",
+    "@mdx-js/react": "^3.1.0",
     "@medusajs/icons": "^2.0.0",
     "@medusajs/ui": "^4.0.0",
     "@medusajs/ui-preset": "^1.1.3",
-    "@radix-ui/react-dialog": "1.0.4",
-    "@radix-ui/react-scroll-area": "^1.0.4",
-    "@radix-ui/react-tabs": "^1.0.4",
-    "@types/node": "20.4.9",
-    "@types/react": "^18.2.0",
-    "@types/react-dom": "^18.2.0",
     "autoprefixer": "10.4.14",
     "clsx": "^2.0.0",
     "contentlayer": "^0.3.4",
     "date-fns": "^3.3.1",
     "docs-ui": "*",
-    "eslint-config-docs": "*",
     "mdast-util-toc": "^7.0.0",
-    "next": "^14.2.14",
+    "next": "15.0.1",
     "next-contentlayer": "^0.3.4",
     "next-themes": "^0.2.1",
     "postcss": "8.4.27",
-    "react": "18.2.0",
+    "react": "rc",
-    "react-day-picker": "^8.10.0",
+    "react-dom": "rc",
-    "react-dom": "18.2.0",
     "rehype-slug": "^6.0.0",
     "remark": "^14.0.3",
     "tailwind": "*",
@@ -46,12 +39,21 @@
     "unist-util-visit": "4.1.2"
   },
   "devDependencies": {
-    "eslint": "^8.49.0",
+    "@types/node": "20.4.9",
-    "react-docgen": "^7.0.1",
+    "@types/react": "npm:types-react@rc",
+    "@types/react-dom": "npm:types-react@rc",
+    "eslint": "^9.13.0",
+    "eslint-plugin-prettier": "^5.2.1",
+    "eslint-plugin-react-hooks": "^5.0.0",
+    "react-docgen": "^7.1.0",
     "ts-node": "^10.9.1",
     "types": "*"
   },
   "engines": {
     "node": ">=20"
+  },
+  "overrides": {
+    "@types/react": "npm:types-react@rc",
+    "@types/react-dom": "npm:types-react-dom@rc"
   }
 }

www/apps/ui/src/app/(content)/[[...slug]]/page.tsx

@@ -7,27 +7,26 @@ import { siteConfig } from "@/config/site"
 import { Metadata } from "next"
 
 interface DocPageProps {
-  params: {
+  params: Promise<{
     slug: string[]
-  }
+  }>
 }
 
-async function getDocFromParams({ params }: DocPageProps) {
+async function getDocFromParams(props: DocPageProps) {
+  const params = await props.params
   const slug = params.slug?.join("/") || ""
 
   const doc = allDocs.find((doc) => doc.slugAsParams === slug)
 
   if (!doc) {
-    null
+    return
   }
 
   return doc
 }
 
-export async function generateMetadata({
+export async function generateMetadata(props: DocPageProps): Promise<Metadata> {
-  params,
+  const doc = await getDocFromParams(props)
-}: DocPageProps): Promise<Metadata> {
-  const doc = await getDocFromParams({ params })
 
   if (!doc) {
     return {}
@@ -44,16 +43,14 @@ export async function generateMetadata({
   }
 }
 
-export async function generateStaticParams(): Promise<
+export async function generateStaticParams() {
-  DocPageProps["params"][]
-> {
   return allDocs.map((doc) => ({
     slug: doc.slugAsParams.split("/"),
   }))
 }
 
-export default async function DocPage({ params }: DocPageProps) {
+export default async function DocPage(props: DocPageProps) {
-  const doc = await getDocFromParams({ params })
+  const doc = await getDocFromParams(props)
 
   if (!doc) {
     notFound()

www/apps/ui/src/app/not-found.tsx

@@ -7,6 +7,7 @@ import {
   ComputerDesktopSolid,
   BuildingStorefront,
 } from "@medusajs/icons"
+import React from "react"
 
 const H1 = MDXComponents.h1!
 const P = MDXComponents.p!
@@ -18,8 +19,11 @@ export const metadata: Metadata = {
 export default function NotFound() {
   return (
     <div>
+      {/* @ts-expect-error React v19 doesn't recognize these as elements. */}
       <H1>Page Not Found</H1>
+      {/* @ts-expect-error React v19 doesn't recognize these as elements. */}
       <P>The page you were looking for isn&apos;t available.</P>
+      {/* @ts-expect-error React v19 doesn't recognize these as elements. */}
       <P>
         If you think this is a mistake, please
         <Link href="https://github.com/medusajs/medusa/issues/new?assignees=&labels=type%3A+docs&template=docs.yml">

www/apps/ui/src/components/component-example.tsx

@@ -28,7 +28,7 @@ export function ComponentExample({
   }, [name])
 
   const CodeElement = children as React.ReactElement
-  const Code = CodeElement.props.code
+  const Code = (CodeElement.props as Record<string, string>).code
 
   return (
     <div className="relative my-4 flex flex-col space-y-2" {...props}>

www/apps/ui/src/components/icon-search.tsx

@@ -8,7 +8,7 @@ import * as React from "react"
 
 const iconNames = Object.keys(Icons).filter((name) => name !== "default")
 
-const IconSearch = React.memo(function IconSearch() {
+const IconSearch = () => {
   const [query, setQuery] = React.useState<string | undefined>("")
 
   return (
@@ -23,7 +23,7 @@ const IconSearch = React.memo(function IconSearch() {
       </Container>
     </div>
   )
-})
+}
 
 const SearchResults = ({ query = "" }: { query?: string }) => {
   const cleanQuery = escapeStringRegexp(query.trim().replace(/\s/g, " "))

www/apps/user-guide/.content.eslintrc.js

@@ -1,6 +0,0 @@
-module.exports = {
-  root: true,
-  extends: [
-    "docs/content"
-  ],
-}

www/apps/user-guide/.content.eslintrc.mjs

@@ -0,0 +1,159 @@
+import prettier from "eslint-plugin-prettier"
+import markdown from "eslint-plugin-markdown"
+import globals from "globals"
+import babelParser from "@babel/eslint-parser"
+import typescriptEslintEslintPlugin from "@typescript-eslint/eslint-plugin"
+import tsParser from "@typescript-eslint/parser"
+import path from "node:path"
+import { fileURLToPath } from "node:url"
+import js from "@eslint/js"
+import { FlatCompat } from "@eslint/eslintrc"
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all,
+})
+
+export default [
+  {
+    ignores: [
+      "**/references/**/*",
+      "**/events-reference/**/*",
+      "**/_events-table/**/*",
+    ],
+  },
+  {
+    plugins: {
+      prettier,
+      markdown,
+    },
+
+    languageOptions: {
+      globals: {
+        ...globals.node,
+      },
+
+      parser: babelParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        requireConfigFile: false,
+
+        ecmaFeatures: {
+          experimentalDecorators: true,
+          modules: true,
+        },
+      },
+    },
+
+    settings: {
+      react: {
+        version: "detect",
+      },
+    },
+
+    rules: {
+      "no-undef": "off",
+      "no-unused-expressions": "off",
+      "no-unused-vars": "off",
+      "no-unused-labels": "off",
+      "no-console": "off",
+      curly: ["error", "all"],
+      "new-cap": "off",
+      "require-jsdoc": "off",
+      camelcase: "off",
+      "no-invalid-this": "off",
+
+      "max-len": [
+        "warn",
+        {
+          code: 64,
+        },
+      ],
+
+      semi: ["error", "never"],
+
+      quotes: [
+        "error",
+        "double",
+        {
+          allowTemplateLiterals: true,
+        },
+      ],
+
+      "comma-dangle": [
+        "error",
+        {
+          arrays: "always-multiline",
+          objects: "always-multiline",
+          imports: "always-multiline",
+          exports: "always-multiline",
+          functions: "never",
+        },
+      ],
+
+      "object-curly-spacing": ["error", "always"],
+      "arrow-parens": ["error", "always"],
+      "linebreak-style": 0,
+
+      "no-confusing-arrow": [
+        "error",
+        {
+          allowParens: false,
+        },
+      ],
+
+      "space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "space-infix-ops": "off",
+      "eol-last": ["error", "always"],
+      "react/prop-types": "off",
+      "react/jsx-no-undef": "off",
+    },
+  },
+  {
+    files: ["**/*.md", "**/*.mdx"],
+    processor: "markdown/markdown",
+  },
+  {
+    files: ["**/*.md/*.js", "**/*.mdx/*.js", "**/*.md/*.jsx", "**/*.mdx/*.jsx"],
+  },
+  ...compat.extends("plugin:@typescript-eslint/recommended").map((config) => ({
+    ...config,
+    files: ["**/*.md/*.ts", "**/*.mdx/*.ts", "**/*.md/*.tsx", "**/*.mdx/*.tsx"],
+  })),
+  {
+    files: ["**/*.md/*.ts", "**/*.mdx/*.ts", "**/*.md/*.tsx", "**/*.mdx/*.tsx"],
+
+    plugins: {
+      "@typescript-eslint": typescriptEslintEslintPlugin,
+    },
+
+    languageOptions: {
+      parser: tsParser,
+    },
+
+    rules: {
+      "@typescript-eslint/no-unused-vars": "off",
+      "@typescript-eslint/no-empty-function": "off",
+      "@typescript-eslint/no-explicit-any": "off",
+      "@typescript-eslint/no-non-null-assertion": "off",
+      "@typescript-eslint/no-var-requires": "off",
+      "prefer-rest-params": "off",
+      "@typescript-eslint/ban-ts-comment": "off",
+      "@typescript-eslint/no-non-null-asserted-optional-chain": "off",
+      "@typescript-eslint/ban-types": "off",
+    },
+  },
+]

www/apps/user-guide/.eslintrc.js

@@ -1,14 +0,0 @@
-module.exports = {
-  root: true,
-  extends: [
-    "docs/next"
-  ],
-  settings: {
-    next: {
-      rootDir: ".",
-    },
-  },
-  ignorePatterns: [
-    "generated"
-  ]
-}

www/apps/user-guide/eslint.config.mjs

@@ -0,0 +1,207 @@
+import prettier from "eslint-plugin-prettier/recommended"
+import globals from "globals"
+import babelParser from "@babel/eslint-parser"
+import typescriptEslintEslintPlugin from "@typescript-eslint/eslint-plugin"
+import tsParser from "@typescript-eslint/parser"
+import path from "node:path"
+import { fileURLToPath } from "node:url"
+import js from "@eslint/js"
+import { FlatCompat } from "@eslint/eslintrc"
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all,
+})
+
+export default [
+  prettier,
+  {
+    ignores: ["**/eslint-config-docs", "**/.eslintrc.js", "**/dist"],
+  },
+  ...compat.extends(
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:react/jsx-runtime",
+    "plugin:react-hooks/recommended",
+    "plugin:@next/next/recommended"
+  ),
+  {
+    languageOptions: {
+      globals: {
+        ...globals.node,
+        ...globals.jest,
+        ...globals.browser,
+      },
+
+      parser: babelParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        requireConfigFile: false,
+
+        ecmaFeatures: {
+          experimentalDecorators: true,
+          jsx: true,
+          modules: true,
+        },
+
+        project: true,
+      },
+    },
+
+    settings: {
+      react: {
+        version: "detect",
+      },
+    },
+
+    rules: {
+      curly: ["error", "all"],
+      "new-cap": "off",
+      "require-jsdoc": "off",
+      "no-unused-expressions": "off",
+      "no-unused-vars": "off",
+      camelcase: "off",
+      "no-invalid-this": "off",
+
+      "max-len": [
+        "error",
+        {
+          code: 80,
+          ignoreStrings: true,
+          ignoreRegExpLiterals: true,
+          ignoreComments: true,
+          ignoreTrailingComments: true,
+          ignoreUrls: true,
+          ignoreTemplateLiterals: true,
+        },
+      ],
+
+      semi: ["error", "never"],
+
+      quotes: [
+        "error",
+        "double",
+        {
+          allowTemplateLiterals: true,
+        },
+      ],
+
+      "comma-dangle": [
+        "error",
+        {
+          arrays: "always-multiline",
+          objects: "always-multiline",
+          imports: "always-multiline",
+          exports: "always-multiline",
+          functions: "never",
+        },
+      ],
+
+      "object-curly-spacing": ["error", "always"],
+      "arrow-parens": ["error", "always"],
+      "linebreak-style": 0,
+
+      "no-confusing-arrow": [
+        "error",
+        {
+          allowParens: false,
+        },
+      ],
+
+      "space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "space-infix-ops": "error",
+      "eol-last": ["error", "always"],
+
+      "no-console": [
+        "error",
+        {
+          allow: ["error", "warn"],
+        },
+      ],
+
+      "react/prop-types": [
+        2,
+        {
+          ignore: ["className"],
+        },
+      ],
+    },
+  },
+  ...compat
+    .extends(
+      "plugin:@typescript-eslint/recommended",
+      "plugin:react/recommended"
+    )
+    .map((config) => ({
+      ...config,
+      files: ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"],
+    })),
+  {
+    files: ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"],
+
+    plugins: {
+      "@typescript-eslint": typescriptEslintEslintPlugin,
+    },
+
+    languageOptions: {
+      parser: tsParser,
+      ecmaVersion: 13,
+      sourceType: "module",
+
+      parserOptions: {
+        project: "./tsconfig.json",
+      },
+    },
+
+    settings: {
+      next: {
+        rootDir: ".",
+      },
+    },
+    ignores: [
+      "**/next.config.js",
+      "**/spec",
+      "**/node_modules",
+      "**/public",
+      "**/.eslintrc.js",
+    ],
+
+    rules: {
+      "react/react-in-jsx-scope": "off",
+      "@typescript-eslint/prefer-ts-expect-error": "off",
+      "valid-jsdoc": "off",
+
+      "@typescript-eslint/no-non-null-assertion": "off",
+      "@typescript-eslint/no-floating-promises": "error",
+      "@typescript-eslint/await-thenable": "error",
+      "@typescript-eslint/promise-function-async": "error",
+      "@/keyword-spacing": "error",
+
+      "@/space-before-function-paren": [
+        "error",
+        {
+          anonymous: "always",
+          named: "never",
+          asyncArrow: "always",
+        },
+      ],
+
+      "@/space-infix-ops": "error",
+      "@typescript-eslint/no-explicit-any": "warn",
+      "@typescript-eslint/no-unused-vars": "warn",
+    },
+  },
+]

www/apps/user-guide/package.json

@@ -10,19 +10,19 @@
     "start": "next start",
     "start:monorepo": "yarn start -p 3004",
     "lint": "next lint --fix",
-    "lint:content": "eslint --no-eslintrc -c .content.eslintrc.js app/**/*.mdx --fix",
+    "lint:content": "eslint --no-config-lookup -c .content.eslintrc.mjs app/**/*.mdx --fix",
     "prep": "node ./scripts/prepare.mjs"
   },
   "dependencies": {
-    "@mdx-js/loader": "^3.0.0",
+    "@mdx-js/loader": "^3.1.0",
-    "@mdx-js/react": "^3.0.0",
+    "@mdx-js/react": "^3.1.0",
     "@medusajs/icons": "^2.0.0",
-    "@next/mdx": "^14.2.14",
+    "@next/mdx": "15.0.1",
     "clsx": "^2.1.0",
     "docs-ui": "*",
-    "next": "14.2.14",
+    "next": "15.0.1",
-    "react": "^18.2.0",
+    "react": "rc",
-    "react-dom": "^18.2.0",
+    "react-dom": "rc",
     "rehype-mdx-code-props": "^2.0.0",
     "rehype-slug": "^6.0.0",
     "remark-directive": "^3.0.0",
@@ -30,15 +30,15 @@
     "remark-rehype-plugins": "*"
   },
   "devDependencies": {
-    "@types/mdx": "^2.0.10",
+    "@types/mdx": "^2.0.13",
     "@types/node": "^20",
-    "@types/react": "^18.2.0",
+    "@types/react": "npm:types-react@rc",
-    "@types/react-dom": "^18.2.0",
+    "@types/react-dom": "npm:types-react@rc",
     "autoprefixer": "^10.0.1",
     "build-scripts": "*",
-    "eslint": "^8",
+    "eslint": "^9.13.0",
-    "eslint-config-docs": "*",
+    "eslint-plugin-prettier": "^5.2.1",
-    "eslint-config-next": "14.2.3",
+    "eslint-plugin-react-hooks": "^5.0.0",
     "postcss": "^8",
     "tailwind": "*",
     "tailwindcss": "^3.3.0",
@@ -48,5 +48,9 @@
   },
   "engines": {
     "node": ">=20"
+  },
+  "overrides": {
+    "@types/react": "npm:types-react@rc",
+    "@types/react-dom": "npm:types-react-dom@rc"
   }
 }

www/eslint.config.mjs

@@ -0,0 +1,160 @@
+import prettier from "eslint-plugin-prettier/recommended";
+import globals from "globals";
+import babelParser from "@babel/eslint-parser";
+import typescriptEslintEslintPlugin from "@typescript-eslint/eslint-plugin";
+import tsParser from "@typescript-eslint/parser";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+import js from "@eslint/js";
+import { FlatCompat } from "@eslint/eslintrc";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const compat = new FlatCompat({
+    baseDirectory: __dirname,
+    recommendedConfig: js.configs.recommended,
+    allConfig: js.configs.all
+});
+
+export default [
+    prettier,
+    {
+    ignores: ["**/dist", "**/build"],
+}, ...compat.extends(
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:react/jsx-runtime",
+), {
+
+    languageOptions: {
+        globals: {
+            ...globals.node,
+            ...globals.jest,
+            ...globals.browser,
+        },
+
+        parser: babelParser,
+        ecmaVersion: 13,
+        sourceType: "module",
+
+        parserOptions: {
+            requireConfigFile: false,
+
+            ecmaFeatures: {
+                experimentalDecorators: true,
+                jsx: true,
+                modules: true
+            },
+
+            project: true,
+        },
+    },
+
+    settings: {
+        react: {
+            version: "detect",
+        },
+    },
+
+    rules: {
+        curly: ["error", "all"],
+        "new-cap": "off",
+        "require-jsdoc": "off",
+        "no-unused-expressions": "off",
+        "no-unused-vars": "off",
+        camelcase: "off",
+        "no-invalid-this": "off",
+
+        "max-len": ["error", {
+            code: 80,
+            ignoreStrings: true,
+            ignoreRegExpLiterals: true,
+            ignoreComments: true,
+            ignoreTrailingComments: true,
+            ignoreUrls: true,
+            ignoreTemplateLiterals: true,
+        }],
+
+        semi: ["error", "never"],
+
+        quotes: ["error", "double", {
+            allowTemplateLiterals: true,
+        }],
+
+        "comma-dangle": ["error", {
+            arrays: "always-multiline",
+            objects: "always-multiline",
+            imports: "always-multiline",
+            exports: "always-multiline",
+            functions: "never",
+        }],
+
+        "object-curly-spacing": ["error", "always"],
+        "arrow-parens": ["error", "always"],
+        "linebreak-style": 0,
+
+        "no-confusing-arrow": ["error", {
+            allowParens: false,
+        }],
+
+        "space-before-function-paren": ["error", {
+            anonymous: "always",
+            named: "never",
+            asyncArrow: "always",
+        }],
+
+        "space-infix-ops": "error",
+        "eol-last": ["error", "always"],
+
+        "no-console": ["error", {
+            allow: ["error", "warn"],
+        }],
+
+        "react/prop-types": [2, {
+            ignore: ["className"],
+        }],
+    },
+}, ...compat.extends("plugin:@typescript-eslint/recommended", "plugin:react/recommended").map(config => ({
+    ...config,
+    files: ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"],
+})), {
+    files: ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"],
+
+    plugins: {
+        "@typescript-eslint": typescriptEslintEslintPlugin,
+    },
+
+    languageOptions: {
+        parser: tsParser,
+        ecmaVersion: 13,
+        sourceType: "module",
+
+        parserOptions: {
+            project: "./tsconfig.json",
+        },
+    },
+
+    rules: {
+        "valid-jsdoc": "off",
+        "@typescript-eslint/no-non-null-assertion": "off",
+        "@typescript-eslint/no-floating-promises": "error",
+        "@typescript-eslint/await-thenable": "error",
+        "@typescript-eslint/promise-function-async": "error",
+        "@/keyword-spacing": "error",
+
+        "@/space-before-function-paren": ["error", {
+            anonymous: "always",
+            named: "never",
+            asyncArrow: "always",
+        }],
+
+        "@/space-infix-ops": "error",
+        "@typescript-eslint/no-explicit-any": "warn",
+        "@typescript-eslint/no-unused-vars": "warn",
+    },
+    settings: {
+        next: {
+            rootDir: ["apps/*/"],
+        },
+    },
+}];

www/package.json

@@ -20,13 +20,25 @@
   },
   "dependencies": {
     "autoprefixer": "10.4.14",
-    "eslint": "^8.36.0",
+    "eslint": "^9.13.0",
     "postcss": "8.4.27",
-    "prettier": "^2.8.4",
+    "prettier": "^3.3.3",
     "tailwindcss": "3.3.3",
     "tsconfig": "*",
     "turbo": "latest"
   },
+  "devDependencies": {
+    "@babel/eslint-parser": "^7.25.9",
+    "@eslint/js": "9.13.0",
+    "@types/eslint__js": "8.42.3",
+    "eslint-config-next": "15.0.1",
+    "eslint-config-prettier": "9.1.0",
+    "eslint-config-turbo": "2.2.3",
+    "eslint-plugin-markdown": "5.1.0",
+    "eslint-plugin-prettier": "5.2.1",
+    "eslint-plugin-react": "7.37.2",
+    "typescript-eslint": "8.11.0"
+  },
   "engines": {
     "node": ">=18.17.0"
   }

www/packages/build-scripts/.eslintrc.cjs

@@ -1,9 +0,0 @@
-const path = require("path")
-
-module.exports = {
-  extends: ["docs"],
-  parserOptions: {
-    project: true,
-    tsconfigRootDir: path.join(__dirname, "..", ".."),
-  },
-}

www/packages/build-scripts/package.json

@@ -31,7 +31,6 @@
   },
   "devDependencies": {
     "@types/node": "^20.11.20",
-    "eslint-config-docs": "*",
     "rimraf": "^5.0.5",
     "tsconfig": "*",
     "types": "*",

www/packages/docs-ui/.eslintrc.js

@@ -1,10 +0,0 @@
-module.exports = {
-  root: true,
-  extends: [
-    "docs"
-  ],
-  parserOptions: {
-    project: true,
-    tsconfigRootDir: __dirname,
-  },
-}

www/packages/docs-ui/package.json

@@ -34,16 +34,12 @@
     "lint": "eslint src --fix"
   },
   "devDependencies": {
-    "@types/react": "^18.2.0",
+    "@types/react": "npm:types-react@rc",
-    "@types/react-dom": "^18.2.0",
+    "@types/react-dom": "npm:types-react@rc",
-    "@types/react-google-recaptcha": "^2.1.6",
     "clsx": "^2.0.0",
     "cpy-cli": "^5.0.0",
-    "eslint": "^8",
+    "eslint": "^9.13.0",
-    "eslint-config-docs": "*",
+    "next": "15.0.1",
-    "next": "^14.2.14",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
     "rimraf": "^5.0.1",
     "tailwind": "*",
     "tailwindcss": "^3.3.3",
@@ -53,31 +49,38 @@
     "typescript": "^5.1.6"
   },
   "peerDependencies": {
-    "@types/react": "^18.2.0",
+    "@types/react": "*",
-    "@types/react-dom": "^18.2.0",
+    "@types/react-dom": "*",
     "next": "*",
-    "react": "^18.2.0",
+    "react": "*",
-    "react-dom": "^18.2.0"
+    "react-dom": "*"
   },
   "dependencies": {
+    "@emotion/is-prop-valid": "^1.3.1",
     "@medusajs/icons": "^2.0.0",
     "@medusajs/ui": "^4.0.0",
     "@octokit/request": "^8.1.1",
     "@react-hook/resize-observer": "^1.2.6",
-    "@segment/analytics-next": "^1.55.0",
+    "@segment/analytics-next": "^1.75.0",
     "@uidotdev/usehooks": "^2.4.1",
     "algoliasearch": "^5.2.1",
-    "framer-motion": "^11.3.21",
+    "framer-motion": "^11.11.9",
     "mermaid": "^10.9.0",
     "npm-to-yarn": "^2.1.0",
-    "prism-react-renderer": "2.3.1",
+    "prism-react-renderer": "2.4.0",
+    "react": "rc",
+    "react-dom": "rc",
     "react-google-recaptcha": "^3.1.0",
-    "react-instantsearch": "^7.13.0",
+    "react-instantsearch": "^7.13.6",
-    "react-markdown": "^8.0.7",
+    "react-markdown": "^9.0.1",
     "react-medium-image-zoom": "^5.2.10",
-    "react-tooltip": "^5.21.3",
+    "react-tooltip": "^5.28.0",
     "react-transition-group": "^4.4.5",
     "react-uuid": "^2.0.0",
     "slugify": "^1.6.6"
+  },
+  "overrides": {
+    "@types/react": "npm:types-react@rc",
+    "@types/react-dom": "npm:types-react-dom@rc"
   }
 }

www/packages/docs-ui/src/components/AiAssistant/index.tsx

@@ -297,7 +297,7 @@ export const AiAssistant = () => {
     }
   }, [loading, answer, thread, lastAnswerIndex, inputRef.current])
 
-  useResizeObserver(contentRef, () => {
+  useResizeObserver(contentRef as React.RefObject<HTMLDivElement>, () => {
     if (!loading) {
       return
     }

www/packages/docs-ui/src/components/ChildDocs/index.tsx

@@ -1,7 +1,7 @@
 "use client"
 
 import React, { useMemo } from "react"
-import { Card, CardList, MDXComponents, useSidebar } from "../.."
+import { Card, CardList, H2, useSidebar } from "../.."
 import { InteractiveSidebarItem, SidebarItem, SidebarItemLink } from "types"
 import slugify from "slugify"
 
@@ -151,9 +151,7 @@ export const ChildDocs = ({
   const getAllLevelsElms = (items?: SidebarItem[]) =>
     filterNonInteractiveItems(items).map((item, key) => {
       const itemChildren = getChildrenForLevel(item)
-      const HeadingComponent = itemChildren?.length
+      const HeadingComponent = itemChildren?.length ? H2 : undefined
-        ? MDXComponents["h2"]
-        : undefined
 
       return (
         <React.Fragment key={key}>

www/packages/docs-ui/src/components/CodeBlock/Collapsible/Lines/index.tsx

@@ -1,6 +1,4 @@
-"use client"
+import React from "react"
-
-import React, { useMemo } from "react"
 import { CollapsibleReturn } from "../../../../hooks"
 
 export type CodeBlockCollapsibleLinesProps = {
@@ -12,9 +10,7 @@ export const CodeBlockCollapsibleLines = ({
   children,
   type,
   collapsed,
-  getCollapsibleElms,
 }: CodeBlockCollapsibleLinesProps) => {
-  const shownChildren: React.ReactNode = useMemo(() => {
   const isStart = type === "start"
   return (
     <>
@@ -23,7 +19,4 @@ export const CodeBlockCollapsibleLines = ({
         : children}
     </>
   )
-  }, [children, collapsed])
-
-  return getCollapsibleElms(shownChildren)
 }

www/packages/docs-ui/src/components/CodeBlock/index.tsx

@@ -8,6 +8,7 @@ import { useColorMode } from "@/providers"
 import { CodeBlockHeader, CodeBlockHeaderMeta } from "./Header"
 import { CodeBlockLine } from "./Line"
 import { ApiAuthType, ApiDataOptions, ApiMethod } from "types"
+// @ts-expect-error can't install the types package because it doesn't support React v19
 import { CSSTransition } from "react-transition-group"
 import { useCollapsibleCodeLines } from "../.."
 import { HighlightProps as CollapsibleHighlightProps } from "@/hooks"

www/packages/docs-ui/src/components/CodeTabs/index.tsx

@@ -16,6 +16,7 @@ import { CodeBlockHeaderWrapper } from "../CodeBlock/Header/Wrapper"
 type CodeTab = BaseTabType & {
   codeProps: CodeBlockProps
   codeBlock: React.ReactNode
+  children?: React.ReactNode
 }
 
 type CodeTabProps = {
@@ -33,36 +34,72 @@ export const CodeTabs = ({
   blockStyle = "loud",
 }: CodeTabProps) => {
   const { colorMode } = useColorMode()
+
+  const isCodeBlock = (
+    node: React.ReactNode
+  ): node is
+    | React.ReactElement<unknown, string | React.JSXElementConstructor<any>>
+    | React.ReactPortal => {
+    if (!React.isValidElement(node)) {
+      return false
+    }
+
+    if (node.type === "pre") {
+      return true
+    }
+
+    const typedProps = node.props as Record<string, unknown>
+
+    return "source" in typedProps
+  }
+
   const tabs: CodeTab[] = useMemo(() => {
     const tempTabs: CodeTab[] = []
     Children.forEach(children, (child) => {
+      if (!React.isValidElement(child)) {
+        return
+      }
+      const typedChildProps = child.props as CodeTab
       if (
         !React.isValidElement(child) ||
-        !child.props.label ||
+        !typedChildProps.label ||
-        !child.props.value ||
+        !typedChildProps.value ||
-        !React.isValidElement(child.props.children)
+        !React.isValidElement(typedChildProps.children)
       ) {
         return
       }
 
-      // extract child code block
+      const codeBlock: React.ReactNode = isCodeBlock(typedChildProps.children)
-      const codeBlock =
+        ? typedChildProps.children
-        child.props.children.type === "pre" &&
+        : undefined
-        React.isValidElement(child.props.children.props.children)
+
-          ? child.props.children.props.children
+      if (!codeBlock) {
-          : child.props.children
+        return
+      }
+
+      const codeBlockProps = codeBlock.props as CodeBlockProps
 
       tempTabs.push({
-        label: child.props.label,
+        label: typedChildProps.label,
-        value: child.props.value,
+        value: typedChildProps.value,
-        codeProps: codeBlock.props,
+        codeProps: codeBlockProps,
         codeBlock: {
           ...codeBlock,
           props: {
-            ...codeBlock.props,
+            ...codeBlockProps,
+            children: {
+              ...(typeof codeBlockProps.children === "object"
+                ? codeBlockProps.children
+                : {}),
+              props: {
+                ...(React.isValidElement(codeBlockProps.children)
+                  ? (codeBlockProps.children.props as Record<string, unknown>)
+                  : {}),
                 badgeLabel: undefined,
                 hasTabs: true,
-            className: clsx("!my-0", codeBlock.props.className),
+                className: clsx("!my-0", codeBlockProps.className),
+              },
+            },
           },
         },
       })
@@ -188,7 +225,7 @@ export const CodeTabs = ({
 
             return (
               <child.type
-                {...child.props}
+                {...(typeof child.props === "object" ? child.props : {})}
                 changeSelectedTab={changeSelectedTab}
                 pushRef={(tabButton: HTMLButtonElement | null) =>
                   tabRefs.push(tabButton)
@@ -197,7 +234,7 @@ export const CodeTabs = ({
                 isSelected={
                   !selectedTab
                     ? index === 0
-                    : selectedTab.value === child.props.value
+                    : selectedTab.value === (child.props as CodeTab).value
                 }
               />
             )

www/packages/docs-ui/src/components/Details/Summary/index.tsx

@@ -34,7 +34,7 @@ export const DetailsSummary = ({
         expandable && "cursor-pointer",
         !expandable &&
           "border-medusa-border-base border-y border-solid border-x-0",
-        (expandable || badge) && "gap-0.5",
+        (expandable || badge !== undefined) && "gap-0.5",
         "no-marker",
         className
       )}

www/packages/docs-ui/src/components/Details/index.tsx

@@ -3,7 +3,7 @@
 import React, { Suspense, cloneElement, useRef, useState } from "react"
 import { Loading } from "@/components"
 import clsx from "clsx"
-import { DetailsSummary } from "./Summary"
+import { DetailsSummary, DetailsSummaryProps } from "./Summary"
 import { useCollapsible } from "../../hooks"
 
 export type DetailsProps = {
@@ -22,12 +22,14 @@ export const Details = ({
   ...props
 }: DetailsProps) => {
   const [open, setOpen] = useState(openInitial)
+  const ref = useRef<HTMLDetailsElement>(null)
+  const childrenWrapperRef = useRef<HTMLDivElement>(null)
   const { getCollapsibleElms, setCollapsed } = useCollapsible({
     initialValue: !openInitial,
     heightAnimation,
     onClose: () => setOpen(false),
+    childrenRef: childrenWrapperRef,
   })
-  const ref = useRef<HTMLDetailsElement>(null)
 
   const handleToggle = (e: React.MouseEvent<HTMLElement>) => {
     const targetElm = e.target as HTMLElement
@@ -77,13 +79,19 @@ export const Details = ({
         />
       )}
       {summaryElm &&
-        cloneElement(summaryElm as React.ReactElement, {
+        cloneElement<DetailsSummaryProps>(
+          summaryElm as React.ReactElement<
+            DetailsSummaryProps,
+            React.FunctionComponent<DetailsSummaryProps>
+          >,
+          {
             open,
             onClick: handleToggle,
-        })}
+          }
+        )}
       {getCollapsibleElms(
         <Suspense fallback={<Loading className="!mb-docs_2 !mt-0" />}>
-          {children}
+          <div ref={childrenWrapperRef}>{children}</div>
         </Suspense>
       )}
     </details>

www/packages/docs-ui/src/components/Feedback/index.tsx

@@ -1,6 +1,7 @@
 "use client"
 
 import React, { useRef, useState } from "react"
+// @ts-expect-error can't install the types package because it doesn't support React v19
 import { CSSTransition, SwitchTransition } from "react-transition-group"
 import { Solutions } from "./Solutions"
 import { ExtraData, useAnalytics } from "@/providers/Analytics"
@@ -65,7 +66,7 @@ export const Feedback = ({
   const [medusaVersion, setMedusaVersion] = useState("")
   const [errorFix, setErrorFix] = useState("")
   const [contactInfo, setContactInfo] = useState("")
-  const nodeRef: React.RefObject<HTMLDivElement> = submittedFeedback
+  const nodeRef = submittedFeedback
     ? inlineMessageRef
     : showForm
       ? inlineQuestionRef
@@ -137,7 +138,7 @@ export const Feedback = ({
           }
           nodeRef={nodeRef}
           timeout={300}
-          addEndListener={(done) => {
+          addEndListener={(done: () => void) => {
             nodeRef.current?.addEventListener("transitionend", done, false)
           }}
           classNames={{

www/packages/docs-ui/src/components/Heading/H2/index.tsx

@@ -7,7 +7,7 @@ import { useIsBrowser } from "../../../providers"
 
 type H2Props = React.HTMLAttributes<HTMLHeadingElement> & {
   id?: string
-  passRef?: React.RefObject<HTMLHeadingElement>
+  passRef?: React.RefObject<HTMLHeadingElement | null>
 }
 
 export const H2 = ({ className, children, passRef, ...props }: H2Props) => {

www/packages/docs-ui/src/components/LearningPath/Finish/index.tsx

@@ -32,7 +32,7 @@ export const LearningPathFinish = ({
       )}
       {type === "custom" && (
         <span className="text-compact-small text-medusa-fg-subtle">
-          {step.descriptionJSX}
+          {step.descriptionJSX as React.ReactNode}
         </span>
       )}
     </>

www/packages/docs-ui/src/components/LearningPath/Steps/index.tsx

@@ -5,6 +5,7 @@ import clsx from "clsx"
 import { IconCircleDottedLine } from "@/components/Icons"
 import { CheckCircleSolid, CircleMiniSolid, ListBullet } from "@medusajs/icons"
 import { Badge, Button, Link } from "@/components"
+// @ts-expect-error can't install the types package because it doesn't support React v19
 import { CSSTransition, SwitchTransition } from "react-transition-group"
 
 type LearningPathStepsProps = {
@@ -17,7 +18,7 @@ export const LearningPathSteps = ({ ...rest }: LearningPathStepsProps) => {
   const [collapsed, setCollapsed] = useState(false)
   const stepsRef = useRef<HTMLDivElement>(null)
   const buttonRef = useRef<HTMLButtonElement>(null)
-  const nodeRef: React.RefObject<HTMLElement> = collapsed ? buttonRef : stepsRef
+  const nodeRef = collapsed ? buttonRef : stepsRef
 
   const handleScroll = useCallback(() => {
     if (window.scrollY > 100 && !collapsed) {
@@ -51,7 +52,7 @@ export const LearningPathSteps = ({ ...rest }: LearningPathStepsProps) => {
         key={collapsed ? "show_path" : "show_button"}
         nodeRef={nodeRef}
         timeout={300}
-        addEndListener={(done) => {
+        addEndListener={(done: () => void) => {
           nodeRef.current?.addEventListener("transitionend", done, false)
         }}
         classNames={{
@@ -120,7 +121,8 @@ export const LearningPathSteps = ({ ...rest }: LearningPathStepsProps) => {
                             "text-medium text-ui-fg-subtle mt-docs_1"
                           )}
                         >
-                          {step.descriptionJSX ?? step.description}
+                          {(step.descriptionJSX as React.ReactNode) ??
+                            step.description}
                         </div>
                       </div>
                     )}

www/packages/docs-ui/src/components/MainNav/DesktopMenu/index.tsx

@@ -23,7 +23,7 @@ import { MenuItem } from "types"
 export const MainNavDesktopMenu = () => {
   const [isOpen, setIsOpen] = useState(false)
   const { setDesktopSidebarOpen, isSidebarShown } = useSidebar()
-  const ref = useRef(null)
+  const ref = useRef<HTMLDivElement>(null)
 
   useClickOutside({
     elmRef: ref,

www/packages/docs-ui/src/components/MainNav/MobileMenu/index.tsx

@@ -5,6 +5,7 @@ import { Button } from "../../Button"
 import { ArrowUturnLeft, BarsThree, XMark } from "@medusajs/icons"
 import clsx from "clsx"
 import { MenuItem } from "types"
+// @ts-expect-error can't install the types package because it doesn't support React v19
 import { CSSTransition, SwitchTransition } from "react-transition-group"
 import { MainNavMobileMainMenu } from "./Main"
 import { MainNavMobileSubMenu } from "./SubMenu"