Merge branch '10-13-_do_not_merge_eslint' of github.com:vercel/next.js into 10-14-test_improve_linting

Author: devjiwonchoi

.github/ISSUE_TEMPLATE/1.bug_report.yml

@@ -135,4 +135,4 @@ body:
 
         or
 
-        I am hosting via Docker with the recommended `output: "standalone"` option", and if I remove that option or try a different hosting option, I cannot reproduce the same issue.
+        I am hosting via Docker with the recommended `output: "standalone"` option, and if I remove that option or try a different hosting option, I cannot reproduce the same issue.

crates/next-core/src/next_client/context.rs

@@ -322,6 +322,7 @@ pub async fn get_client_module_options_context(
         enable_mdx_rs,
         css: CssOptionsContext {
             use_swc_css,
+            minify_type: next_mode.minify_type(),
             ..module_options_context.css
         },
         rules: vec![

docs/02-app/01-building-your-application/01-routing/14-middleware.mdx

@@ -25,7 +25,7 @@ Recognizing situations where middleware may not be the optimal approach is just
 - Complex Data Fetching and Manipulation: Middleware is not designed for direct data fetching or manipulation, this should be done within Route Handlers or server-side utilities instead.
 - Heavy Computational Tasks: Middleware should be lightweight and respond quickly or it can cause delays in page load. Heavy computational tasks or long-running processes should be done within dedicated Route Handlers.
 - Extensive Session Management: While Middleware can manage basic session tasks, extensive session management should be managed by dedicated authentication services or within Route Handlers.
-- Direct Database Operations: Performing direct database operations within Middleware is not recommended. Database interactions should done within Route Handlers or server-side utilities.
+- Direct Database Operations: Performing direct database operations within Middleware is not recommended. Database interactions should be done within Route Handlers or server-side utilities.
 
 ## Convention
 

docs/02-app/01-building-your-application/03-rendering/03-composition-patterns.mdx

@@ -358,7 +358,7 @@ To reduce the Client JavaScript bundle size, we recommend moving Client Componen
 
 For example, you may have a Layout that has static elements (e.g. logo, links, etc) and an interactive search bar that uses state.
 
-Instead of making the whole layout a Client Component, move the interactive logic to a Client Component (e.g. `<SearchBar />`) and keep your layout as a Server Component. This means you don't have to send all the component Javascript of the layout to the client.
+Instead of making the whole layout a Client Component, move the interactive logic to a Client Component (e.g. `<SearchBar />`) and keep your layout as a Server Component. This means you don't have to send all the component JavaScript of the layout to the client.
 
 ```tsx filename="app/layout.tsx" switcher
 // SearchBar is a Client Component

docs/02-app/01-building-your-application/06-optimizing/10-open-telemetry.mdx

@@ -279,7 +279,7 @@ This span can be turned off by setting `NEXT_OTEL_FETCH_DISABLED=1` in your envi
 
 - `next.span_type`: `AppRouteRouteHandlers.runHandler`.
 
-This span represents the execution of an API route handler in the app router.
+This span represents the execution of an API Route Handler in the app router.
 
 Attributes:
 

docs/02-app/01-building-your-application/07-configuring/11-draft-mode.mdx

@@ -84,7 +84,7 @@ export async function GET(request: Request) {
   const slug = searchParams.get('slug')
 
   // Check the secret and next parameters
-  // This secret should only be known to this route handler and the CMS
+  // This secret should only be known to this Route Handler and the CMS
   if (secret !== 'MY_SECRET_TOKEN' || !slug) {
     return new Response('Invalid token', { status: 401 })
   }
@@ -118,7 +118,7 @@ export async function GET(request) {
   const slug = searchParams.get('slug')
 
   // Check the secret and next parameters
-  // This secret should only be known to this route handler and the CMS
+  // This secret should only be known to this Route Handler and the CMS
   if (secret !== 'MY_SECRET_TOKEN' || !slug) {
     return new Response('Invalid token', { status: 401 })
   }

docs/02-app/01-building-your-application/07-configuring/16-debugging.mdx

@@ -58,7 +58,7 @@ Now go to the Debug panel (`Ctrl+Shift+D` on Windows/Linux, `⇧+⌘+D` on macOS
 
 ## Using the Debugger in Jetbrains WebStorm
 
-Click the drop down menu listing the runtime configuration, and click `Edit Configurations...`. Create a `Javascript Debug` debug configuration with `http://localhost:3000` as the URL. Customize to your liking (e.g. Browser for debugging, store as project file), and click `OK`. Run this debug configuration, and the selected browser should automatically open. At this point, you should have 2 applications in debug mode: the NextJS node application, and the client/ browser application.
+Click the drop down menu listing the runtime configuration, and click `Edit Configurations...`. Create a `JavaScript Debug` debug configuration with `http://localhost:3000` as the URL. Customize to your liking (e.g. Browser for debugging, store as project file), and click `OK`. Run this debug configuration, and the selected browser should automatically open. At this point, you should have 2 applications in debug mode: the NextJS node application, and the client/ browser application.
 
 ## Debugging with Chrome DevTools
 

docs/02-app/01-building-your-application/09-authentication/index.mdx

@@ -1635,7 +1635,6 @@ Now that you've learned about authentication in Next.js, here are Next.js-compat
 - [Auth0](https://auth0.com/docs/quickstart/webapp/nextjs/01-login)
 - [Clerk](https://clerk.com/docs/quickstarts/nextjs)
 - [Kinde](https://kinde.com/docs/developer-tools/nextjs-sdk)
-- [Lucia](https://lucia-auth.com/getting-started/nextjs-app)
 - [NextAuth.js](https://authjs.dev/getting-started/installation?framework=next.js)
 - [Stack Auth](https://docs.stack-auth.com/getting-started/setup)
 - [Supabase](https://supabase.com/docs/guides/getting-started/quickstarts/nextjs)

docs/02-app/02-api-reference/01-components/link.mdx

@@ -648,7 +648,7 @@ For example, you can generate a list of links to the dynamic route `app/blog/[sl
 ```tsx filename="app/blog/page.tsx" switcher
 import Link from 'next/link'
 
-function Page({ posts }) {
+export default function Page({ posts }) {
   return (
     <ul>
       {posts.map((post) => (
@@ -664,7 +664,7 @@ function Page({ posts }) {
 ```jsx filename="app/blog/page.js" switcher
 import Link from 'next/link'
 
-function Page({ posts }) {
+export default function Page({ posts }) {
   return (
     <ul>
       {posts.map((post) => (
@@ -734,7 +734,7 @@ export default NavLink
 ```
 
 - If you’re using [emotion](https://emotion.sh/)’s JSX pragma feature (`@jsx jsx`), you must use `passHref` even if you use an `<a>` tag directly.
-- The component should support `onClick` property to trigger navigation correctly
+- The component should support `onClick` property to trigger navigation correctly.
 
 ### Nesting a functional component
 
@@ -1013,7 +1013,7 @@ export default function Home() {
 
 <AppOnly>
 
-The default scrolling behavior of `<Link>` in Next.js **is to maintain scroll position**, similar to how browsers handle back and fowards navigation. When you navigate to a new [Page](/docs/app/building-your-application/routing/pages), scroll position will stay the same as long as the Page is visible in the viewport.
+The default scrolling behavior of `<Link>` in Next.js **is to maintain scroll position**, similar to how browsers handle back and forwards navigation. When you navigate to a new [Page](/docs/app/building-your-application/routing/pages), scroll position will stay the same as long as the Page is visible in the viewport.
 
 However, if the Page is not visible in the viewport, Next.js will scroll to the top of the first Page element. If you'd like to disable this behavior, you can pass `scroll={false}` to the `<Link>` component, or `scroll: false` to `router.push()` or `router.replace()`.
 
@@ -1125,6 +1125,8 @@ In this case, you would want to use the following code in your `<Link />` compon
 <AppOnly>
 
 ```tsx filename="app/page.tsx" switcher
+'use client'
+
 import Link from 'next/link'
 import useIsAuthed from './hooks/useIsAuthed' // Your auth hook
 
@@ -1140,6 +1142,8 @@ export default function Page() {
 ```
 
 ```js filename="app/page.js" switcher
+'use client'
+
 import Link from 'next/link'
 import useIsAuthed from './hooks/useIsAuthed' // Your auth hook
 
@@ -1159,6 +1163,8 @@ export default function Page() {
 <PagesOnly>
 
 ```tsx filename="pages/index.tsx" switcher
+'use client'
+
 import Link from 'next/link'
 import useIsAuthed from './hooks/useIsAuthed' // Your auth hook
 
@@ -1174,6 +1180,8 @@ export default function Home() {
 ```
 
 ```js filename="pages/index.js" switcher
+'use client'
+
 import Link from 'next/link'
 import useIsAuthed from './hooks/useIsAuthed' // Your auth hook
 

docs/02-app/02-api-reference/02-file-conventions/route.mdx

@@ -22,7 +22,7 @@ export async function DELETE(request: Request) {}
 
 export async function PATCH(request: Request) {}
 
-// If `OPTIONS` is not defined, Next.js will automatically implement `OPTIONS` and set the appropriate Response `Allow` header depending on the other methods defined in the route handler.
+// If `OPTIONS` is not defined, Next.js will automatically implement `OPTIONS` and set the appropriate Response `Allow` header depending on the other methods defined in the Route Handler.
 export async function OPTIONS(request: Request) {}
 ```
 
@@ -39,7 +39,7 @@ export async function DELETE(request) {}
 
 export async function PATCH(request) {}
 
-// If `OPTIONS` is not defined, Next.js will automatically implement `OPTIONS` and set the appropriate Response `Allow` header depending on the other methods defined in the route handler.
+// If `OPTIONS` is not defined, Next.js will automatically implement `OPTIONS` and set the appropriate Response `Allow` header depending on the other methods defined in the Route Handler.
 export async function OPTIONS(request) {}
 ```