Add @vercel/analytics package and component to

track website analytics

package.json

@@ -22,6 +22,7 @@
     "@sendgrid/mail": "^7.7.0",
     "@tanstack/react-query": "^4.29.3",
     "@tanstack/react-query-devtools": "^4.29.3",
+    "@vercel/analytics": "^1.1.1",
     "auto-zustand-selectors-hook": "^2.0.0",
     "axios": "^1.3.6",
     "clsx": "^1.2.1",

src/pages/_app.tsx

@@ -4,6 +4,7 @@ import { AppProps } from 'next/app';
 import Router from 'next/router';
 import { ThemeProvider } from 'next-themes';
 import nProgress from 'nprogress';
+import { Analytics } from '@vercel/analytics/react';
 
 import '@/styles/globals.css';
 import '@/styles/nprogress.css';
@@ -24,6 +25,7 @@ function MyApp({ Component, pageProps }: AppProps) {
         themes={['dark', 'light']}
       >
         <Component {...pageProps} />
+        <Analytics />
       </ThemeProvider>
     </QueryClientProvider>
   );

yarn.lock

@@ -2661,6 +2661,13 @@
     "@typescript-eslint/types" "5.58.0"
     eslint-visitor-keys "^3.3.0"
 
+"@vercel/analytics@^1.1.1":
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/@vercel/analytics/-/analytics-1.1.1.tgz#2a712378a95014a548b4f9d2ae1ea0721433908d"
+  integrity sha512-+NqgNmSabg3IFfxYhrWCfB/H+RCUOCR5ExRudNG2+pcRehq628DJB5e1u1xqwpLtn4pAYii4D98w7kofORAGQA==
+  dependencies:
+    server-only "^0.0.1"
+
 JSONStream@^1.0.4:
   version "1.3.5"
   resolved "https://registry.yarnpkg.com/JSONStream/-/JSONStream-1.3.5.tgz#3208c1f08d3a4d99261ab64f92302bc15e111ca0"
@@ -7728,6 +7735,11 @@ semver@^7.3.5, semver@^7.3.8:
   dependencies:
     lru-cache "^6.0.0"
 
+server-only@^0.0.1:
+  version "0.0.1"
+  resolved "https://registry.yarnpkg.com/server-only/-/server-only-0.0.1.tgz#0f366bb6afb618c37c9255a314535dc412cd1c9e"
+  integrity sha512-qepMx2JxAa5jjfzxG79yPPq+8BuFToHd1hm7kI+Z4zAq1ftQiP7HcxMhDDItrbtwVeLg/cY2JnKnrcFkmiswNA==
+
 sharp@^0.32.0:
   version "0.32.0"
   resolved "https://registry.yarnpkg.com/sharp/-/sharp-0.32.0.tgz#146b3e1930d56518699908d9116d8a03be1f5cf6"