diff --git a/src/account-settings/AccountSettingsPage.jsx b/src/account-settings/AccountSettingsPage.jsx index f1b3a4f..bf964e8 100644 --- a/src/account-settings/AccountSettingsPage.jsx +++ b/src/account-settings/AccountSettingsPage.jsx @@ -38,6 +38,7 @@ import { fetchSiteLanguages } from './site-language'; import CoachingToggle from './coaching/CoachingToggle'; import DemographicsSection from './demographics/DemographicsSection'; + class AccountSettingsPage extends React.Component { constructor(props, context) { super(props, context); @@ -53,6 +54,16 @@ class AccountSettingsPage extends React.Component { this.state = { duplicateTpaProvider, }; + + this.navLinkRefs = { + '#basic-information': React.createRef(), + '#profile-information': React.createRef(), + '#demographics-information': React.createRef(), + '#social-media': React.createRef(), + '#site-preferences': React.createRef(), + '#linked-accounts': React.createRef(), + '#delete-account': React.createRef(), + }; } componentDidMount() { @@ -65,6 +76,22 @@ class AccountSettingsPage extends React.Component { }); } + componentDidUpdate() { + if (this.props.loaded) { + const locationHash = global.location.hash; + + // Check for the locationHash in the URL and then scroll to it if it is in the + // NavLinks list + if (typeof locationHash !== 'string') + return; + if (Object.keys(this.navLinkRefs).includes(locationHash)) { + if (this.navLinkRefs[locationHash].current) { + window.scrollTo(0, this.navLinkRefs[locationHash].current.offsetTop) + } + } + } + } + // NOTE: We need 'locale' for the memoization in getLocalizedTimeZoneOptions. Don't remove it! // eslint-disable-next-line no-unused-vars getLocalizedTimeZoneOptions = memoize((timeZoneOptions, countryTimeZoneOptions, locale) => { @@ -211,7 +238,7 @@ class AccountSettingsPage extends React.Component { // check the result of an LMS API call to determine if we should render the DemographicsSection component if (this.props.formValues.shouldDisplayDemographicsSection) { return ( - + ); } else { return null; @@ -247,7 +274,7 @@ class AccountSettingsPage extends React.Component { return ( -
+

{this.props.intl.formatMessage(messages['account.settings.section.account.information'])}

@@ -334,7 +361,7 @@ class AccountSettingsPage extends React.Component { }
-
+

{this.props.intl.formatMessage(messages['account.settings.section.profile.information'])}

@@ -408,7 +435,7 @@ class AccountSettingsPage extends React.Component { />
-
+

{this.props.intl.formatMessage(messages['account.settings.section.site.preferences'])}

@@ -439,13 +466,13 @@ class AccountSettingsPage extends React.Component { />
-
+

{this.props.intl.formatMessage(messages['account.settings.section.linked.accounts'])}

{this.props.intl.formatMessage(messages['account.settings.section.linked.accounts.description'])}

-
+
-
diff --git a/src/account-settings/demographics/DemographicsSection.jsx b/src/account-settings/demographics/DemographicsSection.jsx index dadd031..66d7cb2 100644 --- a/src/account-settings/demographics/DemographicsSection.jsx +++ b/src/account-settings/demographics/DemographicsSection.jsx @@ -166,7 +166,7 @@ class DemographicsSection extends React.Component { const showWorkStatusDescribe = this.props.formValues.demographics_work_status == OTHER; return ( -
+

{this.props.intl.formatMessage(messages['account.settings.section.demographics.information'])}

diff --git a/src/account-settings/demographics/DemographicsSection.messages.jsx b/src/account-settings/demographics/DemographicsSection.messages.jsx index c7d3b61..1478c80 100644 --- a/src/account-settings/demographics/DemographicsSection.messages.jsx +++ b/src/account-settings/demographics/DemographicsSection.messages.jsx @@ -231,11 +231,6 @@ const messages = defineMessages({ defaultMessage: 'Some college, but no degree', description: 'The label for the some college, but no degree education level option.', }, - 'account.settings.field.demographics.education_level.options.some-college': { - id: 'account.settings.field.demographics.education_level.options.some-college', - defaultMessage: 'Some college, but no degree', - description: 'The label for the some college, but no degree education level option.', - }, 'account.settings.field.demographics.education_level.options.associates': { id: 'account.settings.field.demographics.education_level.options.associates', defaultMessage: 'Associates degree',