fix: avvvvatars cards

ctrlmais · Apr 9, 2022 · 8afe4f2 · 8afe4f2
1 parent be51047
commit 8afe4f2
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 27 deletions.
diff --git a/src/components/CardBarbeiro/index.tsx b/src/components/CardBarbeiro/index.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react';
 import { BsCalendar, BsClock } from 'react-icons/bs';
 
+import Avvvatars from 'avvvatars-react';
 import { CardBarbeiroProps } from 'types/IComponents';
 
 import { getPhoto } from 'services/get/photo';
@@ -36,21 +37,27 @@ export function CardBarbeiro(props: CardBarbeiroProps) {
   }, [props.barbeiro]);
 
   return (
-    <div className={styles.card} onClick={props.onClick} key={props.barbeiro?.id}>
-      <div className={styles.containerImg}>
-        <img src={photo || props.barbeiro?.avatar_url || props.barbeiro?.picture} alt={props.barbeiro?.nome} />
+    <>
+      <div className={styles.card} onClick={props.onClick} key={props.barbeiro?.id}>
+        <div className={styles.containerImg}>
+          {photo === '' && props.barbeiro?.avatar_url === null ? (
+            <Avvvatars value={props.barbeiro?.nome || ''} size={72} />
+          ) : (
+            <img src={photo || props.barbeiro?.avatar_url || props.barbeiro?.picture} alt={props.barbeiro?.nome} />
+          )}
+        </div>
+        <div className={styles.containerInfo}>
+          <h2 className={styles.title}>{name || props.barbeiro?.nome}</h2>
+          <strong className={styles.info}>
+            <BsCalendar color="#FF9000" size={16} style={{ marginRight: '12px' }} />
+            Segunda à Domingo
+          </strong>
+          <strong className={styles.info}>
+            <BsClock color="#FF9000" size={16} style={{ marginRight: '12px' }} />
+            8h às 22h
+          </strong>
+        </div>
       </div>
-      <div className={styles.containerInfo}>
-        <h2 className={styles.title}>{name || props.barbeiro?.nome}</h2>
-        <strong className={styles.info}>
-          <BsCalendar color="#FF9000" size={16} style={{ marginRight: '12px' }} />
-          Segunda à Domingo
-        </strong>
-        <strong className={styles.info}>
-          <BsClock color="#FF9000" size={16} style={{ marginRight: '12px' }} />
-          8h às 22h
-        </strong>
-      </div>
-    </div>
+    </>
   );
 }
diff --git a/src/components/CardBarbeiroSelect/index.tsx b/src/components/CardBarbeiroSelect/index.tsx
@@ -1,5 +1,6 @@
 import { useEffect, useState } from 'react';
 
+import Avvvatars from 'avvvatars-react';
 import { CardBarbeiroProps } from 'types/IComponents';
 
 import { getPhoto } from 'services/get/photo';
@@ -35,17 +36,23 @@ export function CardBarbeiroSelected(props: CardBarbeiroProps) {
   }, [props.barbeiro]);
 
   return (
-    <div key={props.barbeiro?.id} className={styles.containerCard}>
-      <div className={styles.spacing}>
-        <img
-          src={photo || props.barbeiro?.avatar_url || props.barbeiro?.picture}
-          alt={props.barbeiro?.nome}
-          className={styles.img}
-        />
+    <>
+      <div key={props.barbeiro?.id} className={styles.containerCard}>
+        <div className={styles.spacing}>
+          {photo === '' && props.barbeiro?.avatar_url === null ? (
+            <Avvvatars value={props.barbeiro?.nome || ''} size={38} />
+          ) : (
+            <img
+              src={photo || props.barbeiro?.avatar_url || props.barbeiro?.picture}
+              alt={props.barbeiro?.nome}
+              className={styles.img}
+            />
+          )}
+        </div>
+        <div className={styles.textContainer}>
+          <h2 className={styles.textTitle}>{name || props.barbeiro?.nome}</h2>
+        </div>
       </div>
-      <div className={styles.textContainer}>
-        <h2 className={styles.textTitle}>{name || props.barbeiro?.nome}</h2>
-      </div>
-    </div>
+    </>
   );
 }
diff --git a/src/components/Dropzone/index.tsx b/src/components/Dropzone/index.tsx
@@ -54,7 +54,7 @@ const Dropzone: React.FC<DropzoneProps> = ({ onFileUploaded }) => {
                 />
               </>
             ) : (
-              <Avvvatars value={user?.user_metadata.name || ''} size={100} />
+              <Avvvatars value={user?.user_metadata.name || ''} size={160} />
             )}
           </p>
           <div className={styles.upload}>
-Original file line number
+Diff line change
@@ Expand Up @@
                     />
                   </>
                 ) : (
-                  <Avvvatars value={user?.user_metadata.name || ''} size={100} />
+                  <Avvvatars value={user?.user_metadata.name || ''} size={160} />
                 )}
               </p>
               <div className={styles.upload}>
@@ Expand Down @@