diff --git a/web/src/App.tsx b/web/src/App.tsx
index 071a8a7..4ac2351 100644
--- a/web/src/App.tsx
+++ b/web/src/App.tsx
@@ -1,5 +1,5 @@
 import React, { useContext } from 'react'
-import { Route, HashRouter, Switch } from 'react-router-dom'
+import { Route, HashRouter, Routes } from 'react-router-dom'
 import { ThemeProvider } from '@mui/material/styles'
 import { theme } from './theme'
 
@@ -22,11 +22,9 @@ function App() {
       <ThemeProvider theme={theme}>
         <HashRouter>
           <Header />
-          <Switch>
-            <Route path="/">
-              <Login />
-            </Route>
-          </Switch>
+          <Routes>
+            <Route path="/" element={<Login />} />
+          </Routes>
         </HashRouter>
       </ThemeProvider>
     )
@@ -36,23 +34,13 @@ function App() {
     <ThemeProvider theme={theme}>
       <HashRouter>
         <Header />
-        <Switch>
-          <Route exact path="/">
-            <Home />
-          </Route>
-          <Route exact path="/SASjsDrive">
-            <Drive />
-          </Route>
-          <Route exact path="/SASjsStudio">
-            <Studio />
-          </Route>
-          <Route exact path="/SASjsSettings">
-            <Settings />
-          </Route>
-          <Route exact path="/SASjsLogon">
-            <AuthCode />
-          </Route>
-        </Switch>
+        <Routes>
+          <Route path="/" element={<Home />} />
+          <Route path="/SASjsDrive" element={<Drive />} />
+          <Route path="/SASjsStudio" element={<Studio />} />
+          <Route path="/SASjsSettings" element={<Settings />} />
+          <Route path="/SASjsLogon" element={<AuthCode />} />
+        </Routes>
         <ToastContainer />
       </HashRouter>
     </ThemeProvider>
diff --git a/web/src/components/header.tsx b/web/src/components/header.tsx
index 35c04ef..d80d01a 100644
--- a/web/src/components/header.tsx
+++ b/web/src/components/header.tsx
@@ -1,5 +1,5 @@
 import React, { useState, useEffect, useContext } from 'react'
-import { Link, useHistory, useLocation } from 'react-router-dom'
+import { Link, useNavigate, useLocation } from 'react-router-dom'
 
 import {
   AppBar,
@@ -24,7 +24,7 @@ const baseUrl =
 const validTabs = ['/', '/SASjsDrive', '/SASjsStudio']
 
 const Header = (props: any) => {
-  const history = useHistory()
+  const navigate = useNavigate()
   const { pathname } = useLocation()
   const appContext = useContext(AppContext)
   const [tabValue, setTabValue] = useState(
@@ -74,7 +74,7 @@ const Header = (props: any) => {
           }}
           onClick={() => {
             setTabValue('/')
-            history.push('/')
+            navigate('/')
           }}
         />
         <Tabs