Félkész Login

frontend/peepal_react/src/WC_Komponens/Bejel_Regisz/Bejelentkezes.jsx

@@ -1,4 +1,39 @@
+import React, { useState, useEffect } from 'react';
+
 export default function Bejelentkezes() {
+
+  const [users, setUsers] = useState([]);
+  const fetchUsers = async () => {
+    try {
+      const response = await fetch('/users', {
+        method: 'GET',
+        headers: {
+          'Accept': 'application/json',
+          'Content-Type': 'application/json',
+          // Include the CSRF token for Laravel if your API is protected
+          'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]')?.getAttribute('content'),
+        },
+        credentials: 'include', // Includes cookies in the request
+      });
+      console.log(response)
+
+      if (!response.ok) {
+        throw new Error(`HTTP error! Status: ${response.status}`);
+      }
+
+      const data = await response.json();
+      setUsers(data);
+      console.log(users)
+    } catch (err) {
+      console.log(err)
+    }
+  };
+
+  useEffect(() => {
+    fetchUsers();
+  }, []);
+  
+
     return (
       <div className="flex justify-center items-center min-h-screen bg-gray-100">
         <form className="bg-white p-6 rounded-lg shadow-lg w-80 space-y-4">

frontend/peepal_react/src/WC_Komponens/NavBar/Menusor.jsx

@@ -0,0 +1,58 @@
+import { useState } from "react";
+import { Link } from "react-router-dom";
+import { Menu, X } from "lucide-react";
+
+export default function Menusor() {
+  const [menuOpen, setMenuOpen] = useState(false);
+
+  return (
+    <nav className="bg-yellow-200 text-amber-900 py-4 px-6 flex justify-between items-center shadow-md sticky top-0 w-full z-50">
+      <Link to="/" className="text-2xl font-bold flex items-center">
+        <img src="/Logo.png" alt="PeePal Logo" className="h-14 ml-2 hover:h-15" />
+      </Link>
+
+      {/* Hamburger ikon */}
+      <button
+        className="md:hidden text-amber-900"
+        onClick={() => setMenuOpen(!menuOpen)}
+      >
+        {menuOpen ? <X size={32} /> : <Menu size={32} />}
+      </button>
+
+      {/* Menü */}
+      <ul
+        className={`md:flex md:space-x-6 md:items-center text-lg ${
+          menuOpen
+            ? "absolute top-16 left-0 w-full bg-yellow-200 flex flex-col items-center space-y-4 py-4 shadow-lg"
+            : "hidden md:flex"
+        }`}
+      >
+        <li>
+          <Link
+            to="/kereso"
+            className="hover:bg-yellow-500 px-4 py-2 rounded-lg transition"
+          >
+            Legközelebbi mosdó
+          </Link>
+        </li>
+        <li className="hidden md:block border-l-2 border-amber-800 h-10"></li>
+        <li>
+          <Link
+            to="/bejelentkezes"
+            className="hover:bg-yellow-500 px-4 py-2 rounded-lg transition"
+          >
+            Bejelentkezés
+          </Link>
+        </li>
+        <li>
+          <Link
+            to="/regisztracio"
+            className="hover:bg-yellow-500 px-4 py-2 rounded-lg transition"
+          >
+            Regisztráció
+          </Link>
+        </li>
+      </ul>
+    </nav>
+  );
+}