Merge pull request #516 from Dicey-Tech/bbrsofiane/maple-upgrade-deps

chore: upgrade versions of frontend-build and frontend-component-header

.env

@@ -1,37 +1,26 @@
 NODE_ENV='production'
-ACCESS_TOKEN_COOKIE_NAME=null
-BASE_URL=null
-CREDENTIALS_BASE_URL=null
-CSRF_TOKEN_API_PATH=null
-ECOMMERCE_BASE_URL=null
-LANGUAGE_PREFERENCE_COOKIE_NAME=null
-LMS_BASE_URL=null
-LOGIN_URL=null
-LOGOUT_URL=null
-MARKETING_SITE_BASE_URL=null
-ORDER_HISTORY_URL=null
-REFRESH_ACCESS_TOKEN_ENDPOINT=null
-SEGMENT_KEY=null
+ACCESS_TOKEN_COOKIE_NAME=''
+BASE_URL=''
+CREDENTIALS_BASE_URL=''
+CSRF_TOKEN_API_PATH=''
+ECOMMERCE_BASE_URL=''
+LANGUAGE_PREFERENCE_COOKIE_NAME=''
+LMS_BASE_URL=''
+LOGIN_URL=''
+LOGOUT_URL=''
+MARKETING_SITE_BASE_URL=''
+ORDER_HISTORY_URL=''
+REFRESH_ACCESS_TOKEN_ENDPOINT=''
+SEGMENT_KEY=''
 SITE_NAME=''
-USER_INFO_COOKIE_NAME=null
-APPLE_APP_STORE_URL=null
-CONTACT_URL=null
-ENTERPRISE_LEARNER_PORTAL_HOSTNAME=null
-ENTERPRISE_MARKETING_FOOTER_UTM_MEDIUM=null
-ENTERPRISE_MARKETING_URL=null
-ENTERPRISE_MARKETING_UTM_CAMPAIGN=null
-ENTERPRISE_MARKETING_UTM_SOURCE=null
-FACEBOOK_URL=null
-GOOGLE_PLAY_URL=null
-LINKED_IN_URL=null
-OPEN_SOURCE_URL=null
-PRIVACY_POLICY_URL=null
-REDDIT_URL=null
-SUPPORT_URL=null
-TERMS_OF_SERVICE_URL=null
-TWITTER_URL=null
-YOU_TUBE_URL=null
+USER_INFO_COOKIE_NAME=''
+CONTACT_URL=''
+ENTERPRISE_LEARNER_PORTAL_HOSTNAME=''
+SUPPORT_URL=''
+TERMS_OF_SERVICE_URL=''
 LOGO_URL=''
 LOGO_TRADEMARK_URL=''
 LOGO_WHITE_URL=''
 FAVICON_URL=''
+ENABLE_LEARNER_RECORD_MFE=''
+LEARNER_RECORD_MFE_BASE_URL=''

.env.development

@@ -10,29 +10,18 @@ LMS_BASE_URL='http://localhost:18000'
 LOGIN_URL='http://localhost:18000/login'
 LOGOUT_URL='http://localhost:18000/logout'
 MARKETING_SITE_BASE_URL='http://localhost:18000'
-ORDER_HISTORY_URL='localhost:1996/orders'
+ORDER_HISTORY_URL='http://localhost:1996/orders'
 REFRESH_ACCESS_TOKEN_ENDPOINT='http://localhost:18000/login_refresh'
-SEGMENT_KEY=null
+SEGMENT_KEY=''
 SITE_NAME=localhost
 USER_INFO_COOKIE_NAME='edx-user-info'
-APPLE_APP_STORE_URL='https://www.apple.com/ios/app-store/'
 CONTACT_URL='http://localhost:18000/contact'
 ENTERPRISE_LEARNER_PORTAL_HOSTNAME='http://localhost:8080'
-ENTERPRISE_MARKETING_FOOTER_UTM_MEDIUM='Footer'
-ENTERPRISE_MARKETING_URL='http://example.com'
-ENTERPRISE_MARKETING_UTM_CAMPAIGN='my_campaign'
-ENTERPRISE_MARKETING_UTM_SOURCE='edX profile'
-FACEBOOK_URL='https://www.facebook.com'
-GOOGLE_PLAY_URL='https://play.google.com/store'
-LINKED_IN_URL='https://www.linkedin.com'
-OPEN_SOURCE_URL='http://localhost:18000/openedx'
-PRIVACY_POLICY_URL='http://localhost:18000/privacy-policy'
-REDDIT_URL='https://www.reddit.com'
 SUPPORT_URL='http://localhost:18000/support'
 TERMS_OF_SERVICE_URL='http://localhost:18000/terms-of-service'
-TWITTER_URL='https://twitter.com'
-YOU_TUBE_URL='https://www.youtube.com'
 LOGO_URL=https://edx-cdn.org/v3/default/logo.svg
 LOGO_TRADEMARK_URL=https://edx-cdn.org/v3/default/logo-trademark.svg
 LOGO_WHITE_URL=https://edx-cdn.org/v3/default/logo-white.svg
 FAVICON_URL=https://edx-cdn.org/v3/default/favicon.ico
+ENABLE_LEARNER_RECORD_MFE=''
+LEARNER_RECORD_MFE_BASE_URL='http://localhost:1990'

.env.test

@@ -8,7 +8,7 @@ LMS_BASE_URL='http://localhost:18000'
 LOGIN_URL='http://localhost:18000/login'
 LOGOUT_URL='http://localhost:18000/logout'
 MARKETING_SITE_BASE_URL='http://localhost:18000'
-ORDER_HISTORY_URL='localhost:1996/orders'
+ORDER_HISTORY_URL='http://localhost:1996/orders'
 REFRESH_ACCESS_TOKEN_ENDPOINT='http://localhost:18000/login_refresh'
 SEGMENT_KEY=null
 SITE_NAME=localhost
@@ -17,3 +17,5 @@ LOGO_URL=https://edx-cdn.org/v3/default/logo.svg
 LOGO_TRADEMARK_URL=https://edx-cdn.org/v3/default/logo-trademark.svg
 LOGO_WHITE_URL=https://edx-cdn.org/v3/default/logo-white.svg
 FAVICON_URL=https://edx-cdn.org/v3/default/favicon.ico
+ENABLE_LEARNER_RECORD_MFE=''
+LEARNER_RECORD_MFE_BASE_URL='http://localhost:1990'

.github/workflows/ci.yml

@@ -0,0 +1,32 @@
+---
+name: ci
+on:
+  push:
+    branches:
+    - master
+  pull_request:
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version:
+        - 12
+        npm-test:
+        - i18n_extract
+        - is-es5
+        - lint
+        - test
+    steps:
+    - uses: actions/checkout@v2
+    - uses: actions/setup-node@v2
+      with:
+        node-version: ${{ matrix.node-version }}
+    - run: npm install -g npm@6
+    - run: make requirements
+    - run: make test NPM_TESTS=build
+    - run: make test NPM_TESTS=${{ matrix.npm-test }}
+    - name: upload coverage
+      uses: codecov/codecov-action@v2
+      with:
+        fail_ci_if_error: false

.github/workflows/commitlint.yml

@@ -0,0 +1,10 @@
+# Run commitlint on the commit messages in a pull request.
+
+name: Lint Commit Messages
+
+on:
+  - pull_request
+
+jobs:
+  commitlint:
+    uses: edx/.github/.github/workflows/commitlint.yml@master

.gitignore

@@ -14,7 +14,6 @@ temp/babel-plugin-react-intl
 
 ### Emacs ###
 *~
-/.vscode
 /temp
-/npm-dist
+/.vscode
 /module.config.js

.releaserc

@@ -1,27 +0,0 @@
-{
-  "branch": "master",
-  "tagFormat": "v${version}",
-  "verifyConditions": [
-    "@semantic-release/npm",
-    {
-      "path": "@semantic-release/github",
-      "assets": {
-        "path": "npm-dist/*"
-      }
-    }
-  ],
-  "analyzeCommits": "@semantic-release/commit-analyzer",
-  "generateNotes": "@semantic-release/release-notes-generator",
-  "prepare": "@semantic-release/npm",
-  "publish": [
-    "@semantic-release/npm",
-    {
-      "path": "@semantic-release/github",
-      "assets": {
-        "path": "npm-dist/*"
-      }
-    }
-  ],
-  "success": [],
-  "fail": []
-}

.travis.yml

@@ -1,23 +0,0 @@
-language: node_js
-node_js: 12
-before_install:
-- npm install -g npm@6
-install:
-- npm ci
-script:
-- make validate-no-uncommitted-package-lock-changes
-- npm run i18n_extract
-- npm run lint
-- npm run test
-- npm run build
-- npm run npm-build
-- npm run is-es5
-after_success:
-- npx semantic-release
-- codecov
-env:
-  global:
-  # GH_TOKEN
-  - secure: qvCsyn5Ioj+b/gvX95yaQ+Vha+r60pGxuKFm6HzVbnWJyKAbR1NN8+RpIo0HUD9S5RPEFjLae82bLa2g/syS+D1DU9qF8NYderjy58bjibgrPdC1YOhi2SEY5u6TW6/T88+w9DyfZ6MF883lJi/6uzs24bHE13RguARlO79OeGvHk6SecoJSWe9yq2IHA0wAScKrvS64+AcUWyTDUvkrxHEvupVJs6aJ6EsdPALODLJ7JnXX7Rh+68nyqbezh+ZnumxBPkdCzUNdtO9C0o7JjV6/P1xg9rNre/huWGx4SYndPaPEmoOpWEfyCZw1ub83LHC1HBnE7eRJku/CmiaiaLGSfeU2sCRteBLlSyI5fEOQ4Su2xLu2k+Yuczj4BlIbjr+xC+bNg+WbOF8vj7TL4/YCxOG/8V4nLfDcHFsZDsPoYZyBe9Z5HsS77S5ZrutQ3i/qR+4zfs4X/QfPXfW3MqI7+oGo+PVNPgxI24i2Kwq5+ZUjnmkVnuGC5ZOZMN8aYojEvqdF+u5VALL/YCmXsXysL6BUsqv4kiZJpQEVBG0WPbh0FJH8qiB8OjLGogxkoSrL4Yd++o4fnSAvW1UgARIlJ0iHVf5r/wVei1KCQiFS6mh0Pwq1lM0Vo2SlTCF5UylnV80Hv7XY6Sp9dYi/EaVG1dv4DyJOHnPti1JAM/U=
-  # NPM_TOKEN
-  - secure: S6spzx4jJGWqucSwjaSdPEaNWlwzA75FisK+NoLFDY6uU7KIi2dayHiFlSW1C1vl5xQkkosHXJAInSwcnQMCUomCEuD1FFzydXA1/Dn8NmPc35coKR4CX9yJiArRbjZZjboCulrTPUVWHWoPfA7JTnqCDgOnXspgRKy7emzFLXkdn8vuUQcyXmmT/vDfQQjgq/T+DdBbMiradMvlTzxmKydAVeHAZ03A1Z5O6ePnR6IsFv4LgJ/RfGn501jHeTww6HsxfQX27tWLo5AyQ00YjMl9oXfs57n5u+em/ph3Xoc8Pz6wjkMLJ+eYo+xkYjoZ3d+/f+WXPLMBUNz0LpIBs7LcBHhAc2z4N+dce42CTXur/v8ra0BZEnZQsvOakHvox6KisDDlipPqc0yF7MgThbd31fc8QjdVxdh5w7tLH4PJ7QpBUtZwPskDLABKjnrxkxH+BysHADvVaNOBcZMwIA9yHY3GqzpyQ2upcS07h5a+SHx07viuA7hEn14XCtYrM1AHwS0n2sNdinb0qWOCcGOXzl39FU3N6xNueKoH/eIXuqJ7oiUkKBiSP9zApTApPL6nrng0InZhGjzZHOMNePPdin/uIrxk/fp/wqneGTQemCGRkfHdPT0yuIP22bUv/OmDtgNEG9t9hbIZGYgQmG4FTeTQQ7lC5RjmLrn+uWI=

Makefile

@@ -10,8 +10,19 @@ tx_url2 = https://www.transifex.com/api/2/project/edx-platform/resource/$(transi
 # This directory must match .babelrc .
 transifex_temp = ./temp/babel-plugin-react-intl
 
-requirements:
-	npm install
+NPM_TESTS=build i18n_extract lint test is-es5
+
+.PHONY: test
+test: $(addprefix test.npm.,$(NPM_TESTS))  ## validate ci suite
+
+.PHONY: test.npm.*
+test.npm.%: validate-no-uncommitted-package-lock-changes
+	test -d node_modules || $(MAKE) requirements
+	npm run $(*)
+
+.PHONY: requirements
+requirements:  ## install ci requirements
+	npm ci
 
 i18n.extract:
 	# Pulling display strings from .jsx files into .json files...
@@ -48,10 +59,3 @@ pull_translations:
 validate-no-uncommitted-package-lock-changes:
 	# Checking for package-lock.json changes...
 	git diff --exit-code package-lock.json
-
-npm-build:
-	rm -rf ./npm-dist
-	./node_modules/.bin/fedx-scripts babel src/profile --out-dir npm-dist --source-maps --ignore **/*.test.jsx,**/*.test.js,**/setupTest.js --copy-files
-	@# --copy-files will bring in everything else that wasn't processed by babel. Remove what we don't want.
-	@find npm-dist -name '*.test.js*' -delete
-	@rm -rf ./npm-dist/__mocks__

README.rst

@@ -1,4 +1,4 @@
-|Build Status| |Codecov| |npm_version| |npm_downloads| |license| |semantic-release|
+|Build Status| |Codecov| |license|
 
 frontend-app-profile
 ====================
@@ -49,22 +49,9 @@ This MFE is configured via node environment variables supplied at build time. Se
 For more information see the document: `Micro-frontend applications in Open
 edX <https://edx.readthedocs.io/projects/edx-developer-docs/en/latest/micro-frontends-in-open-edx.html>`__.
 
-----------
-
-Notes
------
-
-The production Webpack configuration for this repo uses `Purgecss <https://www.purgecss.com/>`__ to remove unused CSS from the production css file. In ``webpack.prod.config.js`` the Purgecss plugin is configured to scan directories to determine what css selectors should remain. Currently the src/ directory is scanned along with all ``@edx/frontend-component*`` node modules and ``@edx/paragon``. **If you add and use a component in this repo that relies on HTML classes or ids for styling you must add it to the Purgecss configuration or it will be unstyled in the production build.**
-
 .. |Build Status| image:: https://api.travis-ci.org/edx/frontend-app-profile.svg?branch=master
    :target: https://travis-ci.org/edx/frontend-app-profile
 .. |Codecov| image:: https://img.shields.io/codecov/c/github/edx/frontend-app-profile
    :target: https://codecov.io/gh/edx/frontend-app-profile
-.. |npm_version| image:: https://img.shields.io/npm/v/@edx/frontend-app-profile.svg
-   :target: https://www.npmjs.com/package/@edx/frontend-app-profile
-.. |npm_downloads| image:: https://img.shields.io/npm/dt/@edx/frontend-app-profile.svg
-   :target: https://www.npmjs.com/package/@edx/frontend-app-profile
 .. |license| image:: https://img.shields.io/npm/l/@edx/frontend-app-profile.svg
    :target: @edx/frontend-app-profile
-.. |semantic-release| image:: https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg
-   :target: https://github.com/semantic-release/semantic-release

commitlint.config.js

@@ -1,3 +0,0 @@
-module.exports = {
-  extends: ['@commitlint/config-angular'],
-};

openedx.yaml

@@ -1,7 +1,6 @@
 # This file describes this Open edX repo, as described in OEP-2:
-# http://open-edx-proposals.readthedocs.io/en/latest/oeps/oep-0002.html#specification
+# https://open-edx-proposals.readthedocs.io/en/latest/oep-0002-bp-repo-metadata.html#specification
 
 nick: prof
 oeps: {}
-owner: edx/arch-team
 openedx-release: {ref: master}

package.json

@@ -4,14 +4,12 @@
   "description": "User profile micro-frontend for Open edX",
   "author": "edX",
   "license": "AGPL-3.0",
-  "main": "npm-dist/index.js",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/edx/frontend-app-profile.git"
   },
   "scripts": {
     "build": "fedx-scripts webpack",
-    "npm-build": "make npm-build",
     "i18n_extract": "BABEL_ENV=i18n fedx-scripts babel src --quiet > /dev/null",
     "is-es5": "es-check es5 ./dist/*.js",
     "lint": "fedx-scripts eslint --ext .js --ext .jsx .",
@@ -19,15 +17,6 @@
     "start": "fedx-scripts webpack-dev-server --progress",
     "test": "fedx-scripts jest --coverage --passWithNoTests"
   },
-  "files": [
-    "/npm-dist"
-  ],
-  "husky": {
-    "hooks": {
-      "pre-commit": "npm run lint",
-      "commit-msg": "commitlint -e $GIT_PARAMS"
-    }
-  },
   "bugs": {
     "url": "https://github.com/edx/frontend-app-profile/issues"
   },
@@ -41,54 +30,45 @@
   ],
   "dependencies": {
     "@edx/brand": "npm:@edx/brand-openedx@1.1.0",
-    "@edx/frontend-component-footer": "10.1.5",
-    "@edx/frontend-component-header": "2.3.0",
-    "@edx/frontend-platform": "1.11.0",
-    "@edx/paragon": "13.1.2",
-    "@fortawesome/fontawesome-svg-core": "1.2.25",
-    "@fortawesome/free-brands-svg-icons": "5.7.2",
-    "@fortawesome/free-regular-svg-icons": "5.7.2",
-    "@fortawesome/free-solid-svg-icons": "5.7.2",
-    "@fortawesome/react-fontawesome": "0.1.8",
+    "@edx/frontend-component-footer": "10.1.6",
+    "@edx/frontend-component-header": "2.4.3",
+    "@edx/frontend-platform": "1.12.7",
+    "@edx/paragon": "16.6.1",
+    "@fortawesome/fontawesome-svg-core": "1.2.36",
+    "@fortawesome/free-brands-svg-icons": "5.15.4",
+    "@fortawesome/free-regular-svg-icons": "5.15.4",
+    "@fortawesome/free-solid-svg-icons": "5.15.4",
+    "@fortawesome/react-fontawesome": "0.1.15",
     "classnames": "2.3.1",
-    "core-js": "3.14.0",
-    "email-prop-type": "1.1.7",
-    "font-awesome": "4.7.0",
-    "form-urlencoded": "3.0.2",
-    "history": "4.10.1",
+    "core-js": "3.18.2",
     "lodash.camelcase": "4.3.0",
     "lodash.get": "4.4.2",
-    "lodash.memoize": "4.1.2",
     "lodash.pick": "4.4.0",
     "lodash.snakecase": "4.1.1",
-    "newrelic": "5.13.1",
     "prop-types": "15.7.2",
     "react": "16.14.0",
     "react-dom": "16.14.0",
-    "react-redux": "7.2.4",
-    "react-router": "5.2.0",
-    "react-router-dom": "5.2.0",
-    "react-transition-group": "4.4.2",
-    "redux": "4.0.5",
+    "react-redux": "7.2.5",
+    "react-router": "5.2.1",
+    "react-router-dom": "5.3.0",
+    "redux": "4.1.1",
     "redux-devtools-extension": "2.13.9",
     "redux-logger": "3.0.6",
     "redux-saga": "1.1.3",
     "redux-thunk": "2.3.0",
-    "regenerator-runtime": "0.13.7",
+    "regenerator-runtime": "0.13.9",
     "reselect": "4.0.0",
     "universal-cookie": "3.1.0"
   },
   "devDependencies": {
-    "@commitlint/cli": "8.3.5",
-    "@commitlint/config-angular": "8.3.4",
-    "@edx/frontend-build": "5.6.14",
-    "codecov": "3.8.2",
+    "@commitlint/cli": "13.2.1",
+    "@commitlint/config-angular": "13.2.0",
+    "@edx/frontend-build": "9.0.5",
+    "codecov": "3.8.3",
     "enzyme": "3.11.0",
     "enzyme-adapter-react-16": "1.15.6",
-    "es-check": "5.2.3",
-    "glob": "7.1.7",
-    "husky": "3.1.0",
-    "purgecss-webpack-plugin": "1.6.0",
+    "es-check": "5.2.4",
+    "glob": "7.2.0",
     "react-test-renderer": "16.14.0",
     "reactifex": "1.1.1",
     "redux-mock-store": "1.5.4"

public/index.html

@@ -4,9 +4,7 @@
       <title>Learner Profile | <%= process.env.SITE_NAME %></title>
       <meta charset="utf-8">
       <meta name="viewport" content="width=device-width, initial-scale=1.0">
-      <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin>
-      <link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700" rel="stylesheet">
-      <link rel="shortcut icon" href="<%=webpackConfig.output.publicPath%>favicon.ico" type="image/x-icon" />
+      <link rel="shortcut icon" href="<%=htmlWebpackPlugin.options.FAVICON_URL%>" type="image/x-icon" />
   </head>
   <body>
     <div id="root"></div>

src/i18n/messages/fr.json

@@ -1,51 +1,51 @@
 {
-  "profile.age.headline": "Your profile cannot be shared.",
-  "profile.age.details": "To share your profile with other edX learners, you must confirm that you are over the age of 13.",
-  "profile.age.set.date": "Set your date of birth",
-  "profile.datejoined.member.since": "Member since {year}",
-  "profile.bio.empty": "Add a short bio",
-  "profile.bio.about.me": "About Me",
-  "profile.certificate.organization.label": "From",
-  "profile.certificate.completion.date.label": "Completed on {date}",
-  "profile.no.certificates": "You don't have any certificates yet.",
-  "profile.certificates.my.certificates": "My Certificates",
-  "profile.certificates.view.certificate": "View Certificate",
-  "profile.certificates.types.verified": "Verified Certificate",
-  "profile.certificates.types.professional": "Professional Certificate",
-  "profile.certificates.types.unknown": "Certificate",
-  "profile.country.label": "Location",
-  "profile.country.empty": "Add location",
-  "profile.education.empty": "Add education",
+  "profile.age.headline": "Votre profil ne peut pas être partagé.",
+  "profile.age.details": "Pour partager votre profil avec d'autres apprenants edX, vous devez confirmer que vous avez plus de 13 ans.",
+  "profile.age.set.date": "Définissez votre date de naissance",
+  "profile.datejoined.member.since": "Membre depuis {year}",
+  "profile.bio.empty": "Ajouter une courte biographie",
+  "profile.bio.about.me": "À propos de moi",
+  "profile.certificate.organization.label": "De",
+  "profile.certificate.completion.date.label": "Terminé le {date}",
+  "profile.no.certificates": "Vous n'avez pas encore de certificats.",
+  "profile.certificates.my.certificates": "Mes certificats",
+  "profile.certificates.view.certificate": "Voir le certificat",
+  "profile.certificates.types.verified": "Certificat vérifié",
+  "profile.certificates.types.professional": "Certificat professionnel",
+  "profile.certificates.types.unknown": "Certificat",
+  "profile.country.label": "Localisation",
+  "profile.country.empty": "Ajouter localisation",
+  "profile.education.empty": "Ajouter une éducation",
   "profile.education.education": "Education",
-  "profile.education.levels.p": "Doctorate",
-  "profile.education.levels.m": "Master's or professional degree",
-  "profile.education.levels.b": "Bachelor's Degree",
-  "profile.education.levels.a": "Associate's degree",
-  "profile.education.levels.hs": "Secondary/high school",
-  "profile.education.levels.jhs": "Junior secondary/junior high/middle school",
-  "profile.education.levels.el": "Elementary/primary school",
-  "profile.education.levels.none": "No formal education",
-  "profile.education.levels.o": "Other education",
-  "profile.editbutton.edit": "Edit",
-  "profile.formcontrols.who.can.see": "Who can see this:",
-  "profile.formcontrols.button.cancel": "Cancel",
-  "profile.formcontrols.button.save": "Save",
-  "profile.formcontrols.button.saving": "Saving",
-  "profile.formcontrols.button.saved": "Saved",
-  "profile.visibility.who.just.me": "Just me",
-  "profile.visibility.who.everyone": "Everyone on edX",
-  "profile.name.full.name": "Full Name",
-  "profile.name.details": "This is the name that appears in your account and on your certificates.",
-  "profile.name.empty": "Add name",
-  "profile.preferredlanguage.empty": "Add language",
-  "profile.preferredlanguage.label": "Primary Language Spoken",
-  "profile.profileavatar.upload-button": "Upload Photo",
-  "profile.profileavatar.remove.button": "Remove",
-  "profile.image.alt.attribute": "profile avatar",
-  "profile.profileavatar.change-button": "Change",
-  "profile.sociallinks.add": "Add {network}",
-  "profile.sociallinks.social.links": "Social Links",
-  "profile.notfound.message": "The page you're looking for is unavailable or there's an error in the URL. Please check the URL and try again.",
-  "profile.viewMyRecords": "View My Records",
-  "profile.loading": "Profile loading..."
+  "profile.education.levels.p": "Doctorat",
+  "profile.education.levels.m": "Master ou diplôme professionnel",
+  "profile.education.levels.b": "Diplôme de licence",
+  "profile.education.levels.a": "Grade de l'associé",
+  "profile.education.levels.hs": "Lycée / enseignement secondaire",
+  "profile.education.levels.jhs": "Collège / enseignement secondaire inférieur",
+  "profile.education.levels.el": "Enseignement primaire",
+  "profile.education.levels.none": "Sans diplôme",
+  "profile.education.levels.o": "Autre niveau d'étude",
+  "profile.editbutton.edit": "Modifier",
+  "profile.formcontrols.who.can.see": "Qui peut voir ça :",
+  "profile.formcontrols.button.cancel": "Annuler",
+  "profile.formcontrols.button.save": "Enregistrer",
+  "profile.formcontrols.button.saving": "Enregistrement",
+  "profile.formcontrols.button.saved": "Enregistré",
+  "profile.visibility.who.just.me": "Juste moi",
+  "profile.visibility.who.everyone": "Tout le monde sur edX",
+  "profile.name.full.name": "Nom complet",
+  "profile.name.details": "C'est le nom qui apparaît dans votre compte et sur vos certificats.",
+  "profile.name.empty": "Ajouter un nom",
+  "profile.preferredlanguage.empty": "Ajouter une langue",
+  "profile.preferredlanguage.label": "Langue principale parlée",
+  "profile.profileavatar.upload-button": "Envoyer la photo",
+  "profile.profileavatar.remove.button": "Supprimer",
+  "profile.image.alt.attribute": "Profil avatar",
+  "profile.profileavatar.change-button": "Modifier",
+  "profile.sociallinks.add": "Ajouter {network}",
+  "profile.sociallinks.social.links": "Liens vers les réseaux sociaux",
+  "profile.notfound.message": "La page que vous recherchez n'est pas disponible ou il y a une erreur dans l'URL. Veuillez vérifier l'URL et réessayer.",
+  "profile.viewMyRecords": "Voir mes succès",
+  "profile.loading": "Chargement du profil...."
 }

src/index.jsx

@@ -5,6 +5,7 @@ import {
   APP_INIT_ERROR,
   APP_READY,
   initialize,
+  mergeConfig,
   subscribe,
 } from '@edx/frontend-platform';
 import {
@@ -24,7 +25,6 @@ import { ProfilePage, NotFoundPage } from './profile';
 import configureStore from './data/configureStore';
 
 import './index.scss';
-import './assets/favicon.ico';
 
 subscribe(APP_READY, () => {
   ReactDOM.render(
@@ -55,4 +55,12 @@ initialize({
   ],
   requireAuthenticatedUser: true,
   hydrateAuthenticatedUser: true,
+  handlers: {
+    config: () => {
+      mergeConfig({
+        ENABLE_LEARNER_RECORD_MFE: (process.env.ENABLE_LEARNER_RECORD_MFE || false),
+        LEARNER_RECORD_MFE_BASE_URL: process.env.LEARNER_RECORD_MFE_BASE_URL,
+      }, 'App loadConfig override handler');
+    },
+  },
 });

src/index.scss

@@ -1,6 +1,3 @@
-$fa-font-path: "~font-awesome/fonts";
-@import "~font-awesome/scss/font-awesome";
-
 @import "~@edx/brand/paragon/fonts";
 @import "~@edx/brand/paragon/variables";
 @import "~@edx/paragon/scss/core/core";

src/profile/ProfilePage.jsx

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 
 import { sendTrackingLogEvent } from '@edx/frontend-platform/analytics';
-import { ensureConfig } from '@edx/frontend-platform';
+import { ensureConfig, getConfig } from '@edx/frontend-platform';
 import { AppContext } from '@edx/frontend-platform/react';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
 import { StatusAlert, Hyperlink } from '@edx/paragon';
@@ -44,10 +44,11 @@ ensureConfig(['CREDENTIALS_BASE_URL', 'LMS_BASE_URL'], 'ProfilePage');
 class ProfilePage extends React.Component {
   constructor(props, context) {
     super(props, context);
-    const credentialsBaseUrl = context.config.CREDENTIALS_BASE_URL;
+
+    const recordsUrl = this.getRecordsUrl(context);
 
     this.state = {
-      viewMyRecordsUrl: credentialsBaseUrl ? `${credentialsBaseUrl}/records` : null,
+      viewMyRecordsUrl: recordsUrl,
       accountSettingsUrl: `${context.config.LMS_BASE_URL}/account/settings`,
     };
 
@@ -66,6 +67,19 @@ class ProfilePage extends React.Component {
     });
   }
 
+  getRecordsUrl(context) {
+    let recordsUrl = null;
+
+    if (getConfig().ENABLE_LEARNER_RECORD_MFE) {
+      recordsUrl = getConfig().LEARNER_RECORD_MFE_BASE_URL;
+    } else {
+      const credentialsBaseUrl = context.config.CREDENTIALS_BASE_URL;
+      recordsUrl = credentialsBaseUrl ? `${credentialsBaseUrl}/records` : null;
+    }
+
+    return recordsUrl;
+  }
+
   isAuthenticatedUserProfile() {
     return this.props.match.params.username === this.context.authenticatedUser.username;
   }

src/profile/__snapshots__/ProfilePage.test.jsx.snap

@@ -245,7 +245,6 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
               >
                 <div
                   className="dropdown"
-                  onKeyDown={[Function]}
                 >
                   <button
                     aria-expanded={false}
@@ -327,14 +326,36 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
             target="_blank"
           >
             View My Records
-            <span>
+            <span
+              className="d-inline-block align-text-top"
+            >
                
               <span
-                aria-hidden={false}
-                aria-label="Opens in a new window"
-                className="fa fa-external-link"
-                title="Opens in a new window"
-              />
+                className="pgn__icon"
+                style={
+                  Object {
+                    "height": "1em",
+                    "width": "1em",
+                  }
+                }
+              >
+                <svg
+                  aria-hidden={true}
+                  aria-label=""
+                  fill="none"
+                  focusable={false}
+                  height={24}
+                  role="img"
+                  viewBox="0 0 24 24"
+                  width={24}
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M19 19H5V5h7V3H3v18h18v-9h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </span>
             </span>
           </a>
         </div>
@@ -383,14 +404,36 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
             target="_blank"
           >
             View My Records
-            <span>
+            <span
+              className="d-inline-block align-text-top"
+            >
                
               <span
-                aria-hidden={false}
-                aria-label="Opens in a new window"
-                className="fa fa-external-link"
-                title="Opens in a new window"
-              />
+                className="pgn__icon"
+                style={
+                  Object {
+                    "height": "1em",
+                    "width": "1em",
+                  }
+                }
+              >
+                <svg
+                  aria-hidden={true}
+                  aria-label=""
+                  fill="none"
+                  focusable={false}
+                  height={24}
+                  role="img"
+                  viewBox="0 0 24 24"
+                  width={24}
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M19 19H5V5h7V3H3v18h18v-9h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </span>
             </span>
           </a>
         </div>
@@ -880,17 +923,17 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
                 >
                   <svg
                     aria-hidden="true"
-                    className="svg-inline--fa fa-facebook fa-w-14 mr-2"
+                    className="svg-inline--fa fa-facebook fa-w-16 mr-2"
                     data-icon="facebook"
                     data-prefix="fab"
                     focusable="false"
                     role="img"
                     style={Object {}}
-                    viewBox="0 0 448 512"
+                    viewBox="0 0 512 512"
                     xmlns="http://www.w3.org/2000/svg"
                   >
                     <path
-                      d="M448 56.7v398.5c0 13.7-11.1 24.7-24.7 24.7H309.1V306.5h58.2l8.7-67.6h-67v-43.2c0-19.6 5.4-32.9 33.5-32.9h35.8v-60.5c-6.2-.8-27.4-2.7-52.2-2.7-51.6 0-87 31.5-87 89.4v49.9h-58.4v67.6h58.4V480H24.7C11.1 480 0 468.9 0 455.3V56.7C0 43.1 11.1 32 24.7 32h398.5c13.7 0 24.8 11.1 24.8 24.7z"
+                      d="M504 256C504 119 393 8 256 8S8 119 8 256c0 123.78 90.69 226.38 209.25 245V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.28c-30.8 0-40.41 19.12-40.41 38.73V256h68.78l-11 71.69h-57.78V501C413.31 482.38 504 379.78 504 256z"
                       fill="currentColor"
                       style={Object {}}
                     />
@@ -1178,14 +1221,36 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
                         target="_blank"
                       >
                         View Certificate
-                        <span>
+                        <span
+                          className="d-inline-block align-text-top"
+                        >
                            
                           <span
-                            aria-hidden={false}
-                            aria-label="Opens in a new window"
-                            className="fa fa-external-link"
-                            title="Opens in a new window"
-                          />
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "height": "1em",
+                                "width": "1em",
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              aria-label=""
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M19 19H5V5h7V3H3v18h18v-9h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </a>
                     </div>
@@ -1231,7 +1296,6 @@ exports[`<ProfilePage /> Renders correctly in various states while saving an edi
               >
                 <div
                   className="dropdown"
-                  onKeyDown={[Function]}
                 >
                   <button
                     aria-expanded={false}
@@ -1313,14 +1377,36 @@ exports[`<ProfilePage /> Renders correctly in various states while saving an edi
             target="_blank"
           >
             View My Records
-            <span>
+            <span
+              className="d-inline-block align-text-top"
+            >
                
               <span
-                aria-hidden={false}
-                aria-label="Opens in a new window"
-                className="fa fa-external-link"
-                title="Opens in a new window"
-              />
+                className="pgn__icon"
+                style={
+                  Object {
+                    "height": "1em",
+                    "width": "1em",
+                  }
+                }
+              >
+                <svg
+                  aria-hidden={true}
+                  aria-label=""
+                  fill="none"
+                  focusable={false}
+                  height={24}
+                  role="img"
+                  viewBox="0 0 24 24"
+                  width={24}
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M19 19H5V5h7V3H3v18h18v-9h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </span>
             </span>
           </a>
         </div>
@@ -1369,14 +1455,36 @@ exports[`<ProfilePage /> Renders correctly in various states while saving an edi
             target="_blank"
           >
             View My Records
-            <span>
+            <span
+              className="d-inline-block align-text-top"
+            >
                
               <span
-                aria-hidden={false}
-                aria-label="Opens in a new window"
-                className="fa fa-external-link"
-                title="Opens in a new window"
-              />
+                className="pgn__icon"
+                style={
+                  Object {
+                    "height": "1em",
+                    "width": "1em",
+                  }
+                }
+              >
+                <svg
+                  aria-hidden={true}
+                  aria-label=""
+                  fill="none"
+                  focusable={false}
+                  height={24}
+                  role="img"
+                  viewBox="0 0 24 24"
+                  width={24}
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M19 19H5V5h7V3H3v18h18v-9h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </span>
             </span>
           </a>
         </div>
@@ -1866,17 +1974,17 @@ exports[`<ProfilePage /> Renders correctly in various states while saving an edi
                 >
                   <svg
                     aria-hidden="true"
-                    className="svg-inline--fa fa-facebook fa-w-14 mr-2"
+                    className="svg-inline--fa fa-facebook fa-w-16 mr-2"
                     data-icon="facebook"
                     data-prefix="fab"
                     focusable="false"
                     role="img"
                     style={Object {}}
-                    viewBox="0 0 448 512"
+                    viewBox="0 0 512 512"
                     xmlns="http://www.w3.org/2000/svg"
                   >
                     <path
-                      d="M448 56.7v398.5c0 13.7-11.1 24.7-24.7 24.7H309.1V306.5h58.2l8.7-67.6h-67v-43.2c0-19.6 5.4-32.9 33.5-32.9h35.8v-60.5c-6.2-.8-27.4-2.7-52.2-2.7-51.6 0-87 31.5-87 89.4v49.9h-58.4v67.6h58.4V480H24.7C11.1 480 0 468.9 0 455.3V56.7C0 43.1 11.1 32 24.7 32h398.5c13.7 0 24.8 11.1 24.8 24.7z"
+                      d="M504 256C504 119 393 8 256 8S8 119 8 256c0 123.78 90.69 226.38 209.25 245V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.28c-30.8 0-40.41 19.12-40.41 38.73V256h68.78l-11 71.69h-57.78V501C413.31 482.38 504 379.78 504 256z"
                       fill="currentColor"
                       style={Object {}}
                     />
@@ -2044,12 +2152,31 @@ exports[`<ProfilePage /> Renders correctly in various states while saving an edi
                           className="pgn__stateful-btn-icon"
                         >
                           <span
-                            aria-hidden={true}
-                            className="icon fa fa-spinner fa-spin"
-                            id="Icon1"
-                          />
+                            className="pgn__icon icon-spin"
+                          >
+                            <svg
+                              aria-hidden={true}
+                              aria-label=""
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M22 12A10 10 0 116.122 3.91l1.176 1.618A8 8 0 1020 12h2z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
+                        </span>
+                        <span
+                          className=""
+                        >
+                          Saving
                         </span>
-                        Saving
                       </span>
                     </button>
                     <button
@@ -2216,14 +2343,36 @@ exports[`<ProfilePage /> Renders correctly in various states while saving an edi
                         target="_blank"
                       >
                         View Certificate
-                        <span>
+                        <span
+                          className="d-inline-block align-text-top"
+                        >
                            
                           <span
-                            aria-hidden={false}
-                            aria-label="Opens in a new window"
-                            className="fa fa-external-link"
-                            title="Opens in a new window"
-                          />
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "height": "1em",
+                                "width": "1em",
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              aria-label=""
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M19 19H5V5h7V3H3v18h18v-9h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </a>
                     </div>
@@ -2269,7 +2418,6 @@ exports[`<ProfilePage /> Renders correctly in various states without credentials
               >
                 <div
                   className="dropdown"
-                  onKeyDown={[Function]}
                 >
                   <button
                     aria-expanded={false}
@@ -2866,17 +3014,17 @@ exports[`<ProfilePage /> Renders correctly in various states without credentials
                 >
                   <svg
                     aria-hidden="true"
-                    className="svg-inline--fa fa-facebook fa-w-14 mr-2"
+                    className="svg-inline--fa fa-facebook fa-w-16 mr-2"
                     data-icon="facebook"
                     data-prefix="fab"
                     focusable="false"
                     role="img"
                     style={Object {}}
-                    viewBox="0 0 448 512"
+                    viewBox="0 0 512 512"
                     xmlns="http://www.w3.org/2000/svg"
                   >
                     <path
-                      d="M448 56.7v398.5c0 13.7-11.1 24.7-24.7 24.7H309.1V306.5h58.2l8.7-67.6h-67v-43.2c0-19.6 5.4-32.9 33.5-32.9h35.8v-60.5c-6.2-.8-27.4-2.7-52.2-2.7-51.6 0-87 31.5-87 89.4v49.9h-58.4v67.6h58.4V480H24.7C11.1 480 0 468.9 0 455.3V56.7C0 43.1 11.1 32 24.7 32h398.5c13.7 0 24.8 11.1 24.8 24.7z"
+                      d="M504 256C504 119 393 8 256 8S8 119 8 256c0 123.78 90.69 226.38 209.25 245V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.28c-30.8 0-40.41 19.12-40.41 38.73V256h68.78l-11 71.69h-57.78V501C413.31 482.38 504 379.78 504 256z"
                       fill="currentColor"
                       style={Object {}}
                     />
@@ -3164,14 +3312,36 @@ exports[`<ProfilePage /> Renders correctly in various states without credentials
                         target="_blank"
                       >
                         View Certificate
-                        <span>
+                        <span
+                          className="d-inline-block align-text-top"
+                        >
                            
                           <span
-                            aria-hidden={false}
-                            aria-label="Opens in a new window"
-                            className="fa fa-external-link"
-                            title="Opens in a new window"
-                          />
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "height": "1em",
+                                "width": "1em",
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              aria-label=""
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M19 19H5V5h7V3H3v18h18v-9h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </a>
                     </div>

webpack.prod.config.js

@@ -1,21 +0,0 @@
-const glob = require('glob');
-const PurgecssPlugin = require('purgecss-webpack-plugin');
-const { createConfig } = require('@edx/frontend-build');
-
-module.exports = createConfig('webpack-prod', {
-  plugins: [
-    // Scan files for class names and ids and remove unused css
-    new PurgecssPlugin({
-      paths: [].concat(
-        // Scan files in this app
-        glob.sync('src/**/*', { nodir: true }),
-        // Scan files in any edx frontend-component
-        glob.sync('node_modules/@edx/frontend-component*/**/*', { nodir: true }),
-        // Scan files in paragon
-        glob.sync('node_modules/@edx/paragon/**/*', { nodir: true }),
-      ),
-      // Protect react-css-transition class names
-      whitelistPatterns: [/-enter/, /-appear/, /-exit/],
-    }),
-  ],
-});