From b8165af42cff1b57f6df38850f31849368bfc0b1 Mon Sep 17 00:00:00 2001
From: Shu Ding <g@shud.in>
Date: Mon, 19 Aug 2024 14:59:22 +0200
Subject: [PATCH] Improve Metadata JSDoc (#69037)

Currently the JSDoc for deprecated metadata fields is too confusing.
`@deprecated` tag is inside the `@example` and it doesn't give any
information about the deprecation.

This fix adds a deprecation message and a link to the correct docs.


![CleanShot-2024-08-18-37v7ShgN@2x](https://github.com/user-attachments/assets/20b33f5c-9608-4244-b321-2e5811b22ce2)
---
 .../src/lib/metadata/types/metadata-interface.ts    | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/packages/next/src/lib/metadata/types/metadata-interface.ts b/packages/next/src/lib/metadata/types/metadata-interface.ts
index 6b0aa16cdc4ad..eece6b99a43a3 100644
--- a/packages/next/src/lib/metadata/types/metadata-interface.ts
+++ b/packages/next/src/lib/metadata/types/metadata-interface.ts
@@ -132,9 +132,9 @@ interface Metadata extends DeprecatedMetadataFields {
 
   /**
    * The theme color for the document.
+   * @deprecated Use `export const viewport: Viewport = { ... }` instead.
+   * @see https://nextjs.org/docs/app/api-reference/functions/generate-viewport#the-viewport-object
    * @example
-   * @deprecated
-   *
    * ```tsx
    * "#000000"
    * <meta name="theme-color" content="#000000" />
@@ -154,9 +154,9 @@ interface Metadata extends DeprecatedMetadataFields {
 
   /**
    * The color scheme for the document.
+   * @deprecated Use `export const viewport: Viewport = { ... }` instead.
+   * @see https://nextjs.org/docs/app/api-reference/functions/generate-viewport#the-viewport-object
    * @example
-   * @deprecated
-   *
    * ```tsx
    * "dark"
    * <meta name="color-scheme" content="dark" />
@@ -166,11 +166,10 @@ interface Metadata extends DeprecatedMetadataFields {
 
   /**
    * The viewport setting for the document.
+   * @deprecated Use `export const viewport: Viewport = { ... }` instead.
+   * @see https://nextjs.org/docs/app/api-reference/functions/generate-viewport#the-viewport-object
    * @example
-   * @deprecated
-   *
    * ```tsx
-   *
    * { width: "device-width", initialScale: 1 }
    * <meta name="viewport" content="width=device-width, initial-scale=1" />
    * ```