diff --git a/src/profile/ProfilePage.jsx b/src/profile/ProfilePage.jsx index 52a52faac..d0c8ae27c 100644 --- a/src/profile/ProfilePage.jsx +++ b/src/profile/ProfilePage.jsx @@ -178,6 +178,7 @@ class ProfilePage extends React.Component { visibilityLearningGoal, languageProficiencies, visibilityLanguageProficiencies, + courseCertificates, visibilityCourseCertificates, bio, visibilityBio, @@ -196,6 +197,17 @@ class ProfilePage extends React.Component { changeHandler: this.handleChange, }; + const isBlockVisible = (blockInfo) => this.isAuthenticatedUserProfile() + || (!this.isAuthenticatedUserProfile() && Boolean(blockInfo)); + + const isLanguageBlockVisible = isBlockVisible(languageProficiencies.length); + const isEducationBlockVisible = isBlockVisible(levelOfEducation); + const isSocialLinksBLockVisible = isBlockVisible(socialLinks.some((link) => link.socialLink !== null)); + const isBioBlockVisible = isBlockVisible(bio); + const isCertificatesBlockVisible = isBlockVisible(courseCertificates.length); + const isNameBlockVisible = isBlockVisible(name); + const isLocationBlockVisible = isBlockVisible(country); + return (
@@ -230,46 +242,58 @@ class ProfilePage extends React.Component {
{this.renderViewMyRecordsButton()}
- - - - - + {isNameBlockVisible && ( + + )} + {isLocationBlockVisible && ( + + )} + {isLanguageBlockVisible && ( + + )} + {isEducationBlockVisible && ( + + )} + {isSocialLinksBLockVisible && ( + + )}
{!this.isYOBDisabled() && this.renderAgeMessage()} - + {isBioBlockVisible && ( + + )} {getConfig().ENABLE_SKILLS_BUILDER_PROFILE && ( )} - + {isCertificatesBlockVisible && ( + + )}
@@ -348,7 +374,7 @@ ProfilePage.propTypes = { // Learning Goal form data learningGoal: PropTypes.string, - visibilityLearningGoal: PropTypes.string.isRequired, + visibilityLearningGoal: PropTypes.string, // Other data we need profileImage: PropTypes.shape({ @@ -397,6 +423,7 @@ ProfilePage.defaultProps = { courseCertificates: null, requiresParentalConsent: null, dateJoined: null, + visibilityLearningGoal: null, }; export default connect( diff --git a/src/profile/ProfilePage.test.jsx b/src/profile/ProfilePage.test.jsx index 89f8da733..411ca4536 100644 --- a/src/profile/ProfilePage.test.jsx +++ b/src/profile/ProfilePage.test.jsx @@ -114,16 +114,34 @@ describe('', () => { expect(tree).toMatchSnapshot(); }); - it('viewing other profile', () => { + it('viewing other profile with all fields', () => { const contextValue = { authenticatedUser: { userId: 123, username: 'staff', administrator: true }, config: getConfig(), }; + const component = ( ); const tree = renderer.create(component).toJSON(); diff --git a/src/profile/__snapshots__/ProfilePage.test.jsx.snap b/src/profile/__snapshots__/ProfilePage.test.jsx.snap index 75f53170e..746bd2b02 100644 --- a/src/profile/__snapshots__/ProfilePage.test.jsx.snap +++ b/src/profile/__snapshots__/ProfilePage.test.jsx.snap @@ -5643,7 +5643,7 @@ exports[` Renders correctly in various states test preferreded la `; -exports[` Renders correctly in various states viewing other profile 1`] = ` +exports[` Renders correctly in various states viewing other profile with all fields 1`] = `
@@ -5704,7 +5704,7 @@ exports[` Renders correctly in various states viewing other profi

- verified + staff

Renders correctly in various states viewing other profi

Renders correctly in various states viewing other profi

- verified + staff

Renders correctly in various states viewing other profi

Renders correctly in various states viewing other profi "height": null, } } - /> + > +
+
+

+ Full Name +

+
+

+ user +

+
+
Renders correctly in various states viewing other profi "height": null, } } - /> + > +
+
+

+ Location +

+
+

+

+
Renders correctly in various states viewing other profi "height": null, } } - /> + > +
+
+

+ Primary Language Spoken +

+
+

+

+
Renders correctly in various states viewing other profi "height": null, } } - /> + > +
+
+

+ Education +

+
+

+ Other education +

+
+
Renders correctly in various states viewing other profi "height": null, } } - /> + > +
+
+

+ Social Links +

+
+
    +
+
Renders correctly in various states viewing other profi "height": null, } } - /> + > +
+
+

+ About Me +

+
+

+ bio +

+
+
Renders correctly in various states viewing other profi "height": null, } } - /> + > +
+
+

+ My Certificates +

+
+ You don't have any certificates yet. +
+
diff --git a/src/profile/data/sagas.js b/src/profile/data/sagas.js index f71f02d82..cfece88bb 100644 --- a/src/profile/data/sagas.js +++ b/src/profile/data/sagas.js @@ -66,6 +66,25 @@ export function* handleFetchProfile(action) { } else { [account, courseCertificates] = result; } + + // Set initial visibility values for account + // Set account_privacy as custom is necessary so that when viewing another user's profile, + // their full name is displayed and change visibility forms are worked correctly + if (isAuthenticatedUserProfile && result[0].accountPrivacy === 'all_users') { + yield call(ProfileApiService.patchPreferences, action.payload.username, { + account_privacy: 'custom', + 'visibility.name': 'all_users', + 'visibility.bio': 'all_users', + 'visibility.course_certificates': 'all_users', + 'visibility.country': 'all_users', + 'visibility.date_joined': 'all_users', + 'visibility.level_of_education': 'all_users', + 'visibility.language_proficiencies': 'all_users', + 'visibility.social_links': 'all_users', + 'visibility.time_zone': 'all_users', + }); + } + yield put(fetchProfileSuccess( account, preferences, diff --git a/src/profile/data/selectors.js b/src/profile/data/selectors.js index f25393c14..b04493e6e 100644 --- a/src/profile/data/selectors.js +++ b/src/profile/data/selectors.js @@ -35,9 +35,12 @@ export const editableFormModeSelector = createSelector( // or is being hidden from us (for other users' profiles) let propExists = account[formId] != null && account[formId].length > 0; propExists = formId === 'certificates' ? certificates.length > 0 : propExists; // overwrite for certificates - // If this isn't the current user's profile or if + // If this isn't the current user's profile + if (!isAuthenticatedUserProfile) { + return 'static'; + } // the current user has no age set / under 13 ... - if (!isAuthenticatedUserProfile || account.requiresParentalConsent) { + if (account.requiresParentalConsent) { // then there are only two options: static or nothing. // We use 'null' as a return value because the consumers of // getMode render nothing at all on a mode of null. @@ -228,13 +231,13 @@ export const visibilitiesSelector = createSelector( switch (accountPrivacy) { case 'custom': return { - visibilityBio: preferences.visibilityBio || 'private', - visibilityCourseCertificates: preferences.visibilityCourseCertificates || 'private', - visibilityCountry: preferences.visibilityCountry || 'private', - visibilityLevelOfEducation: preferences.visibilityLevelOfEducation || 'private', - visibilityLanguageProficiencies: preferences.visibilityLanguageProficiencies || 'private', - visibilityName: preferences.visibilityName || 'private', - visibilitySocialLinks: preferences.visibilitySocialLinks || 'private', + visibilityBio: preferences.visibilityBio || 'all_users', + visibilityCourseCertificates: preferences.visibilityCourseCertificates || 'all_users', + visibilityCountry: preferences.visibilityCountry || 'all_users', + visibilityLevelOfEducation: preferences.visibilityLevelOfEducation || 'all_users', + visibilityLanguageProficiencies: preferences.visibilityLanguageProficiencies || 'all_users', + visibilityName: preferences.visibilityName || 'all_users', + visibilitySocialLinks: preferences.visibilitySocialLinks || 'all_users', }; case 'private': return {