diff --git a/client/src/components/profile/Profile.js b/client/src/components/profile/Profile.js index 87961492ae..5e37013df6 100644 --- a/client/src/components/profile/Profile.js +++ b/client/src/components/profile/Profile.js @@ -50,78 +50,46 @@ const propTypes = { }) }; -function TakeMeToTheChallenges() { - return Take me to the Challenges; -} - -function renderIsLocked(username, isSessionUser) { - return ( +function renderMessage(isSessionUser, username) { + return isSessionUser ? ( - - Profile | freeCodeCamp.org - - - - {isSessionUser - ? renderSettingsButton() - : renderReportUserButton(username)} - -

- {username} has not made their profile public. -

-
- -

- {username} needs to change their privacy setting in order for you to - view their profile -

-
- - - - -
+ +

You have not made your profile public.

+
+ +

+ You need to change your privacy setting in order for your profile to + be seen by others. This is a preview of how your profile will look + when made public. +

+
+ +
+ ) : ( + + +

+ {username} has not made their profile public. +

+
+ +

+ {username} needs to change their privacy setting in order for you to + view their profile. +

+
+ + + Take me to the Challenges + +
); } -function renderSettingsButton() { - return ( - - - - - Update my settings - - - - - - ); -} - -function renderReportUserButton(username) { - return ( - - - - - Report This User - - - - - - ); -} - -function Profile({ user, isSessionUser }) { +function renderProfile(user) { const { profileUI: { - isLocked = true, showAbout = false, showCerts = false, showHeatMap = false, @@ -152,42 +120,67 @@ function Profile({ user, isSessionUser }) { yearsTopContributor } = user; - if (isLocked) { - return renderIsLocked(username, isSessionUser); - } + return ( + + + {showHeatMap ? : null} + {showCerts ? : null} + {showPortfolio ? : null} + {showTimeLine ? ( + + ) : null} + + + ); +} + +function Profile({ user, isSessionUser }) { + const { + profileUI: { isLocked = true }, + username + } = user; + return ( Profile | freeCodeCamp.org - + - {isSessionUser - ? renderSettingsButton() - : renderReportUserButton(username)} - - {showHeatMap ? : null} - {showCerts ? : null} - {showPortfolio ? : null} - {showTimeLine ? ( - + {isSessionUser ? ( + + + + Update my settings + + + ) : null} + + {isLocked ? renderMessage(isSessionUser, username) : null} + {!isLocked || isSessionUser ? renderProfile(user) : null} + {isSessionUser ? null : ( + + Report This User + + )} + ); diff --git a/client/src/components/profile/__snapshots__/Profile.test.js.snap b/client/src/components/profile/__snapshots__/Profile.test.js.snap index 7427393430..df36f548fa 100644 --- a/client/src/components/profile/__snapshots__/Profile.test.js.snap +++ b/client/src/components/profile/__snapshots__/Profile.test.js.snap @@ -2,15 +2,6 @@ exports[` renders correctly 1`] = ` Array [ -
,
-
-
- - Report This User - -
-
-

+
+ +
, ] `;