From 88a000562667c523df81c7e649d14197b91c1c3f Mon Sep 17 00:00:00 2001
From: MIKIBUR <mikibur@wp.pl>
Date: Fri, 26 Apr 2024 18:28:32 +0200
Subject: [PATCH] User Bar (#38)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Mikołaj Burdzy <m.burdzy@odo24.pl>
---
 package.json                              |  2 +-
 src/App.js                                |  3 ++
 src/Tournaments/TournamentNav.js          | 10 -----
 src/Tournaments/TournamentsLeaderboard.js |  9 +++--
 src/User/UserButtons.js                   | 47 +++++++++++++++++++++++
 src/User/UserButtons.scss                 | 34 ++++++++++++++++
 src/lists/TournamentsList.js              | 22 ++---------
 src/resources/logout.svg                  | 12 ++++++
 src/resources/settings.svg                |  5 +++
 src/resources/user.svg                    |  5 +++
 10 files changed, 115 insertions(+), 34 deletions(-)
 create mode 100644 src/User/UserButtons.js
 create mode 100644 src/User/UserButtons.scss
 create mode 100644 src/resources/logout.svg
 create mode 100644 src/resources/settings.svg
 create mode 100644 src/resources/user.svg

diff --git a/package.json b/package.json
index f55d068..3385fa1 100644
--- a/package.json
+++ b/package.json
@@ -20,7 +20,7 @@
     "sass": "^1.69.5",
     "web-vitals": "^2.1.4"
   },
-  "proxy": "http://localhost:8080/",
+  "proxy": "http://10.242.93.198:8080/",
   "scripts": {
     "start": "react-scripts start",
     "build": "react-scripts build",
diff --git a/src/App.js b/src/App.js
index 6fe8923..9d78e0e 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,10 +1,13 @@
 import './App.scss'
 import User from "./User/User";
 import {Link} from "react-router-dom";
+import UserButtons from './User/UserButtons';
 
 function App() {
     return (
         <div className="app">
+            <UserButtons/>
+
             <div className="title">
                 <h1>Bot-Wars</h1>
                 <div className="login-btns">
diff --git a/src/Tournaments/TournamentNav.js b/src/Tournaments/TournamentNav.js
index f36a5d0..2d23a43 100644
--- a/src/Tournaments/TournamentNav.js
+++ b/src/Tournaments/TournamentNav.js
@@ -8,16 +8,6 @@ import { connect } from 'react-redux';
 function TournamentNav({ isAuthenticated }) {
     return (
         <>
-            <div className="user-info-strip">
-                <div className="userData">
-                    <Link to="/">  <span className="username">Username</span> </Link>
-                    <span className="score">1234</span>
-                </div>
-                <div className="icons">
-                    {/* <i className="icon-settings"></i> */}
-                    <span className="score">set</span>
-                </div>
-            </div>
             <nav className="tournament-nav">
                 <NavLink exact className="menu-btn" activeClassName="active" to="/tournaments/home">
                     <button className="btn">Tournaments</button>
diff --git a/src/Tournaments/TournamentsLeaderboard.js b/src/Tournaments/TournamentsLeaderboard.js
index 1975ae8..71eb1da 100644
--- a/src/Tournaments/TournamentsLeaderboard.js
+++ b/src/Tournaments/TournamentsLeaderboard.js
@@ -1,13 +1,14 @@
 import TournamentNav from './TournamentNav';
 import { connect } from 'react-redux';
+import UserButtons from "../User/UserButtons";
+import Leaderboard from "./leaderboard";
 
 function TournamentsLeaderboard({ tournaments, isAuthenticated }) {
     return (
         <div className="tournaments-container">
-
-            <TournamentNav /> 
-
-            <h1>Leaderboard</h1>            
+            <UserButtons></UserButtons>
+            <TournamentNav />
+            <Leaderboard></Leaderboard>
         </div>
     );
 }
diff --git a/src/User/UserButtons.js b/src/User/UserButtons.js
new file mode 100644
index 0000000..2e17304
--- /dev/null
+++ b/src/User/UserButtons.js
@@ -0,0 +1,47 @@
+import '../App.scss'
+import './UserButtons.scss';
+import logoutIcon from '../resources/logout.svg';
+import userIcon from '../resources/user.svg';
+import settingsIcon from '../resources/settings.svg';
+import { connect } from 'react-redux';
+import { login, logout } from './actions';
+import {Link} from "react-router-dom";
+
+function UserButtons({ isAuthenticated, user, login, logout }) {
+    //takie chwilowe bo nie ma jak z bakcu pobrać loginu i elo bo oba są querowane po player_id którego nie mamy, issue do omówienia na spotkaniu
+    const huj = '{'
+    const huj1 = '}'
+    return (
+        <>
+        {isAuthenticated ? (
+        <div className="user-bar">
+          <div>{huj}Login{huj1} {huj}Elo{huj1}</div>
+          <div className="user-buttons-container">
+            <Link to="/settings">
+                <img className="user-button setting-button" src={settingsIcon} alt="S"></img>
+            </Link>
+            <Link to="/player/1">
+                <img className="user-button" src={userIcon} alt="U"></img>
+            </Link>
+            <Link to="/">
+                <img className="user-button" src={logoutIcon} alt="U" onClick={logout}></img>
+            </Link>
+          </div>
+        </div>
+        ) : (
+        <>
+        
+        </>
+        )}
+        </>
+    );
+  }
+
+const mapStateToProps = (state) => ({
+    isAuthenticated: state.isAuthenticated,
+    user: state.user,
+  });
+  
+const mapDispatchToProps = {login,logout,};
+
+export default connect(mapStateToProps, mapDispatchToProps)(UserButtons);
\ No newline at end of file
diff --git a/src/User/UserButtons.scss b/src/User/UserButtons.scss
new file mode 100644
index 0000000..0c6a58c
--- /dev/null
+++ b/src/User/UserButtons.scss
@@ -0,0 +1,34 @@
+.user-bar{
+    display: flex;
+    justify-content: space-between;
+    border-bottom: 3px solid #24da00;
+    width: 100vw;
+    margin-left: -15px;
+    padding: 10px 25px 15px 20px;
+    align-items: center;
+
+    .user-buttons-container{
+        display: flex;
+        justify-content: flex-end;
+        a{    display: flex;
+            align-items: center;}
+        
+        .user-button{
+            width: 65px;
+            height: 65px;
+            padding: 6px;
+            margin-right: 10px;
+            border-radius: 50%;
+            border: 2px solid #24da00;
+            text-align: center;
+        }
+        .setting-button{
+            padding:0;
+        }
+    }
+}
+@media (max-width:578px) {
+    .user-bar{flex-direction: column;
+    gap: 20px;
+    }
+}
\ No newline at end of file
diff --git a/src/lists/TournamentsList.js b/src/lists/TournamentsList.js
index 2ee2149..9e0c9ea 100644
--- a/src/lists/TournamentsList.js
+++ b/src/lists/TournamentsList.js
@@ -1,18 +1,15 @@
 import './TournamentList.scss';
 import DeleteTournamentButton from './DeleteTournamentButton';
 import TournamentNav from '../Tournaments/TournamentNav';
-import { useNavigate } from 'react-router-dom';
-import { Link } from 'react-router-dom';
+import UserButtons from '../User/UserButtons';
+import {Link, useNavigate} from 'react-router-dom';
 import { connect } from 'react-redux';
 import { TournamentService } from "../services/TournamentService";
 import React, { useState, useEffect } from "react";
 
-
-
 function TournamentsList({ tournaments, isAuthenticated }) {
     const navigate = useNavigate();
     const currentDate = new Date();
-
     const [tournamentList, setTournamentList] = useState([]);
     const [message, setMessage] = useState('');
 
@@ -54,29 +51,21 @@ function TournamentsList({ tournaments, isAuthenticated }) {
 
     return (
         <div className="tournaments-container">
-
+            <UserButtons/>
             <TournamentNav/>
-
-
             <div className="tournaments-box">
                 <h1>Upcoming Tournaments</h1>
-
                 {isAuthenticated && (
                         <Link className="menu-btn" activeClassName="active" to="/tournaments/add">
-
                             <button className="btn">Add Your Tournament</button>
-
                         </Link>
-                        
                     )}
-
                 <div className="tournament-headers">
                     <span className="header-detail">Name</span>
                     <span className="header-detail">Author</span>
                     <span className="header-detail">Date</span>
                     <span className="header-detail">Action</span>
                 </div>
-
                 <div className="tournaments-content">
                     {upcomingTournaments.map(tournament => (
                         <div>
@@ -84,7 +73,6 @@ function TournamentsList({ tournaments, isAuthenticated }) {
                         <DeleteTournamentButton key={tournament.id} />
                         </div>
                     ))}
-
                     {upcomingTournaments.map(tournament => (
                         <TournamentItem key={tournament.id} tournament={tournament} />
                     ))}
@@ -96,16 +84,12 @@ function TournamentsList({ tournaments, isAuthenticated }) {
                     <span className="header-detail">Date</span>
                     <span className="header-detail">Action</span>
                 </div>
-
-                
-
                 <div className="tournaments-content">
                     {pastTournaments.map(tournament => (
                         <TournamentItem key={tournament.id} tournament={tournament} />
                     ))}
                 </div>
             </div>
-
             <p>{message}</p>
         </div>
     );
diff --git a/src/resources/logout.svg b/src/resources/logout.svg
new file mode 100644
index 0000000..9d820d5
--- /dev/null
+++ b/src/resources/logout.svg
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg fill="#24da00" height="800px" width="800px" version="1.1" id="Icons" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
+	 viewBox="0 0 32 32" xml:space="preserve">
+<path d="M30.9,13.6c-0.1-0.1-0.1-0.2-0.2-0.3l-4-4c-0.4-0.4-1-0.4-1.4,0s-0.4,1,0,1.4l2.3,2.3H22v-3V3c0-0.6-0.4-1-1-1H4
+	c0,0,0,0,0,0C3.9,2,3.7,2,3.6,2.1c0,0,0,0-0.1,0c0,0-0.1,0-0.1,0.1c0,0-0.1,0.1-0.1,0.1c0,0,0,0,0,0C3.2,2.4,3.1,2.5,3.1,2.6
+	c0,0,0,0,0,0.1C3,2.8,3,2.9,3,3v22c0,0.4,0.2,0.8,0.6,0.9l9,4C12.7,30,12.9,30,13,30c0.2,0,0.4-0.1,0.5-0.2c0.3-0.2,0.5-0.5,0.5-0.8
+	v-3h7c0.6,0,1-0.4,1-1V15h5.6l-2.3,2.3c-0.4,0.4-0.4,1,0,1.4c0.2,0.2,0.5,0.3,0.7,0.3s0.5-0.1,0.7-0.3l4-4c0.1-0.1,0.2-0.2,0.2-0.3
+	C31,14.1,31,13.9,30.9,13.6z M10,21c0,0.6-0.4,1-1,1s-1-0.4-1-1v-4c0-0.6,0.4-1,1-1s1,0.4,1,1V21z M20,10v14h-6V7
+	c0-0.4-0.2-0.8-0.6-0.9L8.7,4H20V10z"/>
+</svg>
\ No newline at end of file
diff --git a/src/resources/settings.svg b/src/resources/settings.svg
new file mode 100644
index 0000000..c07d317
--- /dev/null
+++ b/src/resources/settings.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 14.93C11.4205 14.93 10.854 14.7582 10.3722 14.4362C9.89035 14.1143 9.51481 13.6567 9.29304 13.1213C9.07128 12.5859 9.01325 11.9968 9.12631 11.4284C9.23936 10.86 9.51842 10.338 9.92819 9.92819C10.338 9.51842 10.86 9.23936 11.4284 9.12631C11.9968 9.01325 12.5859 9.07128 13.1213 9.29304C13.6567 9.51481 14.1143 9.89035 14.4362 10.3722C14.7582 10.854 14.93 11.4205 14.93 12C14.93 12.7771 14.6213 13.5224 14.0718 14.0718C13.5224 14.6213 12.7771 14.93 12 14.93ZM12 10.57C11.7172 10.57 11.4407 10.6539 11.2055 10.811C10.9704 10.9681 10.7871 11.1915 10.6789 11.4528C10.5706 11.7141 10.5423 12.0016 10.5975 12.279C10.6527 12.5564 10.7889 12.8112 10.9888 13.0112C11.1888 13.2112 11.4436 13.3474 11.721 13.4025C11.9984 13.4577 12.2859 13.4294 12.5472 13.3212C12.8085 13.2129 13.0319 13.0296 13.189 12.7945C13.3461 12.5593 13.43 12.2828 13.43 12C13.43 11.6207 13.2793 11.257 13.0112 10.9888C12.743 10.7207 12.3793 10.57 12 10.57Z" fill="#24da00"/>
+<path d="M12.06 20.75C11.7676 20.7487 11.4784 20.6896 11.2089 20.5762C10.9394 20.4628 10.6949 20.2973 10.4896 20.0892C10.2842 19.881 10.122 19.6344 10.0123 19.3634C9.90252 19.0924 9.84737 18.8024 9.85001 18.51C9.84606 18.4198 9.81676 18.3326 9.76546 18.2583C9.71416 18.184 9.64295 18.1257 9.56001 18.09C9.46824 18.0479 9.36604 18.034 9.26634 18.05C9.16665 18.066 9.07396 18.1112 9.00001 18.18C8.58482 18.592 8.02493 18.8253 7.44001 18.83C6.8514 18.8338 6.28454 18.6077 5.86001 18.2C5.6538 17.9938 5.49022 17.7491 5.37861 17.4797C5.26701 17.2103 5.20956 16.9216 5.20956 16.63C5.20956 16.3384 5.26701 16.0497 5.37861 15.7803C5.49022 15.5109 5.6538 15.2662 5.86001 15.06C5.93053 14.9957 5.98119 14.9126 6.006 14.8205C6.0308 14.7283 6.02873 14.631 6.00001 14.54C5.95128 14.4556 5.88137 14.3854 5.79719 14.3363C5.71301 14.2872 5.61747 14.2609 5.52001 14.26C4.93163 14.2577 4.36714 14.027 3.94554 13.6166C3.52393 13.2062 3.27815 12.6481 3.26001 12.06C3.26132 11.7685 3.32004 11.48 3.43282 11.2112C3.5456 10.9424 3.71022 10.6984 3.9173 10.4931C4.12437 10.2879 4.36984 10.1255 4.63969 10.0152C4.90953 9.9048 5.19847 9.84868 5.49001 9.85C5.5802 9.84605 5.66746 9.81675 5.74175 9.76545C5.81604 9.71415 5.87436 9.64294 5.91001 9.56C5.95213 9.46823 5.96606 9.36603 5.95004 9.26633C5.93402 9.16664 5.88876 9.07395 5.82001 9C5.40797 8.58481 5.17468 8.02492 5.17001 7.44C5.1649 7.14801 5.21797 6.85792 5.32613 6.58665C5.4343 6.31538 5.59539 6.06836 5.80001 5.86C6.00616 5.65379 6.25092 5.49021 6.52031 5.3786C6.78969 5.267 7.07842 5.20955 7.37001 5.20955C7.6616 5.20955 7.95033 5.267 8.21971 5.3786C8.4891 5.49021 8.73385 5.65379 8.94001 5.86C9.01201 5.9285 9.10041 5.97735 9.19672 6.00187C9.29303 6.02638 9.39402 6.02574 9.49001 6C9.57752 5.95207 9.65169 5.88308 9.70582 5.79927C9.75995 5.71546 9.79232 5.61947 9.80001 5.52C9.79973 4.92989 10.0293 4.36287 10.4399 3.93912C10.8506 3.51537 11.4102 3.2682 12 3.25C12.2915 3.25261 12.5797 3.31263 12.8481 3.42662C13.1164 3.5406 13.3597 3.70633 13.564 3.91434C13.7682 4.12234 13.9296 4.36855 14.0387 4.63891C14.1478 4.90926 14.2026 5.19846 14.2 5.49C14.2038 5.5815 14.2317 5.67038 14.2809 5.74764C14.33 5.8249 14.3987 5.88781 14.48 5.93C14.5683 5.96241 14.6639 5.96927 14.7558 5.94982C14.8478 5.93036 14.9324 5.88537 15 5.82C15.4152 5.40796 15.9751 5.17467 16.56 5.17C16.8525 5.16083 17.1438 5.21204 17.4156 5.32044C17.6875 5.42883 17.9341 5.59208 18.14 5.8C18.3462 6.00615 18.5098 6.25091 18.6214 6.5203C18.733 6.78968 18.7905 7.07841 18.7905 7.37C18.7905 7.66159 18.733 7.95032 18.6214 8.2197C18.5098 8.48909 18.3462 8.73385 18.14 8.94C18.0767 9.01489 18.0333 9.10463 18.0141 9.20082C17.9949 9.29701 18.0003 9.3965 18.03 9.49C18.0779 9.57751 18.1469 9.65168 18.2307 9.70581C18.3145 9.75994 18.4105 9.79231 18.51 9.8C19.0949 9.80745 19.6544 10.0404 20.0717 10.4503C20.489 10.8602 20.732 11.4153 20.75 12C20.7474 12.2915 20.6874 12.5797 20.5734 12.848C20.4594 13.1164 20.2937 13.3597 20.0857 13.5639C19.8777 13.7682 19.6315 13.9296 19.3611 14.0387C19.0907 14.1478 18.8015 14.2026 18.51 14.2C18.4185 14.2038 18.3296 14.2317 18.2524 14.2809C18.1751 14.33 18.1122 14.3987 18.07 14.48C18.0376 14.5683 18.0307 14.6638 18.0502 14.7558C18.0696 14.8478 18.1146 14.9324 18.18 15C18.5921 15.4152 18.8253 15.9751 18.83 16.56C18.8351 16.852 18.782 17.1421 18.6739 17.4133C18.5657 17.6846 18.4046 17.9316 18.2 18.14C17.9939 18.3462 17.7491 18.5098 17.4797 18.6214C17.2103 18.733 16.9216 18.7904 16.63 18.7904C16.3384 18.7904 16.0497 18.733 15.7803 18.6214C15.5109 18.5098 15.2662 18.3462 15.06 18.14C14.9924 18.0746 14.9078 18.0296 14.8158 18.0102C14.7239 17.9907 14.6283 17.9976 14.54 18.03C14.4556 18.0787 14.3854 18.1486 14.3363 18.2328C14.2872 18.317 14.2609 18.4125 14.26 18.51C14.2526 19.0949 14.0196 19.6544 13.6097 20.0717C13.1998 20.489 12.6447 20.732 12.06 20.75ZM9.35001 16.54C9.61524 16.5369 9.87797 16.5915 10.12 16.7C10.4772 16.8489 10.7835 17.0982 11.0018 17.4177C11.2202 17.7372 11.3411 18.1131 11.35 18.5C11.3472 18.6929 11.4199 18.8792 11.5525 19.0193C11.6852 19.1594 11.8673 19.2422 12.06 19.25C12.2527 19.2348 12.4324 19.1466 12.5625 19.0036C12.6925 18.8605 12.7632 18.6733 12.76 18.48C12.7624 18.0918 12.8744 17.7121 13.0832 17.3848C13.292 17.0575 13.589 16.7958 13.94 16.63C14.3052 16.4781 14.7072 16.4379 15.0952 16.5144C15.4832 16.5909 15.8399 16.7808 16.12 17.06C16.2526 17.1926 16.4325 17.2671 16.62 17.2671C16.8075 17.2671 16.9874 17.1926 17.12 17.06C17.2526 16.9274 17.3271 16.7475 17.3271 16.56C17.3271 16.3725 17.2526 16.1926 17.12 16.06C16.8425 15.7788 16.6545 15.4216 16.5798 15.0336C16.505 14.6456 16.5469 14.2442 16.7 13.88C16.8577 13.5291 17.1133 13.2311 17.4362 13.0218C17.759 12.8126 18.1353 12.7008 18.52 12.7C18.7103 12.7028 18.8941 12.6311 19.0323 12.5004C19.1705 12.3696 19.2522 12.1901 19.26 12C19.2472 11.8064 19.1597 11.6253 19.0162 11.4947C18.8726 11.3642 18.684 11.2944 18.49 11.3C18.0986 11.2894 17.7179 11.1695 17.391 10.9539C17.0641 10.7383 16.804 10.4356 16.64 10.08C16.4903 9.71114 16.4513 9.30669 16.5277 8.91602C16.604 8.52535 16.7925 8.16536 17.07 7.88C17.1357 7.81434 17.1878 7.73639 17.2233 7.6506C17.2588 7.56481 17.2771 7.47286 17.2771 7.38C17.2771 7.28714 17.2588 7.19519 17.2233 7.1094C17.1878 7.02361 17.1357 6.94566 17.07 6.88C17.0043 6.81434 16.9264 6.76225 16.8406 6.72672C16.7548 6.69118 16.6629 6.67289 16.57 6.67289C16.4772 6.67289 16.3852 6.69118 16.2994 6.72672C16.2136 6.76225 16.1357 6.81434 16.07 6.88C15.7889 7.14113 15.4385 7.31587 15.0608 7.38337C14.6831 7.45088 14.2939 7.4083 13.9397 7.26072C13.5855 7.11314 13.2812 6.86679 13.0632 6.55105C12.8452 6.2353 12.7226 5.86351 12.71 5.48C12.7128 5.28976 12.6412 5.10595 12.5104 4.96773C12.3797 4.82951 12.2001 4.7478 12.01 4.74C11.8164 4.75286 11.6353 4.84026 11.5047 4.98385C11.3742 5.12744 11.3044 5.31603 11.31 5.51C11.2994 5.90145 11.1795 6.28212 10.9639 6.60903C10.7483 6.93593 10.4456 7.19605 10.09 7.36C9.72115 7.50966 9.3167 7.54869 8.92603 7.47233C8.53536 7.39598 8.17537 7.20753 7.89001 6.93C7.82435 6.86434 7.7464 6.81225 7.66061 6.77672C7.57482 6.74118 7.48287 6.72289 7.39001 6.72289C7.29715 6.72289 7.2052 6.74118 7.11941 6.77672C7.03362 6.81225 6.95567 6.86434 6.89001 6.93C6.82435 6.99566 6.77226 7.07361 6.73673 7.1594C6.70119 7.24519 6.6829 7.33714 6.6829 7.43C6.6829 7.52286 6.70119 7.61481 6.73673 7.7006C6.77226 7.78639 6.82435 7.86434 6.89001 7.93C7.16585 8.21235 7.35197 8.57002 7.42493 8.95795C7.49789 9.34588 7.45443 9.74673 7.30001 10.11C7.15113 10.4672 6.90183 10.7735 6.58234 10.9918C6.26284 11.2101 5.88687 11.3311 5.50001 11.34C5.30712 11.3372 5.12077 11.4099 4.98067 11.5425C4.84058 11.6752 4.75781 11.8572 4.75001 12.05C4.76525 12.2427 4.85336 12.4224 4.99641 12.5525C5.13947 12.6825 5.3267 12.7531 5.52001 12.75C5.90823 12.7524 6.28788 12.8644 6.6152 13.0732C6.94251 13.282 7.20417 13.579 7.37001 13.93C7.52192 14.2952 7.56215 14.6972 7.48561 15.0852C7.40907 15.4732 7.2192 15.8299 6.94001 16.11C6.87435 16.1757 6.82226 16.2536 6.78673 16.3394C6.75119 16.4252 6.7329 16.5171 6.7329 16.61C6.7329 16.7029 6.75119 16.7948 6.78673 16.8806C6.82226 16.9664 6.87435 17.0443 6.94001 17.11C7.00567 17.1757 7.08362 17.2277 7.16941 17.2633C7.2552 17.2988 7.34715 17.3171 7.44001 17.3171C7.53287 17.3171 7.62482 17.2988 7.71061 17.2633C7.7964 17.2277 7.87435 17.1757 7.94001 17.11C8.3201 16.7471 8.82451 16.5432 9.35001 16.54Z" fill="#24da00"/>
+</svg>
\ No newline at end of file
diff --git a/src/resources/user.svg b/src/resources/user.svg
new file mode 100644
index 0000000..8c6e9b2
--- /dev/null
+++ b/src/resources/user.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="600px" height="600px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16 7C16 9.20914 14.2091 11 12 11C9.79086 11 8 9.20914 8 7C8 4.79086 9.79086 3 12 3C14.2091 3 16 4.79086 16 7Z" stroke="#24da00" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M12 14C8.13401 14 5 17.134 5 21H19C19 17.134 15.866 14 12 14Z" stroke="#24da00" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
\ No newline at end of file