From 9804bd196ba9268f979fe7922ed00ff68783d512 Mon Sep 17 00:00:00 2001
From: Timo Schneider <timoschneider04@gmail.com>
Date: Thu, 13 Jun 2024 08:59:35 +0200
Subject: [PATCH] added refresh and edit button

---
 src/App.js   | 19 +++++++++++++------
 src/App.scss | 25 ++++++++++++++++++++-----
 2 files changed, 33 insertions(+), 11 deletions(-)

diff --git a/src/App.js b/src/App.js
index 851fbb4..ab15b29 100644
--- a/src/App.js
+++ b/src/App.js
@@ -2,7 +2,7 @@ import React, {useEffect, useState} from 'react';
 import NewPostForm from './components/NewPostForm';
 import './App.scss';
 import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
-import {faTimes} from "@fortawesome/free-solid-svg-icons";
+import {faPenToSquare, faRotate, faTimes} from "@fortawesome/free-solid-svg-icons";
 import {postApi} from "./api/posts.api";
 import {locationUtils} from "./utils/location";
 import Post from "./components/Post";
@@ -62,12 +62,19 @@ const App = () => {
 
     return (
         <div className="app">
-            <button className="logout" onClick={() => keycloak.logout()}>Logout</button>
+            <div className="nav-bar">
+                <button className="nav-button" onClick={() => reload()}>
+                    <FontAwesomeIcon className={"close-button"} icon={faRotate}/>
+                </button>
+                <button className="nav-button nav-space" onClick={() => keycloak.accountManagement()}>
+                    <FontAwesomeIcon className={"close-button"} icon={faPenToSquare}/>
+                </button>
+                <button className="logout" onClick={() => keycloak.logout()}>Logout</button>
+            </div>
             <h1>SWA - Jodel</h1>
-
-                <div style={{height: selectedPost?0:"auto", overflowY: "hidden"}}>
-                    <NewPostForm addPost={addPost}/>
-                    {posts.map(post => <Post key={post.id} post={post} recursionDepth={5} selectPost={selectPost} reload={reload} />)}
+            <div style={{height: selectedPost ? 0 : "auto", overflowY: "hidden"}}>
+                <NewPostForm addPost={addPost}/>
+                {posts.map(post => <Post key={post.id} post={post} recursionDepth={5} selectPost={selectPost} reload={reload} />)}
                 </div>
             {selectedPost && (
                 <div className="single-post-view">
diff --git a/src/App.scss b/src/App.scss
index fb90cc7..e63963d 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -267,11 +267,26 @@ button {
   color: #ff9908;
 }
 
-.logout {
-  margin-left: 75%;
-  width: 25%
-}
-
 textarea {
   resize: none;
+}
+
+.nav-bar {
+  display: flex;
+  width: 100%;
+  flex-direction: row;
+}
+
+.nav-button {
+  height: 3em;
+  width: 3em;
+}
+
+.nav-space {
+  margin-left: auto;
+}
+
+.logout {
+  margin-left: 0.5em;
+  width: 25%
 }
\ No newline at end of file