1 files changed, 31 insertions, 0 deletions
diff --git a/frontend/src/components/Header.tsx b/frontend/src/components/Header.tsx
new file mode 100644
index 0000000..b9a51b8
--- /dev/null
+++ b/frontend/src/components/Header.tsx
@@ -0,0 +1,31 @@
+import "../styles/button.css";
+import "../styles/header.css";
+import Logo from "./Logo";
+import userIcon from "../assets/user-icon.svg";
+import type { AuthorizedUser } from "../types/login";
+
+type Props = {
+    user: AuthorizedUser;
+    logout: () => Promise<void>;
+};
+
+function Header({ user, logout }: Props) {
+    return (
+        <header className="header">
+            <Logo />
+
+            <div className="header-user">
+                <span className="header-user-info">
+                    <img src={userIcon} alt="User Icon" />
+                    <p>{user?.email}</p>
+                </span>
+
+                <button className="btn btn-stop btn-logout" onClick={logout}>
+                    Logout
+                </button>
+            </div>
+        </header>
+    );
+}
+
+export default Header;