feat: improve opening a new issue flow

.github/ISSUE_TEMPLATE/1.bug_report.yml

@@ -7,49 +7,28 @@ body:
       value: Thanks for taking the time to file a bug report! Please fill out this form as completely as possible.
   - type: markdown
     attributes:
-      value: If you leave out sections there is a high likelihood it will be moved to the GitHub Discussions "Help" section.
-  - type: markdown
-    attributes:
-      value: 'Please first verify if your issue exists in the Next.js canary release line: `npm install next@canary`.'
-  - type: markdown
-    attributes:
-      value: 'next@canary is the beta version of Next.js. It includes all features and fixes that are pending to land on the stable release line.'
+      value: If you leave out sections there is a high likelihood it will be moved to the GitHub Discussions ["Help" section](https://github.com/vercel/next.js/discussions/categories/help).
+  - type: checkboxes
+    attributes:
+      label: Verify canary release
+      description: '`next@canary` is the beta version of Next.js. It includes all features and fixes that are pending to land on the stable release line. Some issues might have already been fixed there, so please verify that your issue exists in Next.js canary releases (`npm install next@canary`) before opening a new bug report.'
+      options:
+        - label: I verified that the issue exists in Next.js canary release
+          required: true
   - type: textarea
     attributes:
-      label: Run `next info` (available from version 12.0.8 and up)
+      label: Provide environment information
       description: Please run `next info` in the root directory of your project and paste the results. You might need to use `npx --no-install next info` if next is not in the current PATH.
     validations:
       required: false
   - type: input
     attributes:
-      label: What version of Next.js are you using?
-      description: 'For example: 10.0.1'
-    validations:
-      required: true
-  - type: input
-    attributes:
-      label: What version of Node.js are you using?
-      description: 'For example: 12.0.0'
-    validations:
-      required: true
-  - type: input
-    attributes:
-      label: What browser are you using?
-      description: 'For example: Chrome, Safari'
-    validations:
-      required: true
-  - type: input
-    attributes:
-      label: What operating system are you using?
-      description: 'For example: macOS, Windows'
-    validations:
-      required: true
+      label: What browser are you using? (if relevant)
+      description: 'Please specify the exact version. For example: Chrome 100.0.4878.0'
   - type: input
     attributes:
-      label: How are you deploying your application?
+      label: How are you deploying your application? (if relevant)
       description: 'For example: next start, next export, Vercel, Other platform'
-    validations:
-      required: true
   - type: textarea
     attributes:
       label: Describe the Bug

.github/ISSUE_TEMPLATE/2.example_bug_report.yml

@@ -1,49 +1,40 @@
 name: Example Bug Report
-description: Create a bug report for the examples
+description: Create a bug report for one of the Next.js examples
 labels: 'type: example,template: bug'
 body:
   - type: markdown
     attributes:
-      value: Thanks for taking the time to file a examples bug report! Please fill out this form as completely as possible.
+      value: Thanks for taking the time to file a bug report for [one of the examples](https://github.com/vercel/next.js/tree/canary/examples)! Please fill out this form as completely as possible.
   - type: markdown
     attributes:
-      value: If you leave out sections there is a high likelihood it will be moved to the GitHub Discussions "Help" section.
-  - type: input
-    attributes:
-      label: What example does this report relate to?
-      description: 'For example: with-styled-components'
-    validations:
-      required: true
-  - type: input
+      value: If you leave out sections there is a high likelihood it will be moved to the GitHub Discussions ["Help" section](https://github.com/vercel/next.js/discussions/categories/help).
+  - type: checkboxes
     attributes:
-      label: What version of Next.js are you using?
-      description: 'For example: 10.0.1'
-    validations:
-      required: true
-  - type: input
+      label: Verify canary release
+      description: '`next@canary` is the beta version of Next.js. It includes all features and fixes that are pending to land on the stable release line. Some issues might have already been fixed there, so please verify that your issue exists in Next.js canary releases (`npm install next@canary`) before opening a new bug report.'
+      options:
+        - label: I verified that the issue exists in Next.js canary release
+          required: true
+  - type: textarea
     attributes:
-      label: What version of Node.js are you using?
-      description: 'For example: 12.0.0'
+      label: Provide environment information
+      description: Please run `next info` in the root directory of your project and paste the results. You might need to use `npx --no-install next info` if next is not in the current PATH.
     validations:
-      required: true
+      required: false
   - type: input
     attributes:
-      label: What browser are you using?
-      description: 'For example: Chrome, Safari'
+      label: "What example does this report relate to? See a complete list in the [examples folder](https://github.com/vercel/next.js/tree/canary/examples). Note: Examples not in the exmples folder might be maintained by the example's library author. Check out their projects before opening the issue on Next.js"
+      description: 'For example: with-styled-components'
     validations:
       required: true
   - type: input
     attributes:
-      label: What operating system are you using?
-      description: 'For example: macOS, Windows'
-    validations:
-      required: true
+      label: What browser are you using? (if relevant)
+      description: 'Please specify the exact version. For example: Chrome 100.0.4878.0'
   - type: input
     attributes:
-      label: How are you deploying your application?
+      label: How are you deploying your application? (if relevant)
       description: 'For example: next start, next export, Vercel, Other platform'
-    validations:
-      required: true
   - type: textarea
     attributes:
       label: Describe the Bug

errors/manifest.json

@@ -619,6 +619,10 @@
         {
           "title": "ignored-compiler-options",
           "path": "/errors/ignored-compiler-options.md"
+        },
+        {
+          "title": "opening-an-issue",
+          "path": "/errors/opening-an-issue.md"
         }
       ]
     }

errors/opening-an-issue.md

@@ -0,0 +1,28 @@
+# Opening a new Issue
+
+#### Why This Message Occurred
+
+When `next info` was run, Next.js detected that it's was not on the latest canary release.
+
+`next@canary` is the beta version of Next.js. It includes all features and fixes that are pending to land on the stable release line.
+
+Some issues might have already been fixed there, so before opening a new issue on the repository, make sure to verify if the issue hasn't been fixed there already.
+
+Run the following in the codebase:
+
+```sh
+npm install next@canary
+```
+
+or
+
+```
+yarn add next@canary
+```
+
+And go through the prepared reproduction steps once again, and check if the issue still exists.
+
+### Useful Links
+
+- [Video: How to Contribute to Open Source (Next.js)](https://www.youtube.com/watch?v=cuoNzXFLitc)
+- [Contributing to Next.js](https://github.com/vercel/next.js/blob/canary/contributing.md)

packages/next/cli/next-info.ts

@@ -4,6 +4,7 @@ import childProcess from 'child_process'
 
 import chalk from 'next/dist/compiled/chalk'
 import arg from 'next/dist/compiled/arg/index.js'
+import fetch from 'next/dist/compiled/node-fetch'
 import { printAndExit } from '../server/lib/utils'
 import { cliCommand } from '../bin/next'
 import isError from '../lib/is-error'
@@ -41,6 +42,8 @@ const nextInfo: cliCommand = async (argv) => {
     return
   }
 
+  const installedRelease = getPackageVersion('next')
+
   console.log(`
     Operating System:
       Platform: ${os.platform()}
@@ -52,9 +55,26 @@ const nextInfo: cliCommand = async (argv) => {
       Yarn: ${getBinaryVersion('yarn')}
       pnpm: ${getBinaryVersion('pnpm')}
     Relevant packages:
-      next: ${getPackageVersion('next')}
+      next: ${installedRelease}
       react: ${getPackageVersion('react')}
-      react-dom: ${getPackageVersion('react-dom')}`)
+      react-dom: ${getPackageVersion('react-dom')}
+`)
+
+  const res = await fetch(
+    'https://api.github.com/repos/vercel/next.js/releases'
+  )
+  const releases = await res.json()
+  const newestRelease = releases[0].tag_name.replace(/^v/, '')
+
+  if (installedRelease !== newestRelease) {
+    console.warn(
+      `${chalk.yellow(
+        chalk.bold('warn')
+      )}  - Earlier Next.js release "${installedRelease}" detected. Newest: "${newestRelease}".
+        Before opening a new issue, verify that your issue still exists in Next.js canary releases (\`npm install next@canary\`).
+        Read more - https://nextjs.org/docs/messages/opening-an-issue`
+    )
+  }
 }
 
 export { nextInfo }