Added vercel analytics and fixed warning

client/package.json

@@ -28,6 +28,7 @@
     "@iconify/react": "^4.1.1",
     "@mui/lab": "^5.0.0-alpha.147",
     "@mui/material": "^5.14.12",
+    "@vercel/analytics": "^1.2.2",
     "apexcharts": "^3.43.0",
     "date-fns": "^2.30.0",
     "history": "^5.3.0",

client/src/main.jsx

@@ -1,6 +1,8 @@
 import { Suspense } from 'react';
 import ReactDOM from 'react-dom/client';
 import { BrowserRouter } from 'react-router-dom';
+// eslint-disable-next-line import/no-extraneous-dependencies
+import { Analytics } from "@vercel/analytics/react";
 import { HelmetProvider } from 'react-helmet-async';
 
 import App from './app';
@@ -13,6 +15,7 @@ root.render(
   <HelmetProvider>
     <BrowserRouter>
       <Suspense>
+        <Analytics />
         <App />
       </Suspense>
     </BrowserRouter>

client/src/stories/Button.jsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+
 import './button.css';
 
 /**

client/src/stories/Header.jsx

@@ -1,8 +1,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-import { Button } from './Button';
 import './header.css';
+import { Button } from './Button';
 
 export const Header = ({ user, onLogin, onLogout, onCreateAccount }) => (
   <header>

client/src/stories/Page.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
-import { Header } from './Header';
 import './page.css';
+import { Header } from './Header';
 
 export const Page = () => {
   const [user, setUser] = React.useState();

client/src/stories/Page.stories.js

@@ -1,5 +1,5 @@
 // eslint-disable-next-line import/no-extraneous-dependencies
-import { within, userEvent, expect } from '@storybook/test';
+import { within, expect, userEvent } from '@storybook/test';
 
 import { Page } from './Page';