From 9d0b5fc5e0a4b7c3cd6a67b9f8030704af11e55a Mon Sep 17 00:00:00 2001
From: Royce Ayroso-Ong <royce.ayrosoong@gmail.com>
Date: Mon, 19 Apr 2021 01:54:53 -0400
Subject: [PATCH] Rename blog prop to url in PostAvatar, deal with optional
 value * Changed blog prop to url * Changed prop name to url in other files
 using PostAvatar * Changed PostAvatar to no longer wrapped by an <a> by
 default * Searched for instances of PostAvatar and changed blog prop to url *
 Added extra conditional to check if url is not undefined * Removed url
 defaulting to empty string. Changed the conditional * 'url != undefined'
 changed to 'url !=== undefined' * Changed 'url !== undefined && url?.length >
 0' to 'url?.length'

---
 src/web/src/components/Posts/Post.tsx         |  2 +-
 src/web/src/components/Posts/PostAvatar.tsx   | 22 +++++++++++++------
 src/web/src/components/Posts/PostInfo.tsx     |  2 +-
 .../components/SignUp/Forms/GitHubAccount.tsx |  2 +-
 .../src/components/SignUp/Forms/Review.tsx    |  2 +-
 5 files changed, 19 insertions(+), 11 deletions(-)

diff --git a/src/web/src/components/Posts/Post.tsx b/src/web/src/components/Posts/Post.tsx
index 92186b3783..a7bf8b9c3d 100644
--- a/src/web/src/components/Posts/Post.tsx
+++ b/src/web/src/components/Posts/Post.tsx
@@ -277,7 +277,7 @@ const PostComponent = ({ postUrl }: Props) => {
         {!desktop && (
           <>
             <div className={classes.authorAvatarContainer}>
-              <PostAvatar name={post.feed.author} blog={post.feed.link} />
+              <PostAvatar name={post.feed.author} url={post.feed.link} />
             </div>
             <div className={classes.authorNameContainer}>
               <h1 className={classes.author}>
diff --git a/src/web/src/components/Posts/PostAvatar.tsx b/src/web/src/components/Posts/PostAvatar.tsx
index 9b3a597adb..3022aad8f4 100644
--- a/src/web/src/components/Posts/PostAvatar.tsx
+++ b/src/web/src/components/Posts/PostAvatar.tsx
@@ -4,7 +4,7 @@ import { makeStyles } from '@material-ui/core/styles';
 type AvatarProps = {
   name: string;
   img?: string;
-  blog?: string;
+  url?: string;
 };
 
 const useStyles = makeStyles((theme: Theme) =>
@@ -39,7 +39,7 @@ const useStyles = makeStyles((theme: Theme) =>
   })
 );
 
-const PostAvatar = ({ name, img, blog = '' }: AvatarProps) => {
+const PostAvatar = ({ name, img, url }: AvatarProps) => {
   const classes = useStyles();
 
   if (img) {
@@ -58,11 +58,19 @@ const PostAvatar = ({ name, img, blog = '' }: AvatarProps) => {
       )
       .join('');
     return (
-      <a href={blog} className={classes.link}>
-        <Avatar className={classes.avatar}>
-          <p className={classes.text}>{initials}</p>
-        </Avatar>
-      </a>
+      <div>
+        {url?.length ? (
+          <a href={url} className={classes.link}>
+            <Avatar className={classes.avatar}>
+              <p className={classes.text}>{initials}</p>
+            </Avatar>
+          </a>
+        ) : (
+          <Avatar className={classes.avatar}>
+            <p className={classes.text}>{initials}</p>
+          </Avatar>
+        )}
+      </div>
     );
   }
 
diff --git a/src/web/src/components/Posts/PostInfo.tsx b/src/web/src/components/Posts/PostInfo.tsx
index a844a850ff..9e0ad750ea 100644
--- a/src/web/src/components/Posts/PostInfo.tsx
+++ b/src/web/src/components/Posts/PostInfo.tsx
@@ -76,7 +76,7 @@ const PostDesktopInfo = ({ authorName, postDate, blogUrl, postUrl }: Props) => {
   return (
     <ListSubheader className={classes.root}>
       <div className={classes.authorAvatarContainer}>
-        <PostAvatar name={authorName} blog={blogUrl} />
+        <PostAvatar name={authorName} url={blogUrl} />
       </div>
       <div className={classes.authorNameContainer}>
         <p className={classes.author}>
diff --git a/src/web/src/components/SignUp/Forms/GitHubAccount.tsx b/src/web/src/components/SignUp/Forms/GitHubAccount.tsx
index 93a55b8cf2..8266f75beb 100644
--- a/src/web/src/components/SignUp/Forms/GitHubAccount.tsx
+++ b/src/web/src/components/SignUp/Forms/GitHubAccount.tsx
@@ -171,7 +171,7 @@ const GitHubAccount = connect<{}, SignUpForm>((props) => {
             <div className={classes.avatarPreview}>
               <PostAvatar
                 name={values.github.username || values.displayName}
-                blog={values.github.avatarUrl}
+                url={values.github.avatarUrl}
                 img={values.github?.avatarUrl}
               />
               <h2 className={classes.username}>{values.github.username}</h2>
diff --git a/src/web/src/components/SignUp/Forms/Review.tsx b/src/web/src/components/SignUp/Forms/Review.tsx
index 0c2e430e5a..96027e89e3 100644
--- a/src/web/src/components/SignUp/Forms/Review.tsx
+++ b/src/web/src/components/SignUp/Forms/Review.tsx
@@ -101,7 +101,7 @@ const Review = connect<{}, SignUpForm>((props) => {
         <h1 className={classes.titlePage}>Review your Information</h1>
         <div className={classes.contentContainer}>
           <div className={classes.avatar}>
-            <PostAvatar name={displayName} blog={blogUrl} img={github.avatarUrl} />
+            <PostAvatar name={displayName} url={blogUrl} img={github.avatarUrl} />
             <h2>{displayName}</h2>
           </div>
           <div className={classes.senecaBlogInfo}>