From 49b78da6004879c17d4a22435a450671559a9f9b Mon Sep 17 00:00:00 2001
From: andrei <andrei@duvakin.ru>
Date: Sat, 5 Oct 2024 10:25:45 +0500
Subject: [PATCH] ._.

---
 src/App.jsx               |  2 ++
 src/components/Header.jsx | 51 +++++++++++++++++++++++++++++++++++++++
 2 files changed, 53 insertions(+)
 create mode 100644 src/components/Header.jsx

diff --git a/src/App.jsx b/src/App.jsx
index ab39322..3b2e586 100755
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -2,12 +2,14 @@ import React from "react";
 import RoutesComponent from "./AppRouter.jsx";
 import { AuthProvider } from "./AuthContext.jsx";
 import { BrowserRouter as Router } from "react-router-dom";
+import Header from "./components/Header.jsx";
 
 const App = () => {
   return (
     <Router>
       <AuthProvider>
         <div>
+          <Header />
           <RoutesComponent />
         </div>
       </AuthProvider>
diff --git a/src/components/Header.jsx b/src/components/Header.jsx
new file mode 100644
index 0000000..55f4db9
--- /dev/null
+++ b/src/components/Header.jsx
@@ -0,0 +1,51 @@
+import React from "react";
+import { Link, useNavigate } from "react-router-dom";
+import { useAuth } from "../AuthContext";
+
+const Header = () => {
+  const { isAuthenticated, logout } = useAuth();
+  const navigate = useNavigate();
+
+  const handleLogout = () => {
+    logout();
+    navigate("/login");
+  };
+
+  return (
+    <header className="navbar navbar-expand-lg navbar-light bg-light">
+      <div className="container-fluid">
+        <Link className="navbar-brand" to="/">
+          My App
+        </Link>
+        <div className="collapse navbar-collapse">
+          <ul className="navbar-nav me-auto">
+            <li className="nav-item">
+              <Link className="nav-link" to="/">
+                Home
+              </Link>
+            </li>
+            <li className="nav-item">
+              <Link className="nav-link" to="/accessories">
+                Accessories
+              </Link>
+            </li>
+            {/* Добавьте другие ссылки, если необходимо */}
+          </ul>
+          <div className="d-flex">
+            {isAuthenticated ? (
+              <button className="btn btn-outline-danger" onClick={handleLogout}>
+                Logout
+              </button>
+            ) : (
+              <Link className="btn btn-outline-primary" to="/login">
+                Login
+              </Link>
+            )}
+          </div>
+        </div>
+      </div>
+    </header>
+  );
+};
+
+export default Header;