diff --git a/plugins/index.js b/plugins/index.js index e7c234cad..1dbf8fae7 100644 --- a/plugins/index.js +++ b/plugins/index.js @@ -13,3 +13,6 @@ export { export { IFRAME_PLUGIN, } from './data/constants'; +export { + default as PluginErrorBoundary, +} from './PluginErrorBoundary'; diff --git a/src/profile/ProfilePluginPage.jsx b/src/profile/ProfilePluginPage.jsx index b1b1baad8..cbf326fc7 100644 --- a/src/profile/ProfilePluginPage.jsx +++ b/src/profile/ProfilePluginPage.jsx @@ -3,8 +3,14 @@ import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import { ensureConfig } from '@edx/frontend-platform'; -import { AppContext, ErrorBoundary } from '@edx/frontend-platform/react'; +import { AppContext } from '@edx/frontend-platform/react'; import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; + +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { faTwitter, faFacebook, faLinkedin } from '@fortawesome/free-brands-svg-icons'; +import { Card, ActionRow } from '@edx/paragon'; + +import get from 'lodash.get'; import { Plugin } from '../../plugins'; // Actions @@ -20,10 +26,7 @@ import { // Components import ProfileAvatar from './forms/ProfileAvatar'; -import Name from './forms/Name'; import Country from './forms/Country'; -import Education from './forms/Education'; -import SocialLinks from './forms/SocialLinks'; import Bio from './forms/Bio'; import DateJoined from './DateJoined'; import PageLoading from './PageLoading'; @@ -33,6 +36,8 @@ import { profilePageSelector } from './data/selectors'; // i18n import messages from './ProfilePage.messages'; +import eduMessages from './forms/Education.messages'; +import countryMessages from './forms/Country.messages'; import withParams from '../utils/hoc'; @@ -45,6 +50,21 @@ function Fallback() { ); } +const platformDisplayInfo = { + facebook: { + icon: faFacebook, + name: '', + }, + twitter: { + icon: faTwitter, + name: '', + }, + linkedin: { + icon: faLinkedin, + name: '', + }, +}; + class ProfilePluginPage extends React.Component { constructor(props, context) { super(props, context); @@ -89,30 +109,25 @@ class ProfilePluginPage extends React.Component { renderHeadingLockup() { const { dateJoined } = this.props; return ( - }> - -

{this.props.params.username}

- -
-
-
+ +

{this.props.params.username}

+ +
+
); } renderContent() { const { profileImage, - name, - visibilityName, country, - visibilityCountry, levelOfEducation, - visibilityLevelOfEducation, socialLinks, - visibilitySocialLinks, bio, visibilityBio, isLoadingProfile, + dateJoined, + intl, } = this.props; if (isLoadingProfile) { @@ -127,7 +142,32 @@ class ProfilePluginPage extends React.Component { }; return ( - + }> + + +
    + {socialLinks + .filter(({ socialLink }) => Boolean(socialLink)) + .map(({ platform, socialLink }) => ( + + ))} +
+ + ) + } + /> + {/* */} +
@@ -137,40 +177,27 @@ class ProfilePluginPage extends React.Component { src={profileImage.src} isDefault={profileImage.isDefault} /> -
-
-
-
- {this.renderHeadingLockup()} +

{this.props.params.username}

+ +

{countryMessages[country]}

- - - - + /> */} +

+ {intl.formatMessage(get( + eduMessages, + `profile.education.levels.${levelOfEducation}`, + eduMessages['profile.education.levels.o'], + ))} +

( + + + {name} + +); + +const StaticListItem = ({ url, name, platform }) => ( +
  • + +
  • +); + ProfilePluginPage.contextType = AppContext; ProfilePluginPage.propTypes = {