Merge remote-tracking branch 'upstream/canary' into convert-link

.github/actions/next-stats-action/src/add-comment.js

@@ -101,7 +101,15 @@ module.exports = async function addComment(
             // check if there is still a change after rounding
             if (change !== 0) {
               const absChange = Math.abs(change)
-              change = `${change < 0 ? '-' : '⚠️ +'}${
+              const warnIfNegative = isBenchmark && itemKey.match(/req\/sec/)
+              const warn = warnIfNegative
+                ? change < 0
+                  ? '⚠️ '
+                  : ''
+                : change > 0
+                ? '⚠️ '
+                : ''
+              change = `${warn}${change < 0 ? '-' : '+'}${
                 useRawValue ? absChange : prettify(absChange, prettyType)
               }`
             }

docs/api-routes/dynamic-api-routes.md

@@ -82,9 +82,6 @@ Now, a request to `/api/post/a/b/c` will respond with the text: `Post: a, b, c`.
 
 ### Optional catch all API routes
 
-> **Warning**: This feature is **experimental and may not work as expected**.
-> You must enable the `optionalCatchAll` experimental option to try it.
-
 Catch all routes can be made optional by including the parameter in double brackets (`[[...slug]]`).
 
 For example, `pages/api/post/[[...slug]].js` will match `/api/post`, `/api/post/a`, `/api/post/a/b`, and so on.

docs/routing/dynamic-routes.md

@@ -87,9 +87,6 @@ And in the case of `/post/a/b`, and any other matching path, new parameters will
 
 ### Optional catch all routes
 
-> **Warning**: This feature is **experimental and may not work as expected**.
-> You must enable the `optionalCatchAll` experimental option to try it.
-
 Catch all routes can be made optional by including the parameter in double brackets (`[[...slug]]`).
 
 For example, `pages/post/[[...slug]].js` will match `/post`, `/post/a`, `/post/a/b`, and so on.

examples/with-mongodb-mongoose/pages/[id]/index.js

@@ -63,16 +63,7 @@ const PetPage = ({ pet }) => {
   )
 }
 
-export async function getStaticPaths() {
-  await dbConnect()
-
-  const result = await Pet.find({})
-  const paths = result.map((doc) => ({ params: { id: doc._id.toString() } }))
-
-  return { paths, fallback: false }
-}
-
-export async function getStaticProps({ params }) {
+export async function getServerSideProps({ params }) {
   await dbConnect()
 
   const pet = await Pet.findById(params.id).lean()

examples/with-mongodb-mongoose/pages/index.js

@@ -48,7 +48,7 @@ const Index = ({ pets }) => (
 )
 
 /* Retrieves pet(s) data from mongodb database */
-export async function getStaticProps() {
+export async function getServerSideProps() {
   await dbConnect()
 
   /* find all the data in our database */

examples/with-next-seo/pages/index.js

@@ -5,31 +5,29 @@ export default function Home() {
   return (
     <div>
       <NextSeo
-        config={{
-          title: 'Page Meta Title',
-          description: 'This will be the page meta description',
-          canonical: 'https://www.canonicalurl.ie/',
-          openGraph: {
-            url: 'https://www.canonicalurl.ie/',
-            title: 'Open Graph Title',
-            description: 'Open Graph Description',
-            images: [
-              {
-                url: 'https://www.example.ie/og-image-01.jpg',
-                width: 800,
-                height: 600,
-                alt: 'Og Image Alt',
-              },
-              {
-                url: 'https://www.example.ie/og-image-02.jpg',
-                width: 900,
-                height: 800,
-                alt: 'Og Image Alt Second',
-              },
-              { url: 'https://www.example.ie/og-image-03.jpg' },
-              { url: 'https://www.example.ie/og-image-04.jpg' },
-            ],
-          },
+        title="Page Meta Title"
+        description="This will be the page meta description"
+        canonical="https://www.canonicalurl.ie/"
+        openGraph={{
+          url: 'https://www.canonicalurl.ie/',
+          title: 'Open Graph Title',
+          description: 'Open Graph Description',
+          images: [
+            {
+              url: 'https://www.example.ie/og-image-01.jpg',
+              width: 800,
+              height: 600,
+              alt: 'Og Image Alt',
+            },
+            {
+              url: 'https://www.example.ie/og-image-02.jpg',
+              width: 900,
+              height: 800,
+              alt: 'Og Image Alt Second',
+            },
+            { url: 'https://www.example.ie/og-image-03.jpg' },
+            { url: 'https://www.example.ie/og-image-04.jpg' },
+          ],
         }}
       />
       <h1>SEO Added to Page</h1>

examples/with-three-js/components/Bird.js

@@ -0,0 +1,40 @@
+import { useRef, useState, useEffect } from 'react'
+import * as THREE from 'three'
+import { useFrame, useLoader } from 'react-three-fiber'
+import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader'
+
+const Bird = ({ speed, factor, url, ...props }) => {
+  const gltf = useLoader(GLTFLoader, url)
+  const group = useRef()
+  const [mixer] = useState(() => new THREE.AnimationMixer())
+  useEffect(
+    () => void mixer.clipAction(gltf.animations[0], group.current).play(),
+    [gltf.animations, mixer]
+  )
+  useFrame((state, delta) => {
+    group.current.rotation.y +=
+      Math.sin((delta * factor) / 2) * Math.cos((delta * factor) / 2) * 1.5
+    mixer.update(delta * speed)
+  })
+  return (
+    <group ref={group}>
+      <scene name="Scene" {...props}>
+        <mesh
+          name="Object_0"
+          morphTargetDictionary={gltf.__$[1].morphTargetDictionary}
+          morphTargetInfluences={gltf.__$[1].morphTargetInfluences}
+          rotation={[1.5707964611537577, 0, 0]}
+        >
+          <bufferGeometry attach="geometry" {...gltf.__$[1].geometry} />
+          <meshStandardMaterial
+            attach="material"
+            {...gltf.__$[1].material}
+            name="Material_0_COLOR_0"
+          />
+        </mesh>
+      </scene>
+    </group>
+  )
+}
+
+export default Bird

examples/with-three-js/pages/birds.js

@@ -1,42 +1,7 @@
-import { useRef, useState, useEffect, Suspense } from 'react'
-import * as THREE from 'three'
-import { Canvas, useFrame, useLoader } from 'react-three-fiber'
-
-let GLTFLoader
-
-const Bird = ({ speed, factor, url, ...props }) => {
-  const gltf = useLoader(GLTFLoader, url)
-  const group = useRef()
-  const [mixer] = useState(() => new THREE.AnimationMixer())
-  useEffect(
-    () => void mixer.clipAction(gltf.animations[0], group.current).play(),
-    [gltf.animations, mixer]
-  )
-  useFrame((state, delta) => {
-    group.current.rotation.y +=
-      Math.sin((delta * factor) / 2) * Math.cos((delta * factor) / 2) * 1.5
-    mixer.update(delta * speed)
-  })
-  return (
-    <group ref={group}>
-      <scene name="Scene" {...props}>
-        <mesh
-          name="Object_0"
-          morphTargetDictionary={gltf.__$[1].morphTargetDictionary}
-          morphTargetInfluences={gltf.__$[1].morphTargetInfluences}
-          rotation={[1.5707964611537577, 0, 0]}
-        >
-          <bufferGeometry attach="geometry" {...gltf.__$[1].geometry} />
-          <meshStandardMaterial
-            attach="material"
-            {...gltf.__$[1].material}
-            name="Material_0_COLOR_0"
-          />
-        </mesh>
-      </scene>
-    </group>
-  )
-}
+import dynamic from 'next/dynamic'
+import { Suspense } from 'react'
+import { Canvas } from 'react-three-fiber'
+const Bird = dynamic(() => import('../components/Bird'), { ssr: false })
 
 const Birds = () => {
   return new Array(5).fill().map((_, i) => {
@@ -65,9 +30,6 @@ const Birds = () => {
 }
 
 const BirdsPage = (props) => {
-  useEffect(() => {
-    GLTFLoader = require('three/examples/jsm/loaders/GLTFLoader').GLTFLoader
-  }, [])
   return (
     <>
       <Canvas camera={{ position: [0, 0, 35] }}>

lerna.json

@@ -17,5 +17,5 @@
       "registry": "https://registry.npmjs.org/"
     }
   },
-  "version": "9.4.5-canary.22"
+  "version": "9.4.5-canary.24"
 }

packages/create-next-app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-next-app",
-  "version": "9.4.5-canary.22",
+  "version": "9.4.5-canary.24",
   "keywords": [
     "react",
     "next",

packages/eslint-plugin-next/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/eslint-plugin-next",
-  "version": "9.4.5-canary.22",
+  "version": "9.4.5-canary.24",
   "description": "ESLint plugin for NextJS.",
   "main": "lib/index.js",
   "license": "MIT",

packages/next-bundle-analyzer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/bundle-analyzer",
-  "version": "9.4.5-canary.22",
+  "version": "9.4.5-canary.24",
   "main": "index.js",
   "license": "MIT",
   "repository": {

packages/next-mdx/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/mdx",
-  "version": "9.4.5-canary.22",
+  "version": "9.4.5-canary.24",
   "main": "index.js",
   "license": "MIT",
   "repository": {

packages/next-plugin-google-analytics/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/plugin-google-analytics",
-  "version": "9.4.5-canary.22",
+  "version": "9.4.5-canary.24",
   "repository": {
     "url": "vercel/next.js",
     "directory": "packages/next-plugin-google-analytics"

packages/next-plugin-sentry/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/plugin-sentry",
-  "version": "9.4.5-canary.22",
+  "version": "9.4.5-canary.24",
   "repository": {
     "url": "vercel/next.js",
     "directory": "packages/next-plugin-sentry"

packages/next-plugin-storybook/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/plugin-storybook",
-  "version": "9.4.5-canary.22",
+  "version": "9.4.5-canary.24",
   "repository": {
     "url": "vercel/next.js",
     "directory": "packages/next-plugin-storybook"

packages/next-polyfill-nomodule/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/polyfill-nomodule",
-  "version": "9.4.5-canary.22",
+  "version": "9.4.5-canary.24",
   "description": "A polyfill for non-dead, nomodule browsers.",
   "main": "dist/polyfill-nomodule.js",
   "license": "MIT",

packages/next/build/index.ts

@@ -47,6 +47,7 @@ import loadConfig, {
 import { BuildManifest } from '../next-server/server/get-page-files'
 import '../next-server/server/node-polyfill-fetch'
 import { normalizePagePath } from '../next-server/server/normalize-page-path'
+import { getPagePath } from '../next-server/server/require'
 import * as ciEnvironment from '../telemetry/ci-info'
 import {
   eventBuildCompleted,
@@ -73,7 +74,6 @@ import {
 import getBaseWebpackConfig from './webpack-config'
 import { PagesManifest } from './webpack/plugins/pages-manifest-plugin'
 import { writeBuildId } from './write-build-id'
-import { getPagePath } from '../next-server/server/require'
 const staticCheckWorker = require.resolve('./utils')
 
 export type SsgRoute = {
@@ -277,16 +277,6 @@ export default async function build(dir: string, conf = null): Promise<void> {
     }
   }
 
-  const firstOptionalCatchAllPage =
-    pageKeys.find((f) => /\[\[\.{3}[^\][/]*\]\]/.test(f)) ?? null
-  if (
-    config.experimental?.optionalCatchAll !== true &&
-    firstOptionalCatchAllPage
-  ) {
-    const msg = `Optional catch-all routes are currently experimental and cannot be used by default ("${firstOptionalCatchAllPage}").`
-    throw new Error(msg)
-  }
-
   const routesManifestPath = path.join(distDir, ROUTES_MANIFEST)
   const routesManifest: any = {
     version: 3,
@@ -690,7 +680,7 @@ export default async function build(dir: string, conf = null): Promise<void> {
       ...config,
       initialPageRevalidationMap: {},
       // Default map will be the collection of automatic statically exported
-      // pages and SPR pages.
+      // pages and incremental pages.
       // n.b. we cannot handle this above in combinedPages because the dynamic
       // page must be in the `pages` array, but not in the mapping.
       exportPathMap: (defaultMap: any) => {

packages/next/build/plugins/collect-plugins.ts

@@ -24,9 +24,6 @@ export const VALID_MIDDLEWARE = [
   'on-error-client',
   'on-error-server',
   'babel-preset-build',
-  'unstable-post-hydration',
-  'unstable-get-styles-server',
-  'unstable-enhance-app-server',
 ]
 
 type ENV_OPTIONS = { [name: string]: string }