Header, Footer, FileUpload

src/App.tsx

@@ -1,16 +1,21 @@
 import React from 'react';
 import {useContext} from 'react'
 import './App.css';
-import { BrowserRouter, Routes, Route, Navigate} from 'react-router-dom';
+import { BrowserRouter, Routes, Route } from 'react-router-dom';
 import Login from './components/Login';
 import Register from './components/Register';
 import Home from './components/Home';
 import Dog from './components/Dog';
 import {UserCtx, UserCtxT} from './context/UserContext';
 import Qr from './components/Qr';
+import Header from './components/Header';
+import Footer from './components/Footer';
+import Impressum from './components/Impressum';
+import "bootstrap/dist/css/bootstrap.min.css";
+import FileUpload from './components/FileUpload';
 
 
-function App() 
+const App: React.FC = () => 
 {
   const {user} = useContext<UserCtxT | null>(UserCtx) as UserCtxT;
 
@@ -18,17 +23,22 @@ function App()
     <div className="App">
           <div className="col middle">
             <BrowserRouter basename='/dog'>
+              {user && <Header />}
               <Routes>
-                  {user && <Route path="/" element={<Home/>} />}
-                  {!user && <Route path="/" element={<Login/>} />}
+                  {user && <Route index path="/" element={<Home/>} />}
+                  {!user && <Route index path="/" element={<Login/>} />}
                   {user && <Route path="/qr" element={<Qr/>} />}
                   {user && <Route path="/d" element={<Dog/>} />}
                   <Route path="/:qr_id" element={<Dog/>} />
                   <Route path="/login" element={<Login/>} />
                   <Route path="/reg" element={<Register/>} />
+                  <Route path="/impressum" element={<Impressum/>} />
+                  <Route path="/upload" element={<FileUpload/>} />
               </Routes>
+              <Footer/>
             </BrowserRouter>
           </div>
+        
     </div>
   );
 }