From 0bd9ac71e3ab021927a6cc6b73b8d5e6fbb7229a Mon Sep 17 00:00:00 2001
From: Jiachi Liu <inbox@huozhi.im>
Date: Thu, 9 Dec 2021 23:24:01 +0100
Subject: [PATCH] Rename vital hook

---
 packages/next/client/vitals.ts                      | 4 +---
 packages/next/taskfile.js                           | 8 --------
 packages/next/vitals.d.ts                           | 2 +-
 packages/next/vitals.js                             | 4 ++--
 test/integration/relay-analytics/pages/index.js     | 8 ++++----
 test/integration/relay-analytics/test/index.test.js | 4 ++--
 6 files changed, 10 insertions(+), 20 deletions(-)

diff --git a/packages/next/client/vitals.ts b/packages/next/client/vitals.ts
index 82152545d48f78d..cf86340383a2143 100644
--- a/packages/next/client/vitals.ts
+++ b/packages/next/client/vitals.ts
@@ -10,9 +10,7 @@ export function trackWebVitalMetric(metric: NextWebVitalsMetric) {
   webVitalsCallbacks.forEach((callback) => callback(metric))
 }
 
-export function useExperimentalWebVitalsReport(
-  callback: ReportWebVitalsCallback
-) {
+export function unstable_useWebVitalsReport(callback: ReportWebVitalsCallback) {
   const metricIndexRef = useRef(0)
 
   useEffect(() => {
diff --git a/packages/next/taskfile.js b/packages/next/taskfile.js
index 868082d49ac261e..eaac4d0bb51b282 100644
--- a/packages/next/taskfile.js
+++ b/packages/next/taskfile.js
@@ -1099,14 +1099,6 @@ export async function client(task, opts) {
   notify('Compiled client files')
 }
 
-export async function vitals(task, opts) {
-  await task
-    .source(opts.src || 'vitals/**/*.+(js|ts|tsx)')
-    .swc('vitals', { dev: opts.dev })
-    .target('dist/vitals')
-  notify('Compiled vitals files')
-}
-
 // export is a reserved keyword for functions
 export async function nextbuildstatic(task, opts) {
   await task
diff --git a/packages/next/vitals.d.ts b/packages/next/vitals.d.ts
index aecd51d1c01ae1c..8629b2093f3f9db 100644
--- a/packages/next/vitals.d.ts
+++ b/packages/next/vitals.d.ts
@@ -1 +1 @@
-export { useExperimentalWebVitalsReport } from './dist/vitals/index'
+export { unstable_useWebVitalsReport } from './dist/vitals/index'
diff --git a/packages/next/vitals.js b/packages/next/vitals.js
index f560bffd5e0a73d..2c2245f1974d919 100644
--- a/packages/next/vitals.js
+++ b/packages/next/vitals.js
@@ -1,4 +1,4 @@
 module.exports = {
-  useExperimentalWebVitalsReport: require('./dist/client/vitals')
-    .useExperimentalWebVitalsReport,
+  unstable_useWebVitalsReport: require('./dist/client/vitals')
+    .unstable_useWebVitalsReport,
 }
diff --git a/test/integration/relay-analytics/pages/index.js b/test/integration/relay-analytics/pages/index.js
index a3842984dc8198c..8f3e7c75b3d63b8 100644
--- a/test/integration/relay-analytics/pages/index.js
+++ b/test/integration/relay-analytics/pages/index.js
@@ -1,5 +1,5 @@
 /* global localStorage */
-import { useExperimentalWebVitalsReport } from 'next/vitals'
+import { unstable_useWebVitalsReport } from 'next/vitals'
 
 if (typeof navigator !== 'undefined') {
   window.__BEACONS = window.__BEACONS || []
@@ -21,8 +21,8 @@ if (typeof navigator !== 'undefined') {
 
 export default () => {
   // Below comment will be used for replacing exported report method with hook based one.
-  ///* useExperimentalWebVitalsReport
-  useExperimentalWebVitalsReport((data) => {
+  ///* unstable_useWebVitalsReport
+  unstable_useWebVitalsReport((data) => {
     const name = data.name || data.entryType
     localStorage.setItem(
       name,
@@ -31,7 +31,7 @@ export default () => {
     const countMap = window.__BEACONS_COUNT
     countMap.set(name, (countMap.get(name) || 0) + 1)
   })
-  // useExperimentalWebVitalsReport */
+  // unstable_useWebVitalsReport */
 
   return (
     <div>
diff --git a/test/integration/relay-analytics/test/index.test.js b/test/integration/relay-analytics/test/index.test.js
index a2e388d893c64b7..88e3c7a0c7d4862 100644
--- a/test/integration/relay-analytics/test/index.test.js
+++ b/test/integration/relay-analytics/test/index.test.js
@@ -35,8 +35,8 @@ async function killServer() {
 describe('Analytics relayer with exported method', () => {
   beforeAll(async () => {
     // Keep app exported reporting and comment the hook one
-    indexPage.replace('///* useExperimentalWebVitalsReport', '/*')
-    indexPage.replace('// useExperimentalWebVitalsReport */', '*/')
+    indexPage.replace('///* unstable_useWebVitalsReport', '/*')
+    indexPage.replace('// unstable_useWebVitalsReport */', '*/')
     await buildApp()
   })
   afterAll(async () => {