From e5bc75c60e3f5a194941932b013e199f95d757d1 Mon Sep 17 00:00:00 2001
From: Alex Santos <alex.santos@klupp.tech>
Date: Mon, 27 Jun 2022 14:57:03 -0300
Subject: [PATCH] update Header

---
 next.config.js                      |  4 ++++
 src/components/header/Header.tsx    | 20 +++++++++++++-------
 src/components/header/HeaderView.ts |  4 +---
 3 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/next.config.js b/next.config.js
index 0c1f043..dee1618 100644
--- a/next.config.js
+++ b/next.config.js
@@ -4,6 +4,10 @@ const nextConfig = {
   compiler: {
     styledComponents: true,
   },
+  images: {
+    domains: ["kluppdevelopment.s3.sa-east-1.amazonaws.com"]
+ }
 }
 
 module.exports = nextConfig
+
diff --git a/src/components/header/Header.tsx b/src/components/header/Header.tsx
index bcb8f28..dba6dd7 100644
--- a/src/components/header/Header.tsx
+++ b/src/components/header/Header.tsx
@@ -27,22 +27,22 @@ function stringToColor(string: string) {
   return color;
 }
 
-function stringAvatar(name: string) {
+function stringAvatar(profile_picture: string) {
   return {
-    sx: {
-      bgcolor: stringToColor(name),
-    },
-    children: `${name.split(' ')[0][0]}`,
+
+    children: `${profile_picture}`,
   };
 }
 
+
 interface headerInterface {
   name: string,
   admin?: boolean | undefined
   logo?: string
+  profile_picture: string
 }
 
-export default function Header({ name, admin, logo }: headerInterface) {
+export default function Header({ name, admin, profile_picture }: headerInterface) {
   return (
     <HeaderView>
       <section>
@@ -60,7 +60,13 @@ export default function Header({ name, admin, logo }: headerInterface) {
             olá, {name}
           </p>
         </div>
-        <Avatar {...stringAvatar(name)} style={{border: 'white solid 4px', width: '47px', height: '47px'}}/>
+        {
+          !admin?
+          <Image src={profile_picture} alt='teste' height={45} width={50} />
+          :
+          null
+        }
+
       </section>
     </HeaderView>
   )
diff --git a/src/components/header/HeaderView.ts b/src/components/header/HeaderView.ts
index d123174..c3a4f2e 100644
--- a/src/components/header/HeaderView.ts
+++ b/src/components/header/HeaderView.ts
@@ -28,12 +28,10 @@ export const HeaderView = styled.header`
     min-width: 120px;
     height: 40px;
 
-    border-radius: 8px 0 0 8px;
+    border-radius: 8px;
 
     background-color: #254F7F;
 
-    transform: translateX(16px);
-
     p{
       color: white;
       margin-left: 15%;