From 3db5311c7f1d7f5ec2b0e4ae60c1227df5356409 Mon Sep 17 00:00:00 2001
From: KOSASIH <kosasihg88@gmail.com>
Date: Wed, 7 Aug 2024 22:42:41 +0700
Subject: [PATCH] Create Header.js

---
 .../PiWalletBot/client/components/Header.js   | 27 +++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 projects/PiWalletBot/client/components/Header.js

diff --git a/projects/PiWalletBot/client/components/Header.js b/projects/PiWalletBot/client/components/Header.js
new file mode 100644
index 000000000..50549942d
--- /dev/null
+++ b/projects/PiWalletBot/client/components/Header.js
@@ -0,0 +1,27 @@
+import React from 'react';
+import styled from 'styled-components';
+import { useAuth } from '../context/auth';
+
+const HeaderContainer = styled.header`
+  background-color: #333;
+  color: #fff;
+  padding: 20px;
+  text-align: center;
+`;
+
+const Header = () => {
+  const auth = useAuth();
+
+  return (
+    <HeaderContainer>
+      <h1>Pi Wallet Bot</h1>
+      {auth.isLoggedIn ? (
+        <p>Welcome, {auth.user.username}!</p>
+      ) : (
+        <p>You are not logged in.</p>
+      )}
+    </HeaderContainer>
+  );
+};
+
+export default Header;