fix(i18n): update translations

Merge pull request #31 from edx/robrap/ARCH-748-fix-i18n-jobs
fix(i18n): fix i18n make targets
2019-05-19 17:33:41 -04:00 · 2019-05-16 13:20:46 -04:00 · 2019-05-16 12:57:21 -04:00 · 2019-05-16 09:44:44 -07:00 · 2019-05-16 12:27:27 -04:00 · 2019-05-10 16:55:50 -04:00
21 changed files with 3544 additions and 571 deletions
--- a/.babelrc
+++ b/.babelrc
@@ -1,43 +1,26 @@
 {
+  "presets": [
+    ["env", {
+      "targets": {
+        "browsers": ["last 2 versions", "ie 11"]
+      }
+    }],
+    "babel-preset-react"
+  ],
+  "plugins": [
+    "transform-object-rest-spread"
+  ],
  "env": {
-    "development": {
-      "presets": [
-        ["env", {
-          "targets": {
-            "browsers": ["last 2 versions", "ie 11"]
-          }
-        }],
-        "babel-preset-react"
-      ],
-      "plugins": [
-        "transform-object-rest-spread"
-      ]
-    },
    "test": {
-      "presets": [
-        ["env", {
-          "targets": {
-            "browsers": ["last 2 versions", "ie 11"]
-          }
-        }],
-        "babel-preset-react"
-      ],
      "plugins": [
-        "rewire",
-        "transform-object-rest-spread"
+        "rewire"
      ]
    },
-    "production": {
-      "presets": [
-        ["env", {
-          "targets": {
-            "browsers": ["last 2 versions", "ie 11"]
-          }
-        }],
-        "babel-preset-react"
-      ],
+    "i18n": {
      "plugins": [
-        "transform-object-rest-spread"
+        ["react-intl", {
+          "messagesDir": "./temp"
+        }]
      ]
    }
  }
--- a/.gitignore
+++ b/.gitignore
@@ -1,5 +1,8 @@
 coverage
 dist
 node_modules
+temp

 .idea/
+
+src/i18n/transifex_input.json
--- a/.travis.yml
+++ b/.travis.yml
@@ -8,6 +8,7 @@ install:
  - npm install
 script:
  - npm run lint
+  - npm run i18n_extract
  - npm run test
  - npm run build
 after_success:
--- a/.tx/config
+++ b/.tx/config
@@ -0,0 +1,8 @@
+[main]
+host = https://www.transifex.com
+
+[edx-platform.frontend-component-footer]
+file_filter = src/i18n/messages/<lang>.json
+source_file = src/i18n/transifex_input.json
+source_lang = en
+type = KEYVALUEJSON
--- a/41
+++ b/41
@@ -0,0 +1,41 @@
+requirements:
+	npm install
+
+i18n.extract:
+    # Pulling display strings from .jsx files into .json files...
+	npm run-script i18n_extract
+
+i18n.concat:
+    # Gathering JSON messages into one file...
+	./src/i18n/i18n-concat.js ./temp/src ./src/i18n/transifex_input.json
+
+
+# The following make targets are required by our tooling scripts found in:
+# - https://github.com/edx/ecommerce-scripts/tree/master/transifex
+
+extract_translations: | requirements i18n.extract i18n.concat
+
+detect_changed_source_translations:
+	git diff --exit-code ./src/i18n/transifex_input.json
+
+tx_url1 = https://www.transifex.com/api/2/project/edx-platform/resource/frontend-component-footer/translation/en/strings/
+tx_url2 = https://www.transifex.com/api/2/project/edx-platform/resource/frontend-component-footer/source/
+
+# push translations to Transifex, doing magic so we can include the translator comments
+# Note: extract_translations is a prereq that our translation script calls separately.
+push_translations:
+	tx push -s
+	# Adding translator comments...
+	# Fetching strings from Transifex...
+	./node_modules/reactifex/bash_scripts/get_hashed_strings.sh $(tx_url1)
+    # Writing out comments to file...
+	./src/i18n/i18n-concat.js ./temp/src --comments
+    # Adding comments to Transifex...
+	./node_modules/reactifex/bash_scripts/put_comments.sh $(tx_url2)
+
+# pull translations from Transifex
+pull_translations: ## must be exactly this name for edx tooling support, see ecommerce-scripts/transifex/pull.py
+	tx pull -f --mode reviewed --language="ar,fr,es_419,zh_CN"
+
+validate-no-uncommitted-package-lock-changes:
+	git diff --exit-code package-lock.json
--- a/README.rst
+++ b/README.rst
@@ -7,8 +7,7 @@ frontend-component-footer
 frontend-component-footer is a library containing a site footer
 component for use when building edX frontend applications.

-At this time, this componenet is hard-coded to match the legacy LMS site footer, including all of its links.
-Note: As implemented, it should really be called the ``frontend-component-lms-footer``.
+At this time, this component is hard-coded to match the legacy LMS site footer, including all of its links. As implemented, this component should probably be called the ``frontend-component-lms-footer``.

 Usage
 -----
@@ -18,9 +17,14 @@ To install frontend-component-footer into your project::
   npm i --save @edx/frontend-component-footer

 The component expects properties specifying the various URLs that are
-linked in the footer. See the sample app in src/index.jsx for an example
+linked in the footer. See the sample app in `src/index.jsx <src/index.jsx>`__ for an example
 of how the SiteFooter component can be specified.

+Requirements
+------------
+
+This component uses ``react-intl``. Any containing app must provide ``react-intl`` as a peer dependency, and be wrapped inside an ``IntlProvider`` element, whether or not your consuming application is actually localized. For a basic default locale (English) version, follow the ``IntlProvider`` example in the sample application in `src/index.jsx <src/index.jsx>`__.
+
 Development
 -----------

--- a/config/webpack.dev.config.js
+++ b/config/webpack.dev.config.js
@@ -1,9 +1,9 @@
 // This is the dev Webpack config. All settings here should prefer a fast build
 // time at the expense of creating larger, unoptimized bundles.
-const Merge = require('webpack-merge');
+const Merge = require('webpack-merge'); // eslint-disable-line import/no-extraneous-dependencies
 const path = require('path');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin'); // eslint-disable-line import/no-extraneous-dependencies
+const webpack = require('webpack'); // eslint-disable-line import/no-extraneous-dependencies

 const commonConfig = require('./webpack.common.config.js');

--- a/config/webpack.prod.config.js
+++ b/config/webpack.prod.config.js
@@ -1,9 +1,9 @@
 // This is the prod Webpack config. All settings here should prefer smaller,
 // optimized bundles at the expense of a longer build time.
-const Merge = require('webpack-merge');
+const Merge = require('webpack-merge'); // eslint-disable-line import/no-extraneous-dependencies
 const commonConfig = require('./webpack.common.config.js');
 const path = require('path');
-const CleanWebpackPlugin = require('clean-webpack-plugin');
+const CleanWebpackPlugin = require('clean-webpack-plugin'); // eslint-disable-line import/no-extraneous-dependencies

 module.exports = Merge.smart(commonConfig, {
  mode: 'production',
@@ -13,6 +13,7 @@ module.exports = Merge.smart(commonConfig, {
    path: path.resolve(__dirname, '../dist'),
    library: 'frontend-component-footer',
    libraryTarget: 'umd',
+    globalObject: 'typeof self !== \'undefined\' ? self : this',
  },
  resolve: {
    extensions: ['.js', '.jsx'],
@@ -34,6 +35,18 @@ module.exports = Merge.smart(commonConfig, {
      amd: 'ReactDOM',
      root: 'ReactDOM',
    },
+    'react-intl': {
+      commonjs: 'react-intl',
+      commonjs2: 'react-intl',
+      amd: 'ReactIntl',
+      root: 'ReactIntl',
+    },
+    '@edx/paragon': {
+      commonjs: '@edx/paragon',
+      commonjs2: '@edx/paragon',
+      amd: 'Paragon',
+      root: 'Paragon',
+    },
  },
  plugins: [
    // Cleans the dist directory before each build
--- a/package-lock.json
+++ b/package-lock.json
@@ -914,6 +914,23 @@
        }
      }
    },
+    "@babel/runtime": {
+      "version": "7.3.4",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.3.4.tgz",
+      "integrity": "sha512-IvfvnMdSaLBateu0jfsYIpZTxAc2cKEXEMiezGGN75QcBcecDUKd3PgLAncT0oOgxKy8dd8hrJKj9MfzgfZd6g==",
+      "dev": true,
+      "requires": {
+        "regenerator-runtime": "^0.12.0"
+      },
+      "dependencies": {
+        "regenerator-runtime": {
+          "version": "0.12.1",
+          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
+          "integrity": "sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg==",
+          "dev": true
+        }
+      }
+    },
    "@babel/template": {
      "version": "7.2.2",
      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.2.2.tgz",
@@ -1405,7 +1422,6 @@
      "version": "1.0.3",
      "resolved": "https://registry.npmjs.org/@edx/edx-bootstrap/-/edx-bootstrap-1.0.3.tgz",
      "integrity": "sha512-3T6yYiLK9WdIn0iwjLoWfrsDqgfd0byiVB3aXK7w4oaltdVzA/fB/qU3iKrJ8cy4T6ZgDA2uFP726fU0StmxUw==",
-      "dev": true,
      "requires": {
        "bootstrap": "4.0.0",
        "jquery": "^3.2.1",
@@ -1416,7 +1432,6 @@
      "version": "3.8.0",
      "resolved": "https://registry.npmjs.org/@edx/paragon/-/paragon-3.8.0.tgz",
      "integrity": "sha512-4HqsCY8sA+2XdI/Jx2o+gqCJPpAUzJ+jlLvkUGiUSk/QxWKYIWAxuXAiE6kyZzA1I7C6+H7LlwWHG4ticoU+2g==",
-      "dev": true,
      "requires": {
        "@edx/edx-bootstrap": "^1.0.0",
        "@sambego/storybook-styles": "^1.0.0",
@@ -1435,6 +1450,58 @@
        "sanitize-html": "^1.18.2"
      }
    },
+    "@fortawesome/fontawesome-common-types": {
+      "version": "0.2.17",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.17.tgz",
+      "integrity": "sha512-DEYsEb/iiGVoMPQGjhG2uOylLVuMzTxOxysClkabZ5n80Q3oFDWGnshCLKvOvKoeClsgmKhWVrnnqvsMI1cAbw==",
+      "dev": true
+    },
+    "@fortawesome/fontawesome-svg-core": {
+      "version": "1.2.17",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.17.tgz",
+      "integrity": "sha512-TORMW/wIX2QyyGBd4XwHGPir4/0U18Wxf+iDBAUW3EIJ0/VC/ZMpJOiyiCe1f8g9h0PPzA7sqVtl8JtTUtm4uA==",
+      "dev": true,
+      "requires": {
+        "@fortawesome/fontawesome-common-types": "^0.2.17"
+      }
+    },
+    "@fortawesome/free-brands-svg-icons": {
+      "version": "5.8.1",
+      "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-5.8.1.tgz",
+      "integrity": "sha512-NN5Nap2D5e7Lusa5uarAUkcaO7PMbme5wmUF8kofZzPUZR753zDg/UFffi+LLE2Mi9zRXCJEYmIRfMON9SxLPg==",
+      "dev": true,
+      "requires": {
+        "@fortawesome/fontawesome-common-types": "^0.2.17"
+      }
+    },
+    "@fortawesome/free-regular-svg-icons": {
+      "version": "5.8.1",
+      "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-5.8.1.tgz",
+      "integrity": "sha512-U+tFjDyQpVdD0UPWoKRBVLhh0J1/q3iaWDrnxNMJKuKRmerc4d0jfiZdM2X7agOTcG7amvcllRBiWCu2FwYlMA==",
+      "dev": true,
+      "requires": {
+        "@fortawesome/fontawesome-common-types": "^0.2.17"
+      }
+    },
+    "@fortawesome/free-solid-svg-icons": {
+      "version": "5.8.1",
+      "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.8.1.tgz",
+      "integrity": "sha512-FUcxR75PtMOo3ihRHJOZz64IsWIVdWgB2vCMLJjquTv487wVVCMH5H5gWa72et2oI9lKKD2jvjQ+y+7mxhscVQ==",
+      "dev": true,
+      "requires": {
+        "@fortawesome/fontawesome-common-types": "^0.2.17"
+      }
+    },
+    "@fortawesome/react-fontawesome": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.1.4.tgz",
+      "integrity": "sha512-GwmxQ+TK7PEdfSwvxtGnMCqrfEm0/HbRHArbUudsYiy9KzVCwndxa2KMcfyTQ8El0vROrq8gOOff09RF1oQe8g==",
+      "dev": true,
+      "requires": {
+        "humps": "^2.0.1",
+        "prop-types": "^15.5.10"
+      }
+    },
    "@marionebl/sander": {
      "version": "0.6.1",
      "resolved": "https://registry.npmjs.org/@marionebl/sander/-/sander-0.6.1.tgz",
@@ -1507,8 +1574,7 @@
    "@sambego/storybook-styles": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/@sambego/storybook-styles/-/storybook-styles-1.0.0.tgz",
-      "integrity": "sha512-n0SqZwDewUDRaStEcoNMiYy9qovaLVStsh4Gb2dc2LLiG3IIK0UXdeR1N7puVuRihJq/192uOyGPCjZ/NAteuA==",
-      "dev": true
+      "integrity": "sha512-n0SqZwDewUDRaStEcoNMiYy9qovaLVStsh4Gb2dc2LLiG3IIK0UXdeR1N7puVuRihJq/192uOyGPCjZ/NAteuA=="
    },
    "@semantic-release/commit-analyzer": {
      "version": "6.1.0",
@@ -2145,7 +2211,6 @@
      "version": "2.11.0",
      "resolved": "https://registry.npmjs.org/airbnb-prop-types/-/airbnb-prop-types-2.11.0.tgz",
      "integrity": "sha512-Y46/0gNVDy5gpedxIaoKjigdes+TouqVg7GTYQr73PBfE/lTSvOR/WIgUib0Zonm3Hyvlcax0mHr+v4K8DfGGw==",
-      "dev": true,
      "requires": {
        "array.prototype.find": "^2.0.4",
        "function.prototype.name": "^1.1.0",
@@ -2264,7 +2329,6 @@
      "version": "3.2.1",
      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
      "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
-      "dev": true,
      "requires": {
        "color-convert": "^1.9.0"
      }
@@ -2436,8 +2500,7 @@
    "array-uniq": {
      "version": "1.0.3",
      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
-      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY=",
-      "dev": true
+      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY="
    },
    "array-unique": {
      "version": "0.2.1",
@@ -2449,7 +2512,6 @@
      "version": "2.0.4",
      "resolved": "https://registry.npmjs.org/array.prototype.find/-/array.prototype.find-2.0.4.tgz",
      "integrity": "sha1-VWpcU2LAhkgyPdrrnenRS8GGTJA=",
-      "dev": true,
      "requires": {
        "define-properties": "^1.1.2",
        "es-abstract": "^1.7.0"
@@ -2521,8 +2583,7 @@
    "assert-ok": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/assert-ok/-/assert-ok-1.0.0.tgz",
-      "integrity": "sha1-W1z3lfknXFnHFNZsOgbX3nDkPsg=",
-      "dev": true
+      "integrity": "sha1-W1z3lfknXFnHFNZsOgbX3nDkPsg="
    },
    "assert-plus": {
      "version": "1.0.0",
@@ -3033,6 +3094,17 @@
      "integrity": "sha1-5h+uBaHKiAGq3uV6bWa4zvr0QWc=",
      "dev": true
    },
+    "babel-plugin-react-intl": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-react-intl/-/babel-plugin-react-intl-3.0.1.tgz",
+      "integrity": "sha512-FqnEO+Tq7kJVUPKsSG3s5jaHi3pAC4RUR11IrscvjsfkOApLP2DtzNo6dtQ+tX+OzEzJx7cUms8aCw5BFyW5xg==",
+      "dev": true,
+      "requires": {
+        "@babel/runtime": "^7.0.0",
+        "intl-messageformat-parser": "^1.2.0",
+        "mkdirp": "^0.5.1"
+      }
+    },
    "babel-plugin-rewire": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/babel-plugin-rewire/-/babel-plugin-rewire-1.2.0.tgz",
@@ -3414,7 +3486,6 @@
      "version": "6.26.0",
      "resolved": "https://registry.npmjs.org/babel-polyfill/-/babel-polyfill-6.26.0.tgz",
      "integrity": "sha1-N5k3q8Z9eJWXCtxiHyhM2WbPIVM=",
-      "dev": true,
      "requires": {
        "babel-runtime": "^6.26.0",
        "core-js": "^2.5.0",
@@ -3424,8 +3495,7 @@
        "regenerator-runtime": {
          "version": "0.10.5",
          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz",
-          "integrity": "sha1-M2w+/BIgrc7dosn6tntaeVWjNlg=",
-          "dev": true
+          "integrity": "sha1-M2w+/BIgrc7dosn6tntaeVWjNlg="
        }
      }
    },
@@ -3519,7 +3589,6 @@
      "version": "6.26.0",
      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
      "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
-      "dev": true,
      "requires": {
        "core-js": "^2.4.0",
        "regenerator-runtime": "^0.11.0"
@@ -4013,8 +4082,7 @@
    "bootstrap": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.0.0.tgz",
-      "integrity": "sha512-gulJE5dGFo6Q61V/whS6VM4WIyrlydXfCgkE+Gxe5hjrJ8rXLLZlALq7zq2RPhOc45PSwQpJkrTnc2KgD6cvmA==",
-      "dev": true
+      "integrity": "sha512-gulJE5dGFo6Q61V/whS6VM4WIyrlydXfCgkE+Gxe5hjrJ8rXLLZlALq7zq2RPhOc45PSwQpJkrTnc2KgD6cvmA=="
    },
    "bottleneck": {
      "version": "2.15.0",
@@ -4557,7 +4625,6 @@
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/cast-array/-/cast-array-1.0.1.tgz",
      "integrity": "sha1-Jk7xEp5YiLxIysQP6RTp9puNGJ0=",
-      "dev": true,
      "requires": {
        "isarray": "0.0.1"
      },
@@ -4565,8 +4632,7 @@
        "isarray": {
          "version": "0.0.1",
          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
-          "dev": true
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
        }
      }
    },
@@ -4736,8 +4802,7 @@
    "classnames": {
      "version": "2.2.6",
      "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz",
-      "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q==",
-      "dev": true
+      "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q=="
    },
    "clean-css": {
      "version": "4.2.1",
@@ -4935,7 +5000,6 @@
      "version": "1.9.3",
      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
      "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
-      "dev": true,
      "requires": {
        "color-name": "1.1.3"
      }
@@ -4943,8 +5007,7 @@
    "color-name": {
      "version": "1.1.3",
      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
-      "dev": true
+      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
    },
    "color-string": {
      "version": "0.3.0",
@@ -5275,8 +5338,7 @@
    "core-js": {
      "version": "2.6.1",
      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.1.tgz",
-      "integrity": "sha512-L72mmmEayPJBejKIWe2pYtGis5r0tQ5NaJekdhyXgeMQTpJoBsH0NL4ElY2LfSoV15xeQWKQ+XTTOZdyero5Xg==",
-      "dev": true
+      "integrity": "sha512-L72mmmEayPJBejKIWe2pYtGis5r0tQ5NaJekdhyXgeMQTpJoBsH0NL4ElY2LfSoV15xeQWKQ+XTTOZdyero5Xg=="
    },
    "core-util-is": {
      "version": "1.0.2",
@@ -5485,8 +5547,7 @@
    "css-mediaquery": {
      "version": "0.1.2",
      "resolved": "https://registry.npmjs.org/css-mediaquery/-/css-mediaquery-0.1.2.tgz",
-      "integrity": "sha1-aiw3NEkoYYYxxUvTPO3TAdoYvqA=",
-      "dev": true
+      "integrity": "sha1-aiw3NEkoYYYxxUvTPO3TAdoYvqA="
    },
    "css-select": {
      "version": "1.2.0",
@@ -5835,8 +5896,7 @@
    "decode-uri-component": {
      "version": "0.2.0",
      "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz",
-      "integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU=",
-      "dev": true
+      "integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU="
    },
    "decompress": {
      "version": "4.2.0",
@@ -6060,7 +6120,6 @@
      "version": "1.1.3",
      "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.3.tgz",
      "integrity": "sha512-3MqfYKj2lLzdMSf8ZIZE/V+Zuy+BgD6f164e8K2w7dgnpKArBDerGYpM46IYYcjnkdPNMjPk9A6VFB8+3SKlXQ==",
-      "dev": true,
      "requires": {
        "object-keys": "^1.0.12"
      }
@@ -6289,7 +6348,6 @@
      "version": "0.1.0",
      "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
      "integrity": "sha1-BzxpdUbOB4DOI75KKOKT5AvDDII=",
-      "dev": true,
      "requires": {
        "domelementtype": "~1.1.1",
        "entities": "~1.1.1"
@@ -6298,8 +6356,7 @@
        "domelementtype": {
          "version": "1.1.3",
          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz",
-          "integrity": "sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs=",
-          "dev": true
+          "integrity": "sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs="
        }
      }
    },
@@ -6312,8 +6369,7 @@
    "domelementtype": {
      "version": "1.3.1",
      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.1.tgz",
-      "integrity": "sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w==",
-      "dev": true
+      "integrity": "sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w=="
    },
    "domexception": {
      "version": "1.0.1",
@@ -6328,7 +6384,6 @@
      "version": "2.4.2",
      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.2.tgz",
      "integrity": "sha512-JiK04h0Ht5u/80fdLMCEmV4zkNh2BcoMFBmZ/91WtYZ8qVXSKjiw7fXMgFPnHcSZgOo3XdinHvmnDUeMf5R4wA==",
-      "dev": true,
      "requires": {
        "domelementtype": "1"
      }
@@ -6337,7 +6392,6 @@
      "version": "1.7.0",
      "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.7.0.tgz",
      "integrity": "sha512-Lgd2XcJ/NjEw+7tFvfKxOzCYKZsdct5lczQ2ZaQY8Djz7pfAD3Gbp8ySJWtreII/vDlMVmxwa6pHmdxIYgttDg==",
-      "dev": true,
      "requires": {
        "dom-serializer": "0",
        "domelementtype": "1"
@@ -6453,7 +6507,6 @@
      "version": "1.1.7",
      "resolved": "https://registry.npmjs.org/email-prop-type/-/email-prop-type-1.1.7.tgz",
      "integrity": "sha512-5dhzRyH20+oooO5ZN4xJBSKuXj5gVg523gYGlj/bADXXx6ZsiB8x0XgPGLWOeZee9sURjgtyVc0RoBkfh0AfaA==",
-      "dev": true,
      "requires": {
        "email-validator": "^2.0.0"
      }
@@ -6461,8 +6514,7 @@
    "email-validator": {
      "version": "2.0.4",
      "resolved": "https://registry.npmjs.org/email-validator/-/email-validator-2.0.4.tgz",
-      "integrity": "sha512-gYCwo7kh5S3IDyZPLZf6hSS0MnZT8QmJFqYvbqlDZSbwdZlY6QZWxJ4i/6UhITOJ4XzyI647Bm2MXKCLqnJ4nQ==",
-      "dev": true
+      "integrity": "sha512-gYCwo7kh5S3IDyZPLZf6hSS0MnZT8QmJFqYvbqlDZSbwdZlY6QZWxJ4i/6UhITOJ4XzyI647Bm2MXKCLqnJ4nQ=="
    },
    "emoji-regex": {
      "version": "6.5.1",
@@ -6505,8 +6557,7 @@
    "entities": {
      "version": "1.1.2",
      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.2.tgz",
-      "integrity": "sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w==",
-      "dev": true
+      "integrity": "sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w=="
    },
    "env-ci": {
      "version": "3.1.3",
@@ -6633,7 +6684,6 @@
      "version": "1.13.0",
      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.13.0.tgz",
      "integrity": "sha512-vDZfg/ykNxQVwup/8E1BZhVzFfBxs9NqMzGcvIJrqg5k2/5Za2bWo40dK2J1pgLngZ7c+Shh8lwYtLGyrwPutg==",
-      "dev": true,
      "requires": {
        "es-to-primitive": "^1.2.0",
        "function-bind": "^1.1.1",
@@ -6647,7 +6697,6 @@
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.2.0.tgz",
      "integrity": "sha512-qZryBOJjV//LaxLTV6UC//WewneB3LcXOL9NP++ozKVXsIIIpm/2c13UDiD9Jp2eThsecw9m3jPqDwTyobcdbg==",
-      "dev": true,
      "requires": {
        "is-callable": "^1.1.4",
        "is-date-object": "^1.0.1",
@@ -6678,8 +6727,7 @@
    "escape-string-regexp": {
      "version": "1.0.5",
      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
-      "dev": true
+      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
    },
    "escodegen": {
      "version": "1.11.0",
@@ -8707,8 +8755,7 @@
    "font-awesome": {
      "version": "4.7.0",
      "resolved": "https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz",
-      "integrity": "sha1-j6jPBBGhoxr9B7BtKQK7n8gVoTM=",
-      "dev": true
+      "integrity": "sha1-j6jPBBGhoxr9B7BtKQK7n8gVoTM="
    },
    "for-in": {
      "version": "1.0.2",
@@ -8834,7 +8881,8 @@
        "ansi-regex": {
          "version": "2.1.1",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "aproba": {
          "version": "1.2.0",
@@ -8855,12 +8903,14 @@
        "balanced-match": {
          "version": "1.0.0",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "brace-expansion": {
          "version": "1.1.11",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "balanced-match": "^1.0.0",
            "concat-map": "0.0.1"
@@ -8875,17 +8925,20 @@
        "code-point-at": {
          "version": "1.1.0",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "concat-map": {
          "version": "0.0.1",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "console-control-strings": {
          "version": "1.1.0",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "core-util-is": {
          "version": "1.0.2",
@@ -9002,7 +9055,8 @@
        "inherits": {
          "version": "2.0.3",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "ini": {
          "version": "1.3.5",
@@ -9014,6 +9068,7 @@
          "version": "1.0.0",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "number-is-nan": "^1.0.0"
          }
@@ -9028,6 +9083,7 @@
          "version": "3.0.4",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "brace-expansion": "^1.1.7"
          }
@@ -9035,12 +9091,14 @@
        "minimist": {
          "version": "0.0.8",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "minipass": {
          "version": "2.2.4",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "safe-buffer": "^5.1.1",
            "yallist": "^3.0.0"
@@ -9059,6 +9117,7 @@
          "version": "0.5.1",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "minimist": "0.0.8"
          }
@@ -9139,7 +9198,8 @@
        "number-is-nan": {
          "version": "1.0.1",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "object-assign": {
          "version": "4.1.1",
@@ -9151,6 +9211,7 @@
          "version": "1.4.0",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "wrappy": "1"
          }
@@ -9236,7 +9297,8 @@
        "safe-buffer": {
          "version": "5.1.1",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "safer-buffer": {
          "version": "2.1.2",
@@ -9272,6 +9334,7 @@
          "version": "1.0.2",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "code-point-at": "^1.0.0",
            "is-fullwidth-code-point": "^1.0.0",
@@ -9291,6 +9354,7 @@
          "version": "3.0.1",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "ansi-regex": "^2.0.0"
          }
@@ -9334,12 +9398,14 @@
        "wrappy": {
          "version": "1.0.2",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "yallist": {
          "version": "3.0.2",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        }
      }
    },
@@ -9358,14 +9424,12 @@
    "function-bind": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
-      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==",
-      "dev": true
+      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
    },
    "function.prototype.name": {
      "version": "1.1.0",
      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.0.tgz",
      "integrity": "sha512-Bs0VRrTz4ghD8pTmbJQD1mZ8A/mN0ur/jGz+A6FBxPDUPkm1tNfF6bhTYPA7i7aF4lZJVr+OXTNNrnnIl58Wfg==",
-      "dev": true,
      "requires": {
        "define-properties": "^1.1.2",
        "function-bind": "^1.1.1",
@@ -9762,7 +9826,6 @@
      "version": "1.0.3",
      "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz",
      "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==",
-      "dev": true,
      "requires": {
        "function-bind": "^1.1.1"
      }
@@ -9779,8 +9842,7 @@
    "has-flag": {
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
-      "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
-      "dev": true
+      "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0="
    },
    "has-symbol-support-x": {
      "version": "1.4.2",
@@ -9791,8 +9853,7 @@
    "has-symbols": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.0.tgz",
-      "integrity": "sha1-uhqPGvKg/DllD1yFA2dwQSIGO0Q=",
-      "dev": true
+      "integrity": "sha1-uhqPGvKg/DllD1yFA2dwQSIGO0Q="
    },
    "has-to-string-tag-x": {
      "version": "1.4.1",
@@ -9906,6 +9967,11 @@
        "minimalistic-crypto-utils": "^1.0.1"
      }
    },
+    "hoist-non-react-statics": {
+      "version": "2.5.5",
+      "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
+      "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
+    },
    "home-or-tmp": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/home-or-tmp/-/home-or-tmp-2.0.0.tgz",
@@ -10032,7 +10098,6 @@
      "version": "3.10.0",
      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.10.0.tgz",
      "integrity": "sha512-J1nEUGv+MkXS0weHNWVKJJ+UrLfePxRWpN3C9bEi9fLxL2+ggW94DQvgYVXsaT30PGwYRIZKNZXuyMhp3Di4bQ==",
-      "dev": true,
      "requires": {
        "domelementtype": "^1.3.0",
        "domhandler": "^2.3.0",
@@ -10046,7 +10111,6 @@
          "version": "3.1.1",
          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.1.1.tgz",
          "integrity": "sha512-DkN66hPyqDhnIQ6Jcsvx9bFjhw214O4poMBcIMgPVpQvNy9a0e0Uhg5SqySyDKAmUlwt8LonTBz1ezOnM8pUdA==",
-          "dev": true,
          "requires": {
            "inherits": "^2.0.3",
            "string_decoder": "^1.1.1",
@@ -10464,6 +10528,12 @@
        }
      }
    },
+    "humps": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/humps/-/humps-2.0.1.tgz",
+      "integrity": "sha1-3QLqYIG9BWjcXQcxhEY5V7qe+ao=",
+      "dev": true
+    },
    "husky": {
      "version": "0.14.3",
      "resolved": "https://registry.npmjs.org/husky/-/husky-0.14.3.tgz",
@@ -10486,8 +10556,7 @@
    "hyphenate-style-name": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.2.tgz",
-      "integrity": "sha1-MRYKNpMK2vH8BMYHT360FGXU7Es=",
-      "dev": true
+      "integrity": "sha1-MRYKNpMK2vH8BMYHT360FGXU7Es="
    },
    "iconv-lite": {
      "version": "0.4.24",
@@ -10909,8 +10978,7 @@
    "inherits": {
      "version": "2.0.3",
      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
-      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
-      "dev": true
+      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
    },
    "ini": {
      "version": "1.3.5",
@@ -10987,6 +11055,32 @@
      "integrity": "sha512-mT34yGKMNceBQUoVn7iCDKDntA7SC6gycMAWzGx1z/CMCTV7b2AAtXlo3nRyHZ1FelRkQbQjprHSYGwzLtkVbw==",
      "dev": true
    },
+    "intl-format-cache": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/intl-format-cache/-/intl-format-cache-2.1.0.tgz",
+      "integrity": "sha1-BKNp/sv61tpgBbrh8UMzMy3PkxY="
+    },
+    "intl-messageformat": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/intl-messageformat/-/intl-messageformat-2.2.0.tgz",
+      "integrity": "sha1-NFvNRt5jC3aDMwwuUhd/9eq0hPw=",
+      "requires": {
+        "intl-messageformat-parser": "1.4.0"
+      }
+    },
+    "intl-messageformat-parser": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/intl-messageformat-parser/-/intl-messageformat-parser-1.4.0.tgz",
+      "integrity": "sha1-tD1FqXRoytvkQzHXS7Ho3qRPwHU="
+    },
+    "intl-relativeformat": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/intl-relativeformat/-/intl-relativeformat-2.1.0.tgz",
+      "integrity": "sha1-AQ8RBYAiUfQKxH0OPhogE0iiVd8=",
+      "requires": {
+        "intl-messageformat": "^2.0.0"
+      }
+    },
    "into-stream": {
      "version": "3.1.0",
      "resolved": "https://registry.npmjs.org/into-stream/-/into-stream-3.1.0.tgz",
@@ -11001,7 +11095,6 @@
      "version": "2.2.4",
      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
      "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
-      "dev": true,
      "requires": {
        "loose-envify": "^1.0.0"
      }
@@ -11084,8 +11177,7 @@
    "is-callable": {
      "version": "1.1.4",
      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.4.tgz",
-      "integrity": "sha512-r5p9sxJjYnArLjObpjA4xu5EKI3CuKHkJXMhT7kwbpUyIFD1n5PMAsoPvWnvtZiNz7LjkYDRZhd7FlI0eMijEA==",
-      "dev": true
+      "integrity": "sha512-r5p9sxJjYnArLjObpjA4xu5EKI3CuKHkJXMhT7kwbpUyIFD1n5PMAsoPvWnvtZiNz7LjkYDRZhd7FlI0eMijEA=="
    },
    "is-ci": {
      "version": "1.2.1",
@@ -11117,8 +11209,7 @@
    "is-date-object": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz",
-      "integrity": "sha1-mqIOtq7rv/d/vTPnTKAbM1gdOhY=",
-      "dev": true
+      "integrity": "sha1-mqIOtq7rv/d/vTPnTKAbM1gdOhY="
    },
    "is-descriptor": {
      "version": "0.1.6",
@@ -11358,7 +11449,6 @@
      "version": "1.0.4",
      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz",
      "integrity": "sha1-VRdIm1RwkbCTDglWVM7SXul+lJE=",
-      "dev": true,
      "requires": {
        "has": "^1.0.1"
      }
@@ -11412,7 +11502,6 @@
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.2.tgz",
      "integrity": "sha512-HS8bZ9ox60yCJLH9snBpIwv9pYUAkcuLhSA1oero1UB5y9aiQpRA8y2ex945AOtCZL1lJDeIk3G5LthswI46Lw==",
-      "dev": true,
      "requires": {
        "has-symbols": "^1.0.0"
      }
@@ -12050,8 +12139,7 @@
    "jquery": {
      "version": "3.3.1",
      "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.3.1.tgz",
-      "integrity": "sha512-Ubldcmxp5np52/ENotGxlLe6aGMvmF4R8S6tZjsP6Knsaxd/xp3Zrh50cG93lR6nPXyUFwzN3ZSOQI0wRJNdGg==",
-      "dev": true
+      "integrity": "sha512-Ubldcmxp5np52/ENotGxlLe6aGMvmF4R8S6tZjsP6Knsaxd/xp3Zrh50cG93lR6nPXyUFwzN3ZSOQI0wRJNdGg=="
    },
    "js-base64": {
      "version": "2.5.0",
@@ -12068,8 +12156,7 @@
    "js-tokens": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
-      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
-      "dev": true
+      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
    },
    "js-yaml": {
      "version": "3.12.1",
@@ -12396,8 +12483,7 @@
    "lodash.clonedeep": {
      "version": "4.5.0",
      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
-      "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8=",
-      "dev": true
+      "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8="
    },
    "lodash.debounce": {
      "version": "4.0.8",
@@ -12414,8 +12500,7 @@
    "lodash.escaperegexp": {
      "version": "4.1.2",
      "resolved": "https://registry.npmjs.org/lodash.escaperegexp/-/lodash.escaperegexp-4.1.2.tgz",
-      "integrity": "sha1-ZHYsSGGAglGKw99Mz11YhtriA0c=",
-      "dev": true
+      "integrity": "sha1-ZHYsSGGAglGKw99Mz11YhtriA0c="
    },
    "lodash.flattendeep": {
      "version": "4.4.0",
@@ -12438,14 +12523,12 @@
    "lodash.isplainobject": {
      "version": "4.0.6",
      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
-      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs=",
-      "dev": true
+      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
    },
    "lodash.isstring": {
      "version": "4.0.1",
      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
-      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE=",
-      "dev": true
+      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE="
    },
    "lodash.kebabcase": {
      "version": "4.1.1",
@@ -12468,8 +12551,7 @@
    "lodash.mergewith": {
      "version": "4.6.1",
      "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.1.tgz",
-      "integrity": "sha512-eWw5r+PYICtEBgrBE5hhlT6aAa75f411bgDz/ZL2KZqYV03USvucsxcHUIlGTDTECs1eunpI7HOV7U+WLDvNdQ==",
-      "dev": true
+      "integrity": "sha512-eWw5r+PYICtEBgrBE5hhlT6aAa75f411bgDz/ZL2KZqYV03USvucsxcHUIlGTDTECs1eunpI7HOV7U+WLDvNdQ=="
    },
    "lodash.omit": {
      "version": "4.5.0",
@@ -12604,7 +12686,6 @@
      "version": "1.4.0",
      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
      "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
-      "dev": true,
      "requires": {
        "js-tokens": "^3.0.0 || ^4.0.0"
      }
@@ -12833,12 +12914,21 @@
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/mailto-link/-/mailto-link-1.0.0.tgz",
      "integrity": "sha1-9Sqp/MEXPLOAkV3xZNsxSRiRUl0=",
-      "dev": true,
      "requires": {
        "assert-ok": "~1.0.0",
        "cast-array": "~1.0.0",
        "object-filter": "~1.0.2",
        "query-string": "~2.4.1"
+      },
+      "dependencies": {
+        "query-string": {
+          "version": "2.4.2",
+          "resolved": "https://registry.npmjs.org/query-string/-/query-string-2.4.2.tgz",
+          "integrity": "sha1-fbBmZCCAS6qSrp8miWKFWnYUPfs=",
+          "requires": {
+            "strict-uri-encode": "^1.0.0"
+          }
+        }
      }
    },
    "make-dir": {
@@ -12925,7 +13015,6 @@
      "version": "0.3.0",
      "resolved": "https://registry.npmjs.org/matchmediaquery/-/matchmediaquery-0.3.0.tgz",
      "integrity": "sha512-u0dlv+VENJ+3YepvwSPBieuvnA6DWfaYa/ctwysAR13y4XLJNyt7bEVKzNj/Nvjo+50d88Pj+xL9xaSo6JmX/w==",
-      "dev": true,
      "requires": {
        "css-mediaquery": "^0.1.2"
      }
@@ -16956,8 +17045,7 @@
    "number-is-nan": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
-      "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
-      "dev": true
+      "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0="
    },
    "nwsapi": {
      "version": "2.0.9",
@@ -16974,8 +17062,7 @@
    "object-assign": {
      "version": "4.1.1",
      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
-      "dev": true
+      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
    },
    "object-copy": {
      "version": "0.1.0",
@@ -17002,8 +17089,7 @@
    "object-filter": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/object-filter/-/object-filter-1.0.2.tgz",
-      "integrity": "sha1-rwt5f/6+r4pSxmN87b6IFs/sG8g=",
-      "dev": true
+      "integrity": "sha1-rwt5f/6+r4pSxmN87b6IFs/sG8g="
    },
    "object-inspect": {
      "version": "1.6.0",
@@ -17014,14 +17100,12 @@
    "object-is": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.0.1.tgz",
-      "integrity": "sha1-CqYOyZiaCz7Xlc9NBvYs8a1lObY=",
-      "dev": true
+      "integrity": "sha1-CqYOyZiaCz7Xlc9NBvYs8a1lObY="
    },
    "object-keys": {
      "version": "1.0.12",
      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.12.tgz",
-      "integrity": "sha512-FTMyFUm2wBcGHnH2eXmz7tC6IwlqQZ6mVZ+6dm6vZ4IQIHjs6FdNsQBuKGPuUUUY6NfJw2PshC08Tn6LzLDOag==",
-      "dev": true
+      "integrity": "sha512-FTMyFUm2wBcGHnH2eXmz7tC6IwlqQZ6mVZ+6dm6vZ4IQIHjs6FdNsQBuKGPuUUUY6NfJw2PshC08Tn6LzLDOag=="
    },
    "object-visit": {
      "version": "1.0.1",
@@ -17044,7 +17128,6 @@
      "version": "4.1.0",
      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.0.tgz",
      "integrity": "sha512-exHJeq6kBKj58mqGyTQ9DFvrZC/eR6OwxzoM9YRoGBqrXYonaFyGiFMuc9VZrXf7DarreEwMpurG3dd+CNyW5w==",
-      "dev": true,
      "requires": {
        "define-properties": "^1.1.2",
        "function-bind": "^1.1.1",
@@ -17056,7 +17139,6 @@
      "version": "1.1.0",
      "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.1.0.tgz",
      "integrity": "sha512-l+H6EQ8qzGRxbkHOd5I/aHRhHDKoQXQ8g0BYt4uSweQU1/J6dZUOyWh9a2Vky35YCKjzmgxOzta2hH6kf9HuXA==",
-      "dev": true,
      "requires": {
        "define-properties": "^1.1.3",
        "es-abstract": "^1.12.0",
@@ -17763,8 +17845,7 @@
    "popper.js": {
      "version": "1.14.6",
      "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.14.6.tgz",
-      "integrity": "sha512-AGwHGQBKumlk/MDfrSOf0JHhJCImdDMcGNoqKmKkU+68GFazv3CQ6q9r7Ja1sKDZmYWTckY/uLyEznheTDycnA==",
-      "dev": true
+      "integrity": "sha512-AGwHGQBKumlk/MDfrSOf0JHhJCImdDMcGNoqKmKkU+68GFazv3CQ6q9r7Ja1sKDZmYWTckY/uLyEznheTDycnA=="
    },
    "portfinder": {
      "version": "1.0.20",
@@ -17795,7 +17876,6 @@
      "version": "7.0.7",
      "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.7.tgz",
      "integrity": "sha512-HThWSJEPkupqew2fnuQMEI2YcTj/8gMV3n80cMdJsKxfIh5tHf7nM5JigNX6LxVMqo6zkgQNAI88hyFvBk41Pg==",
-      "dev": true,
      "requires": {
        "chalk": "^2.4.1",
        "source-map": "^0.6.1",
@@ -17806,7 +17886,6 @@
          "version": "2.4.2",
          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
          "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-          "dev": true,
          "requires": {
            "ansi-styles": "^3.2.1",
            "escape-string-regexp": "^1.0.5",
@@ -19883,7 +19962,6 @@
      "version": "15.6.2",
      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.2.tgz",
      "integrity": "sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==",
-      "dev": true,
      "requires": {
        "loose-envify": "^1.3.1",
        "object-assign": "^4.1.1"
@@ -19893,7 +19971,6 @@
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/prop-types-exact/-/prop-types-exact-1.2.0.tgz",
      "integrity": "sha512-K+Tk3Kd9V0odiXFP9fwDHUYRyvK3Nun3GVyPapSIs5OBkITAm15W0CPFD/YKTkMUAbc0b9CUwRQp2ybiBIq+eA==",
-      "dev": true,
      "requires": {
        "has": "^1.0.3",
        "object.assign": "^4.1.0",
@@ -20000,11 +20077,12 @@
      "dev": true
    },
    "query-string": {
-      "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/query-string/-/query-string-2.4.2.tgz",
-      "integrity": "sha1-fbBmZCCAS6qSrp8miWKFWnYUPfs=",
-      "dev": true,
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/query-string/-/query-string-5.1.1.tgz",
+      "integrity": "sha512-gjWOsm2SoGlgLEdAGt7a6slVOk9mGiXmPFMqrEhLQ68rhQuBnpfs3+EmlvqKyxnCo9/PPlF+9MtY02S1aFg+Jw==",
      "requires": {
+        "decode-uri-component": "^0.2.0",
+        "object-assign": "^4.1.0",
        "strict-uri-encode": "^1.0.0"
      }
    },
@@ -20146,7 +20224,6 @@
      "version": "16.7.0",
      "resolved": "https://registry.npmjs.org/react/-/react-16.7.0.tgz",
      "integrity": "sha512-StCz3QY8lxTb5cl2HJxjwLFOXPIFQp+p+hxQfc8WE0QiLfCtIlKj8/+5tjjKm8uSTlAW+fCPaavGFS06V9Ar3A==",
-      "dev": true,
      "requires": {
        "loose-envify": "^1.1.0",
        "object-assign": "^4.1.1",
@@ -20393,7 +20470,6 @@
      "version": "16.7.0",
      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.7.0.tgz",
      "integrity": "sha512-D0Ufv1ExCAmF38P2Uh1lwpminZFRXEINJe53zRAbm4KPwSyd6DY/uDoS0Blj9jvPpn1+wivKpZYc8aAAN/nAkg==",
-      "dev": true,
      "requires": {
        "loose-envify": "^1.1.0",
        "object-assign": "^4.1.1",
@@ -20404,8 +20480,7 @@
    "react-element-proptypes": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/react-element-proptypes/-/react-element-proptypes-1.0.0.tgz",
-      "integrity": "sha1-ygpafBYk646CrQjqeIzfyWvBpRc=",
-      "dev": true
+      "integrity": "sha1-ygpafBYk646CrQjqeIzfyWvBpRc="
    },
    "react-error-overlay": {
      "version": "4.0.1",
@@ -20413,6 +20488,18 @@
      "integrity": "sha512-xXUbDAZkU08aAkjtUvldqbvI04ogv+a1XdHxvYuHPYKIVk/42BIOD0zSKTHAWV4+gDy3yGm283z2072rA2gdtw==",
      "dev": true
    },
+    "react-intl": {
+      "version": "2.8.0",
+      "resolved": "https://registry.npmjs.org/react-intl/-/react-intl-2.8.0.tgz",
+      "integrity": "sha512-1cSasNkHxZOXYYhms9Q1tSEWF8AWZQNq3nPLB/j8mYV0ZTSt2DhGQXHfKrKQMu4cgj9J1Crqg7xFPICTBgzqtQ==",
+      "requires": {
+        "hoist-non-react-statics": "^2.5.5",
+        "intl-format-cache": "^2.0.5",
+        "intl-messageformat": "^2.1.0",
+        "intl-relativeformat": "^2.1.0",
+        "invariant": "^2.1.1"
+      }
+    },
    "react-is": {
      "version": "16.7.0",
      "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.7.0.tgz",
@@ -20422,14 +20509,12 @@
    "react-proptype-conditional-require": {
      "version": "1.0.4",
      "resolved": "https://registry.npmjs.org/react-proptype-conditional-require/-/react-proptype-conditional-require-1.0.4.tgz",
-      "integrity": "sha1-acLVdB5t9eCPIw82u8KUTuEiJVU=",
-      "dev": true
+      "integrity": "sha1-acLVdB5t9eCPIw82u8KUTuEiJVU="
    },
    "react-responsive": {
      "version": "5.0.0",
      "resolved": "https://registry.npmjs.org/react-responsive/-/react-responsive-5.0.0.tgz",
      "integrity": "sha512-oEimZ0FTCC3/pjGDEBHOz06nWbBNDIbMGOdRYp6K9SBUmrqgNAX77hTiqvmRQeLyI97zz4F4kiaFRxFspDxE+w==",
-      "dev": true,
      "requires": {
        "hyphenate-style-name": "^1.0.0",
        "matchmediaquery": "^0.3.0",
@@ -20448,6 +20533,12 @@
        "scheduler": "^0.12.0"
      }
    },
+    "reactifex": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/reactifex/-/reactifex-1.1.1.tgz",
+      "integrity": "sha512-HH2N/b5tRxh7ypIgCRsiBl/CTxRkTEPf9DhIstaM6hne4WiwM5/bBbWuvVlRZc/i3FdqZED3pZ//6n4mtxma4w==",
+      "dev": true
+    },
    "read-pkg": {
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-3.0.0.tgz",
@@ -20869,8 +20960,7 @@
    "reflect.ownkeys": {
      "version": "0.2.0",
      "resolved": "https://registry.npmjs.org/reflect.ownkeys/-/reflect.ownkeys-0.2.0.tgz",
-      "integrity": "sha1-dJrO7H8/34tj+SegSAnpDFwLNGA=",
-      "dev": true
+      "integrity": "sha1-dJrO7H8/34tj+SegSAnpDFwLNGA="
    },
    "regenerate": {
      "version": "1.4.0",
@@ -20890,8 +20980,7 @@
    "regenerator-runtime": {
      "version": "0.11.1",
      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
-      "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==",
-      "dev": true
+      "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg=="
    },
    "regenerator-transform": {
      "version": "0.10.1",
@@ -21348,8 +21437,7 @@
    "safe-buffer": {
      "version": "5.1.2",
      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
-      "dev": true
+      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
    },
    "safe-regex": {
      "version": "1.1.0",
@@ -21683,7 +21771,6 @@
      "version": "1.20.0",
      "resolved": "https://registry.npmjs.org/sanitize-html/-/sanitize-html-1.20.0.tgz",
      "integrity": "sha512-BpxXkBoAG+uKCHjoXFmox6kCSYpnulABoGcZ/R3QyY9ndXbIM5S94eOr1IqnzTG8TnbmXaxWoDDzKC5eJv7fEQ==",
-      "dev": true,
      "requires": {
        "chalk": "^2.4.1",
        "htmlparser2": "^3.10.0",
@@ -21701,7 +21788,6 @@
          "version": "2.4.2",
          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
          "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-          "dev": true,
          "requires": {
            "ansi-styles": "^3.2.1",
            "escape-string-regexp": "^1.0.5",
@@ -21897,7 +21983,6 @@
      "version": "0.12.0",
      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.12.0.tgz",
      "integrity": "sha512-t7MBR28Akcp4Jm+QoR63XgAi9YgCUmgvDHqf5otgAj4QvdoBE4ImCX0ffehefePPG+aitiYHp0g/mW6s4Tp+dw==",
-      "dev": true,
      "requires": {
        "loose-envify": "^1.1.0",
        "object-assign": "^4.1.1"
@@ -22711,8 +22796,7 @@
    "source-map": {
      "version": "0.6.1",
      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-      "dev": true
+      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
    },
    "source-map-loader": {
      "version": "0.2.4",
@@ -22945,7 +23029,6 @@
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/srcset/-/srcset-1.0.0.tgz",
      "integrity": "sha1-pWad4StC87HV6D7QPHEEb8SPQe8=",
-      "dev": true,
      "requires": {
        "array-uniq": "^1.0.2",
        "number-is-nan": "^1.0.0"
@@ -23083,8 +23166,7 @@
    "strict-uri-encode": {
      "version": "1.1.0",
      "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz",
-      "integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM=",
-      "dev": true
+      "integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM="
    },
    "string-length": {
      "version": "2.0.0",
@@ -23139,7 +23221,6 @@
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
      "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
-      "dev": true,
      "requires": {
        "safe-buffer": "~5.1.0"
      }
@@ -23209,7 +23290,6 @@
      "version": "5.5.0",
      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
      "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
-      "dev": true,
      "requires": {
        "has-flag": "^3.0.0"
      }
@@ -24485,8 +24565,7 @@
    "util-deprecate": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
-      "dev": true
+      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
    },
    "util.promisify": {
      "version": "1.0.0",
@@ -26492,8 +26571,7 @@
    "xtend": {
      "version": "4.0.1",
      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
-      "integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68=",
-      "dev": true
+      "integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68="
    },
    "y18n": {
      "version": "3.2.1",
--- a/package.json
+++ b/package.json
@@ -9,9 +9,11 @@
  },
  "scripts": {
    "build": "NODE_ENV=production BABEL_ENV=production webpack  --config=config/webpack.prod.config.js",
+    "build:stats": "NODE_ENV=production BABEL_ENV=production webpack --config=config/webpack.prod.config.js --profile --progress --json > stats.json",
    "gc": "commit",
    "commitmsg": "commitlint -e $GIT_PARAMS",
    "coveralls": "cat ./coverage/lcov.info | coveralls",
+    "i18n_extract": "BABEL_ENV=i18n babel src --quiet > /dev/null",
    "lint": "eslint --ext .js --ext .jsx .",
    "precommit": "npm run lint",
    "prepublishOnly": "npm run build",
@@ -37,9 +39,15 @@
    "@commitlint/config-angular": "^6.0.2",
    "@commitlint/prompt": "^6.0.2",
    "@commitlint/prompt-cli": "^6.0.2",
+    "@fortawesome/fontawesome-svg-core": "^1.2.17",
+    "@fortawesome/free-brands-svg-icons": "^5.8.1",
+    "@fortawesome/free-regular-svg-icons": "^5.8.1",
+    "@fortawesome/free-solid-svg-icons": "^5.8.1",
+    "@fortawesome/react-fontawesome": "^0.1.4",
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
+    "babel-plugin-react-intl": "^3.0.1",
    "babel-plugin-rewire": "^1.2.0",
    "babel-plugin-transform-object-rest-spread": "^6.26.0",
    "babel-preset-env": "^1.7.0",
@@ -47,23 +55,21 @@
    "clean-webpack-plugin": "^0.1.19",
    "coveralls": "^3.0.0",
    "css-loader": "^0.28.9",
-    "@edx/paragon": "^3.8.0",
    "enzyme": "^3.3.0",
    "enzyme-adapter-react-16": "^1.1.1",
    "eslint": "^5.2.0",
    "eslint-config-edx": "^4.0.4",
    "eslint-plugin-jsx-a11y": "^6.1.2",
    "file-loader": "^1.1.9",
+    "glob": "^7.1.3",
    "html-webpack-plugin": "^3.2.0",
-    "image-webpack-loader": "^4.2.0",
    "husky": "^0.14.3",
+    "image-webpack-loader": "^4.2.0",
    "jest": "23.6.0",
    "node-sass": "^4.7.2",
-    "prop-types": "^15.5.10",
-    "react": "^16.4.2",
-    "react-dom": "^16.2.0",
    "react-dev-utils": "^5.0.0",
    "react-test-renderer": "^16.6.0",
+    "reactifex": "^1.1.1",
    "sass-loader": "^6.0.6",
    "semantic-release": "^15.1.7",
    "source-map-loader": "^0.2.1",
@@ -75,15 +81,13 @@
    "webpack-dev-server": "^3.1.9",
    "webpack-merge": "^4.2.1"
  },
-  "peerDependencies": {
+  "dependencies": {
    "@edx/paragon": "^3.8.0",
-    "clean-webpack-plugin": "^0.1.19",
-    "html-webpack-plugin": "^3.2.0",
    "prop-types": "^15.5.10",
+    "query-string": "^5.1.1",
    "react": "^16.4.2",
    "react-dom": "^16.2.0",
-    "webpack": "^4.19.1",
-    "webpack-merge": "^4.2.1"
+    "react-intl": "2.x"
  },
  "jest": {
    "setupFiles": [
--- a/src/i18n/i18n-concat.js
+++ b/src/i18n/i18n-concat.js
@@ -0,0 +1,65 @@
+#!/usr/bin/env node
+
+/**
+ * See the Makefile for how the required hash file is downloaded from Transifex.
+ */
+
+// NOTE: This script is called from Jenkins using devDependencies, so eslint is being
+// disabled so it doesn't force you to make these real dependencies.
+const fs = require('fs'); // eslint-disable-line import/no-extraneous-dependencies
+const glob = require('glob'); // eslint-disable-line import/no-extraneous-dependencies
+const path = require('path'); // eslint-disable-line import/no-extraneous-dependencies
+
+// Expected input: a directory, possibly containing subdirectories, with .json files.  Each .json
+// file is an array of translation triplets (id, description, defaultMessage).
+function gatherJson(dir) {
+  const ret = [];
+  const files = glob.sync(`${dir}/**/*.json`);
+
+  files.forEach((filename) => {
+    const messages = JSON.parse(fs.readFileSync(filename));
+    ret.push(...messages);
+  });
+  return ret;
+}
+
+// the hash file returns ids whose periods are "escaped" (sort of), like this:
+// "key": "profile\\.sociallinks\\.social\\.links"
+// so our regular messageIds won't match them out of the box
+function escapeDots(messageId) {
+  return messageId.replace(/\./g, '\\.');
+}
+
+const jsonDir = process.argv[2];
+const messageObjects = gatherJson(jsonDir);
+
+if (process.argv[3] === '--comments') { // prepare to handle the translator notes
+  const loggingPrefix = path.basename(`${__filename}`); // the name of this JS file
+  const bashScriptsPath = './node_modules/reactifex/bash_scripts';
+
+  const hashFile = `${bashScriptsPath}/hashmap.json`;
+  process.stdout.write(`${loggingPrefix}: reading hash file ${hashFile}\n`);
+  const messageInfo = JSON.parse(fs.readFileSync(hashFile));
+
+  const outputFile = `${bashScriptsPath}/hashed_data.txt`;
+  process.stdout.write(`${loggingPrefix}: writing to output file ${outputFile}\n`);
+  fs.writeFileSync(outputFile, '');
+
+  messageObjects.forEach((message) => {
+    const transifexFormatId = escapeDots(message.id);
+
+    const info = messageInfo.find(mi => mi.key === transifexFormatId);
+    if (info) {
+      fs.appendFileSync(outputFile, `${info.string_hash}|${message.description}\n`);
+    } else {
+      process.stdout.write(`${loggingPrefix}: string ${message.id} does not yet exist on transifex!\n`);
+    }
+  });
+} else {
+  const output = {};
+
+  messageObjects.forEach((message) => {
+    output[message.id] = message.defaultMessage;
+  });
+  fs.writeFileSync(process.argv[3], JSON.stringify(output, null, 2));
+}
--- a/src/i18n/messages/ar.json
+++ b/src/i18n/messages/ar.json
@@ -0,0 +1,39 @@
+{
+  "footer.site-footer.link.business": "{siteName} for Business",
+  "footer.site-footer.link.about": "About",
+  "footer.site-footer.link.affiliates": "Affiliates",
+  "footer.site-footer.link.open-source": "Open {siteName}",
+  "footer.site-footer.link.careers": "Careers",
+  "footer.site-footer.link.news": "News",
+  "footer.site-footer.link.header.legal": "Legal",
+  "footer.site-footer.link.terms-of-service": "Terms of Service & Honor Code",
+  "footer.site-footer.link.privacy": "Privacy Policy",
+  "footer.site-footer.link.accessibility": "Accessibility Policy",
+  "footer.site-footer.link.trademark": "Trademark Policy",
+  "footer.site-footer.link.sitemap": "Sitemap",
+  "footer.site-footer.link.header.connect": "Connect",
+  "footer.site-footer.link.blog": "Blog",
+  "footer.site-footer.link.contact-us": "Contact Us",
+  "footer.site-footer.link.help-center": "Help Center",
+  "footer.site-footer.link.media-kit": "Media Kit",
+  "footer.site-footer.link.donate": "Donate",
+  "footer.site-footer.copyright-text": "{copyrightSymbol} {startDate}–{endDate} {siteName} Inc.",
+  "footer.site-footer.trademark-text": "EdX, Open edX, and MicroMasters are registered trademarks of edX Inc. | {icpLicense}",
+  "footer.site-footer.site-logo.alt-text": "{siteName} logo",
+  "footer.site-footer.site-logo.aria-label": "{siteName} Home",
+  "footer.site-footer.facebook.title": "Facebook",
+  "footer.site-footer.facebook.screen-reader-text": "Like {siteName} on Facebook",
+  "footer.site-footer.twitter.title": "Twitter",
+  "footer.site-footer.twitter.screen-reader-text": "Follow {siteName} on Twitter",
+  "footer.site-footer.youtube.title": "Youtube",
+  "footer.site-footer.youtube.screen-reader-text": "Subscribe to the {siteName} YouTube channel",
+  "footer.site-footer.linkedin.title": "LinkedIn",
+  "footer.site-footer.linkedin.screen-reader-text": "Follow {siteName} on LinkedIn",
+  "footer.site-footer.google-plus.title": "Google+",
+  "footer.site-footer.google-plus.screen-reader-text": "Follow {siteName} on Google+",
+  "footer.site-footer.reddit.title": "Reddit",
+  "footer.site-footer.reddit.screen-reader-text": "Subscribe to the {siteName} subreddit",
+  "footer.site-footer.apple-app-store.alt-text": "Download the {siteName} mobile app from the Apple App Store",
+  "footer.site-footer.google-play.alt-text": "Download the {siteName} mobile app from Google Play",
+  "footer.site-footer.footer.aria-label": "Page Footer"
+}
--- a/src/i18n/messages/es_419.json
+++ b/src/i18n/messages/es_419.json
@@ -0,0 +1,39 @@
+{
+  "footer.site-footer.link.business": "{siteName} for Business",
+  "footer.site-footer.link.about": "About",
+  "footer.site-footer.link.affiliates": "Affiliates",
+  "footer.site-footer.link.open-source": "Open {siteName}",
+  "footer.site-footer.link.careers": "Careers",
+  "footer.site-footer.link.news": "News",
+  "footer.site-footer.link.header.legal": "Legal",
+  "footer.site-footer.link.terms-of-service": "Terms of Service & Honor Code",
+  "footer.site-footer.link.privacy": "Privacy Policy",
+  "footer.site-footer.link.accessibility": "Accessibility Policy",
+  "footer.site-footer.link.trademark": "Trademark Policy",
+  "footer.site-footer.link.sitemap": "Sitemap",
+  "footer.site-footer.link.header.connect": "Connect",
+  "footer.site-footer.link.blog": "Blog",
+  "footer.site-footer.link.contact-us": "Contact Us",
+  "footer.site-footer.link.help-center": "Help Center",
+  "footer.site-footer.link.media-kit": "Media Kit",
+  "footer.site-footer.link.donate": "Donate",
+  "footer.site-footer.copyright-text": "{copyrightSymbol} {startDate}–{endDate} {siteName} Inc.",
+  "footer.site-footer.trademark-text": "EdX, Open edX, and MicroMasters are registered trademarks of edX Inc. | {icpLicense}",
+  "footer.site-footer.site-logo.alt-text": "{siteName} logo",
+  "footer.site-footer.site-logo.aria-label": "{siteName} Home",
+  "footer.site-footer.facebook.title": "Facebook",
+  "footer.site-footer.facebook.screen-reader-text": "Like {siteName} on Facebook",
+  "footer.site-footer.twitter.title": "Twitter",
+  "footer.site-footer.twitter.screen-reader-text": "Follow {siteName} on Twitter",
+  "footer.site-footer.youtube.title": "Youtube",
+  "footer.site-footer.youtube.screen-reader-text": "Subscribe to the {siteName} YouTube channel",
+  "footer.site-footer.linkedin.title": "LinkedIn",
+  "footer.site-footer.linkedin.screen-reader-text": "Follow {siteName} on LinkedIn",
+  "footer.site-footer.google-plus.title": "Google+",
+  "footer.site-footer.google-plus.screen-reader-text": "Follow {siteName} on Google+",
+  "footer.site-footer.reddit.title": "Reddit",
+  "footer.site-footer.reddit.screen-reader-text": "Subscribe to the {siteName} subreddit",
+  "footer.site-footer.apple-app-store.alt-text": "Download the {siteName} mobile app from the Apple App Store",
+  "footer.site-footer.google-play.alt-text": "Download the {siteName} mobile app from Google Play",
+  "footer.site-footer.footer.aria-label": "Page Footer"
+}
--- a/src/i18n/messages/fr.json
+++ b/src/i18n/messages/fr.json
@@ -0,0 +1,39 @@
+{
+  "footer.site-footer.link.business": "{siteName} for Business",
+  "footer.site-footer.link.about": "About",
+  "footer.site-footer.link.affiliates": "Affiliates",
+  "footer.site-footer.link.open-source": "Open {siteName}",
+  "footer.site-footer.link.careers": "Careers",
+  "footer.site-footer.link.news": "News",
+  "footer.site-footer.link.header.legal": "Legal",
+  "footer.site-footer.link.terms-of-service": "Terms of Service & Honor Code",
+  "footer.site-footer.link.privacy": "Privacy Policy",
+  "footer.site-footer.link.accessibility": "Accessibility Policy",
+  "footer.site-footer.link.trademark": "Trademark Policy",
+  "footer.site-footer.link.sitemap": "Sitemap",
+  "footer.site-footer.link.header.connect": "Connect",
+  "footer.site-footer.link.blog": "Blog",
+  "footer.site-footer.link.contact-us": "Contact Us",
+  "footer.site-footer.link.help-center": "Help Center",
+  "footer.site-footer.link.media-kit": "Media Kit",
+  "footer.site-footer.link.donate": "Donate",
+  "footer.site-footer.copyright-text": "{copyrightSymbol} {startDate}–{endDate} {siteName} Inc.",
+  "footer.site-footer.trademark-text": "EdX, Open edX, and MicroMasters are registered trademarks of edX Inc. | {icpLicense}",
+  "footer.site-footer.site-logo.alt-text": "{siteName} logo",
+  "footer.site-footer.site-logo.aria-label": "{siteName} Home",
+  "footer.site-footer.facebook.title": "Facebook",
+  "footer.site-footer.facebook.screen-reader-text": "Like {siteName} on Facebook",
+  "footer.site-footer.twitter.title": "Twitter",
+  "footer.site-footer.twitter.screen-reader-text": "Follow {siteName} on Twitter",
+  "footer.site-footer.youtube.title": "Youtube",
+  "footer.site-footer.youtube.screen-reader-text": "Subscribe to the {siteName} YouTube channel",
+  "footer.site-footer.linkedin.title": "LinkedIn",
+  "footer.site-footer.linkedin.screen-reader-text": "Follow {siteName} on LinkedIn",
+  "footer.site-footer.google-plus.title": "Google+",
+  "footer.site-footer.google-plus.screen-reader-text": "Follow {siteName} on Google+",
+  "footer.site-footer.reddit.title": "Reddit",
+  "footer.site-footer.reddit.screen-reader-text": "Subscribe to the {siteName} subreddit",
+  "footer.site-footer.apple-app-store.alt-text": "Download the {siteName} mobile app from the Apple App Store",
+  "footer.site-footer.google-play.alt-text": "Download the {siteName} mobile app from Google Play",
+  "footer.site-footer.footer.aria-label": "Page Footer"
+}
--- a/src/i18n/messages/zh_CN.json
+++ b/src/i18n/messages/zh_CN.json
@@ -0,0 +1,39 @@
+{
+  "footer.site-footer.link.business": "商用{siteName} ",
+  "footer.site-footer.link.about": "关于",
+  "footer.site-footer.link.affiliates": "附属机构",
+  "footer.site-footer.link.open-source": "打开{siteName}",
+  "footer.site-footer.link.careers": "招才纳贤",
+  "footer.site-footer.link.news": "新闻",
+  "footer.site-footer.link.header.legal": "法律条款",
+  "footer.site-footer.link.terms-of-service": "服务条款 & 荣誉准则",
+  "footer.site-footer.link.privacy": "隐私政策",
+  "footer.site-footer.link.accessibility": "可访问策略",
+  "footer.site-footer.link.trademark": "商标政策",
+  "footer.site-footer.link.sitemap": "网站导航",
+  "footer.site-footer.link.header.connect": "连接",
+  "footer.site-footer.link.blog": "博客",
+  "footer.site-footer.link.contact-us": "联系我们",
+  "footer.site-footer.link.help-center": "帮助中心",
+  "footer.site-footer.link.media-kit": "多媒体工具箱",
+  "footer.site-footer.link.donate": "捐献",
+  "footer.site-footer.copyright-text": "{copyrightSymbol} {startDate}–{endDate} {siteName} Inc.",
+  "footer.site-footer.trademark-text": "EdX, Open edX, and MicroMasters are registered trademarks of edX Inc. | {icpLicense}",
+  "footer.site-footer.site-logo.alt-text": "{siteName} logo",
+  "footer.site-footer.site-logo.aria-label": "{siteName} 主页",
+  "footer.site-footer.facebook.title": "脸书",
+  "footer.site-footer.facebook.screen-reader-text": "在Facebook上为 {siteName}点赞",
+  "footer.site-footer.twitter.title": "推特",
+  "footer.site-footer.twitter.screen-reader-text": "在Twitter上关注 {siteName}",
+  "footer.site-footer.youtube.title": "Youtube",
+  "footer.site-footer.youtube.screen-reader-text": "订阅{siteName} YouTube频道",
+  "footer.site-footer.linkedin.title": "LinkedIn",
+  "footer.site-footer.linkedin.screen-reader-text": "在LinkedIn上关注{siteName}",
+  "footer.site-footer.google-plus.title": "Google+",
+  "footer.site-footer.google-plus.screen-reader-text": "在Google+上关注{siteName} ",
+  "footer.site-footer.reddit.title": "Reddit",
+  "footer.site-footer.reddit.screen-reader-text": "订阅{siteName} subreddit",
+  "footer.site-footer.apple-app-store.alt-text": "从Apple App Store下载 {siteName} 的移动客户端",
+  "footer.site-footer.google-play.alt-text": "从Google Play下载 {siteName} 的移动客户端",
+  "footer.site-footer.footer.aria-label": "页脚"
+}
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -1,29 +1,102 @@
 import React from 'react';
 import { render } from 'react-dom';
+import { IntlProvider } from 'react-intl';
+
+/* eslint-disable import/no-extraneous-dependencies */
+import {
+  faFacebookSquare,
+  faTwitterSquare,
+  faYoutubeSquare,
+  faLinkedin,
+  faGooglePlusSquare,
+  faRedditSquare,
+} from '@fortawesome/free-brands-svg-icons';
+import { faLanguage } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+/* eslint-enable import/no-extraneous-dependencies */
+
 import SiteFooter from './lib';
 import './index.scss';
-
 import FooterLogo from './edx-footer.png';

+
+const socialLinks = [
+  {
+    title: 'Facebook',
+    url: 'https://www.facebook.com',
+    icon: <FontAwesomeIcon icon={faFacebookSquare} className="social-icon" size="2x" />,
+    screenReaderText: 'Like edX on Facebook',
+  },
+  {
+    title: 'Twitter',
+    url: 'https://www.twitter.com',
+    icon: <FontAwesomeIcon icon={faTwitterSquare} className="social-icon" size="2x" />,
+    screenReaderText: 'Follow edX on Twitter',
+  },
+  {
+    title: 'Youtube',
+    url: 'https://www.youtube.com',
+    icon: <FontAwesomeIcon icon={faYoutubeSquare} className="social-icon" size="2x" />,
+    screenReaderText: 'Subscribe to the edX YouTube channel',
+  },
+  {
+    title: 'LinkedIn',
+    url: 'https://www.linkedin.com',
+    icon: <FontAwesomeIcon icon={faLinkedin} className="social-icon" size="2x" />,
+    screenReaderText: 'Follow edX on LinkedIn',
+  },
+  {
+    title: 'Google+',
+    url: 'https://plus.google.com',
+    icon: <FontAwesomeIcon icon={faGooglePlusSquare} className="social-icon" size="2x" />,
+    screenReaderText: 'Follow edX on Google+',
+  },
+  {
+    title: 'Reddit',
+    url: 'https://reddit.com',
+    icon: <FontAwesomeIcon icon={faRedditSquare} className="social-icon" size="2x" />,
+    screenReaderText: 'Subscribe to the edX subreddit',
+  },
+];
+
+
 const App = () => (
-  <SiteFooter
-    siteName="edX"
-    siteLogo={FooterLogo}
-    marketingSiteBaseUrl="https://www.example.com"
-    supportUrl="https://www.example.com/support"
-    contactUrl="https://www.example.com/contact"
-    openSourceUrl="https://www.example.com/open"
-    termsOfServiceUrl="https://www.example.com/terms-of-service"
-    privacyPolicyUrl="https://www.example.com/privacy-policy"
-    facebookUrl="https://www.facebook.com"
-    twitterUrl="https://www.twitter.com"
-    youTubeUrl="https://www.youtube.com"
-    linkedInUrl="https://www.linkedin.com"
-    googlePlusUrl="https://plus.google.com"
-    redditUrl="https://reddit.com"
-    appleAppStoreUrl="https://store.apple.com"
-    googlePlayUrl="https://play.google.com"
-  />
+  <IntlProvider locale="en">
+    <SiteFooter
+      siteName="edX"
+      siteLogo={FooterLogo}
+      marketingSiteBaseUrl="https://www.example.com"
+      enterpriseMarketingLink={{
+        url: 'https://business.edx.org',
+        queryParams: { utm_test: 'utm_test_value' },
+      }}
+      supportUrl="https://www.example.com/support"
+      contactUrl="https://www.example.com/contact"
+      openSourceUrl="https://www.example.com/open"
+      termsOfServiceUrl="https://www.example.com/terms-of-service"
+      privacyPolicyUrl="https://www.example.com/privacy-policy"
+      appleAppStoreUrl="https://store.apple.com"
+      googlePlayUrl="https://play.google.com"
+      handleAllTrackEvents={() => {}}
+      socialLinks={socialLinks}
+      supportedLanguages={[
+        {
+          label: 'English',
+          value: 'en',
+        }, {
+          label: 'español',
+          value: 'es-419',
+        },
+      ]}
+      languageForm={{
+        activeLanguage: 'en',
+        screenReaderLabel: 'Choose Language',
+        submitLabel: 'Apply',
+        icon: <FontAwesomeIcon icon={faLanguage} size="2x" className="text-primary" />,
+        onLanguageSelected: () => {},
+      }}
+    />
+  </IntlProvider>
 );

 render(<App />, document.getElementById('root'));
--- a/src/lib/components/SiteFooter/SiteFooter.messages.js
+++ b/src/lib/components/SiteFooter/SiteFooter.messages.js
@@ -0,0 +1,91 @@
+import { defineMessages } from 'react-intl';
+
+const messages = defineMessages({
+  'footer.site-footer.site-logo.alt-text': {
+    id: 'footer.site-footer.site-logo.alt-text',
+    defaultMessage: '{siteName} logo',
+    description: 'The alt description of the site logo',
+  },
+  'footer.site-footer.site-logo.aria-label': {
+    id: 'footer.site-footer.site-logo.aria-label',
+    defaultMessage: '{siteName} Home',
+    description: 'Aria label for the site logo which goes to the marketing site',
+  },
+  'footer.site-footer.facebook.title': {
+    id: 'footer.site-footer.facebook.title',
+    defaultMessage: 'Facebook',
+    description: 'Facebook button title',
+  },
+  'footer.site-footer.facebook.screen-reader-text': {
+    id: 'footer.site-footer.facebook.screen-reader-text',
+    defaultMessage: 'Like {siteName} on Facebook',
+    description: 'Facebook button screen reader text',
+  },
+  'footer.site-footer.twitter.title': {
+    id: 'footer.site-footer.twitter.title',
+    defaultMessage: 'Twitter',
+    description: 'Twitter button title',
+  },
+  'footer.site-footer.twitter.screen-reader-text': {
+    id: 'footer.site-footer.twitter.screen-reader-text',
+    defaultMessage: 'Follow {siteName} on Twitter',
+    description: 'Twitter button screen reader text',
+  },
+  'footer.site-footer.youtube.title': {
+    id: 'footer.site-footer.youtube.title',
+    defaultMessage: 'Youtube',
+    description: 'Youtube button title',
+  },
+  'footer.site-footer.youtube.screen-reader-text': {
+    id: 'footer.site-footer.youtube.screen-reader-text',
+    defaultMessage: 'Subscribe to the {siteName} YouTube channel',
+    description: 'Youtube button screen reader text',
+  },
+  'footer.site-footer.linkedin.title': {
+    id: 'footer.site-footer.linkedin.title',
+    defaultMessage: 'LinkedIn',
+    description: 'LinkedIn button title',
+  },
+  'footer.site-footer.linkedin.screen-reader-text': {
+    id: 'footer.site-footer.linkedin.screen-reader-text',
+    defaultMessage: 'Follow {siteName} on LinkedIn',
+    description: 'LinkedIn button screen reader text',
+  },
+  'footer.site-footer.google-plus.title': {
+    id: 'footer.site-footer.google-plus.title',
+    defaultMessage: 'Google+',
+    description: 'Google+ button title',
+  },
+  'footer.site-footer.google-plus.screen-reader-text': {
+    id: 'footer.site-footer.google-plus.screen-reader-text',
+    defaultMessage: 'Follow {siteName} on Google+',
+    description: 'Google+ button screen reader text',
+  },
+  'footer.site-footer.reddit.title': {
+    id: 'footer.site-footer.reddit.title',
+    defaultMessage: 'Reddit',
+    description: 'Reddit button title',
+  },
+  'footer.site-footer.reddit.screen-reader-text': {
+    id: 'footer.site-footer.reddit.screen-reader-text',
+    defaultMessage: 'Subscribe to the {siteName} subreddit',
+    description: 'Reddit button screen reader text',
+  },
+  'footer.site-footer.apple-app-store.alt-text': {
+    id: 'footer.site-footer.apple-app-store.alt-text',
+    defaultMessage: 'Download the {siteName} mobile app from the Apple App Store',
+    description: 'Apple App Store button alt description',
+  },
+  'footer.site-footer.google-play.alt-text': {
+    id: 'footer.site-footer.google-play.alt-text',
+    defaultMessage: 'Download the {siteName} mobile app from Google Play',
+    description: 'Google Play button alt description',
+  },
+  'footer.site-footer.footer.aria-label': {
+    id: 'footer.site-footer.footer.aria-label',
+    defaultMessage: 'Page Footer',
+    description: 'Aria label for the footer',
+  },
+});
+
+export default messages;
--- a/src/lib/components/SiteFooter/SiteFooter.test.jsx
+++ b/src/lib/components/SiteFooter/SiteFooter.test.jsx
@@ -1,30 +1,105 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
 import { mount } from 'enzyme';
+import { IntlProvider } from 'react-intl';
+
+import {
+  faFacebookSquare,
+  faTwitterSquare,
+  faYoutubeSquare,
+  faLinkedin,
+  faGooglePlusSquare,
+  faRedditSquare,
+} from '@fortawesome/free-brands-svg-icons';
+import { faLanguage } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';

 import FooterLogo from '../../../edx-footer.png';
 import SiteFooter, { EVENT_NAMES } from './index';

+
+const socialLinks = [
+  {
+    title: 'Facebook',
+    url: 'https://www.facebook.com',
+    icon: <FontAwesomeIcon icon={faFacebookSquare} className="social-icon" size="2x" />,
+    screenReaderText: 'Like edX on Facebook',
+  },
+  {
+    title: 'Twitter',
+    url: 'https://www.twitter.com',
+    icon: <FontAwesomeIcon icon={faTwitterSquare} className="social-icon" size="2x" />,
+    screenReaderText: 'Follow edX on Twitter',
+  },
+  {
+    title: 'Youtube',
+    url: 'https://www.youtube.com',
+    icon: <FontAwesomeIcon icon={faYoutubeSquare} className="social-icon" size="2x" />,
+    screenReaderText: 'Subscribe to the edX YouTube channel',
+  },
+  {
+    title: 'LinkedIn',
+    url: 'https://www.linkedin.com',
+    icon: <FontAwesomeIcon icon={faLinkedin} className="social-icon" size="2x" />,
+    screenReaderText: 'Follow edX on LinkedIn',
+  },
+  {
+    title: 'Google+',
+    url: 'https://plus.google.com',
+    icon: <FontAwesomeIcon icon={faGooglePlusSquare} className="social-icon" size="2x" />,
+    screenReaderText: 'Follow edX on Google+',
+  },
+  {
+    title: 'Reddit',
+    url: 'https://reddit.com',
+    icon: <FontAwesomeIcon icon={faRedditSquare} className="social-icon" size="2x" />,
+    screenReaderText: 'Subscribe to the edX subreddit',
+  },
+];
+
+const supportedLanguages = [
+  {
+    label: 'English',
+    value: 'en',
+  }, {
+    label: 'español',
+    value: 'es-419',
+  },
+];
+
+const languageForm = {
+  activeLanguage: 'en',
+  screenReaderLabel: 'Choose Language',
+  submitLabel: 'Apply',
+  icon: <FontAwesomeIcon icon={faLanguage} size="2x" className="text-primary" />,
+  onLanguageSelected: () => {},
+};
+
 const completeSiteFooterComponent = mockHandleAllTrackEvents =>
-  (<SiteFooter
-    siteName="example"
-    siteLogo={FooterLogo}
-    marketingSiteBaseUrl="https://www.example.com"
-    supportUrl="https://www.example.com/support"
-    contactUrl="https://www.example.com/contact"
-    openSourceUrl="https://www.example.com/open"
-    termsOfServiceUrl="https://www.example.com/terms-of-service"
-    privacyPolicyUrl="https://www.example.com/privacy-policy"
-    facebookUrl="https://www.facebook.com"
-    twitterUrl="https://www.twitter.com"
-    youTubeUrl="https://www.youtube.com"
-    linkedInUrl="https://www.linkedin.com"
-    googlePlusUrl="https://plus.google.com"
-    redditUrl="https://reddit.com"
-    appleAppStoreUrl="https://store.apple.com"
-    googlePlayUrl="https://play.google.com"
-    handleAllTrackEvents={mockHandleAllTrackEvents}
-  />);
+  (
+    <IntlProvider locale="en">
+      <SiteFooter
+        siteName="example"
+        siteLogo={FooterLogo}
+        marketingSiteBaseUrl="https://www.example.com"
+        supportUrl="https://www.example.com/support"
+        contactUrl="https://www.example.com/contact"
+        openSourceUrl="https://www.example.com/open"
+        termsOfServiceUrl="https://www.example.com/terms-of-service"
+        privacyPolicyUrl="https://www.example.com/privacy-policy"
+        socialLinks={socialLinks}
+        appleAppStoreUrl="https://store.apple.com"
+        googlePlayUrl="https://play.google.com"
+        handleAllTrackEvents={mockHandleAllTrackEvents}
+        supportedLanguages={supportedLanguages}
+        languageForm={languageForm}
+        enterpriseMarketingLink={{
+          url: 'https://business.edx.org',
+          queryParams: { utm_test: 'utm_test_value' },
+        }}
+      />
+    </IntlProvider>
+  );

 describe('<SiteFooter />', () => {
  describe('renders correctly', () => {
@@ -38,53 +113,99 @@ describe('<SiteFooter />', () => {

    it('does not render social links', () => {
      const tree = renderer
-        .create(<SiteFooter
-          siteName="example"
-          siteLogo={FooterLogo}
-          marketingSiteBaseUrl="https://www.example.com"
-          supportUrl="https://www.example.com/support"
-          contactUrl="https://www.example.com/contact"
-          openSourceUrl="https://www.example.com/open"
-          termsOfServiceUrl="https://www.example.com/terms-of-service"
-          privacyPolicyUrl="https://www.example.com/privacy-policy"
-          facebookUrl="https://www.facebook.com"
-          twitterUrl="https://www.twitter.com"
-          youTubeUrl="https://www.youtube.com"
-          linkedInUrl="https://www.linkedin.com"
-          googlePlusUrl="https://plus.google.com"
-          redditUrl="https://reddit.com"
-          appleAppStoreUrl="https://store.apple.com"
-          googlePlayUrl="https://play.google.com"
-          handleAllTrackEvents={jest.fn()}
-          showSocialLinks={false}
-        />)
-        .toJSON();
+        .create((
+          <IntlProvider locale="en">
+            <SiteFooter
+              siteName="example"
+              siteLogo={FooterLogo}
+              marketingSiteBaseUrl="https://www.example.com"
+              supportUrl="https://www.example.com/support"
+              contactUrl="https://www.example.com/contact"
+              openSourceUrl="https://www.example.com/open"
+              termsOfServiceUrl="https://www.example.com/terms-of-service"
+              privacyPolicyUrl="https://www.example.com/privacy-policy"
+              appleAppStoreUrl="https://store.apple.com"
+              googlePlayUrl="https://play.google.com"
+              supportedLanguages={supportedLanguages}
+              languageForm={languageForm}
+              handleAllTrackEvents={jest.fn()}
+              enterpriseMarketingLink={{
+                url: 'https://business.edx.org',
+                queryParams: { utm_test: 'utm_test_value' },
+              }}
+            />
+          </IntlProvider>
+        )).toJSON();
      expect(tree).toMatchSnapshot();
    });

    it('does not render mobile links', () => {
      const tree = renderer
-        .create(<SiteFooter
-          siteName="example"
-          siteLogo={FooterLogo}
-          marketingSiteBaseUrl="https://www.example.com"
-          supportUrl="https://www.example.com/support"
-          contactUrl="https://www.example.com/contact"
-          openSourceUrl="https://www.example.com/open"
-          termsOfServiceUrl="https://www.example.com/terms-of-service"
-          privacyPolicyUrl="https://www.example.com/privacy-policy"
-          facebookUrl="https://www.facebook.com"
-          twitterUrl="https://www.twitter.com"
-          youTubeUrl="https://www.youtube.com"
-          linkedInUrl="https://www.linkedin.com"
-          googlePlusUrl="https://plus.google.com"
-          redditUrl="https://reddit.com"
-          appleAppStoreUrl="https://store.apple.com"
-          googlePlayUrl="https://play.google.com"
-          handleAllTrackEvents={jest.fn()}
-          showMobileLinks={false}
-        />)
-        .toJSON();
+        .create((
+          <IntlProvider locale="en">
+            <SiteFooter
+              siteName="example"
+              siteLogo={FooterLogo}
+              marketingSiteBaseUrl="https://www.example.com"
+              supportUrl="https://www.example.com/support"
+              contactUrl="https://www.example.com/contact"
+              openSourceUrl="https://www.example.com/open"
+              termsOfServiceUrl="https://www.example.com/terms-of-service"
+              privacyPolicyUrl="https://www.example.com/privacy-policy"
+              socialLinks={socialLinks}
+              appleAppStoreUrl="https://store.apple.com"
+              googlePlayUrl="https://play.google.com"
+              supportedLanguages={supportedLanguages}
+              languageForm={languageForm}
+              handleAllTrackEvents={jest.fn()}
+              showMobileLinks={false}
+            />
+          </IntlProvider>
+        )).toJSON();
+      expect(tree).toMatchSnapshot();
+    });
+
+    it('does not render language selector', () => {
+      const tree = renderer
+        .create((
+          <IntlProvider locale="en">
+            <SiteFooter
+              siteName="example"
+              siteLogo={FooterLogo}
+              marketingSiteBaseUrl="https://www.example.com"
+              supportUrl="https://www.example.com/support"
+              contactUrl="https://www.example.com/contact"
+              openSourceUrl="https://www.example.com/open"
+              termsOfServiceUrl="https://www.example.com/terms-of-service"
+              privacyPolicyUrl="https://www.example.com/privacy-policy"
+              appleAppStoreUrl="https://store.apple.com"
+              googlePlayUrl="https://play.google.com"
+              handleAllTrackEvents={jest.fn()}
+            />
+          </IntlProvider>
+        )).toJSON();
+      expect(tree).toMatchSnapshot();
+    });
+
+    it('does not render business links', () => {
+      const tree = renderer
+        .create((
+          <IntlProvider locale="en">
+            <SiteFooter
+              siteName="example"
+              siteLogo={FooterLogo}
+              marketingSiteBaseUrl="https://www.example.com"
+              supportUrl="https://www.example.com/support"
+              contactUrl="https://www.example.com/contact"
+              openSourceUrl="https://www.example.com/open"
+              termsOfServiceUrl="https://www.example.com/terms-of-service"
+              privacyPolicyUrl="https://www.example.com/privacy-policy"
+              appleAppStoreUrl="https://store.apple.com"
+              googlePlayUrl="https://play.google.com"
+              handleAllTrackEvents={jest.fn()}
+            />
+          </IntlProvider>
+        )).toJSON();
      expect(tree).toMatchSnapshot();
    });
  });
--- a/src/lib/components/SiteFooter/snapshots/SiteFooter.test.jsx.snap
+++ b/src/lib/components/SiteFooter/snapshots/SiteFooter.test.jsx.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`<SiteFooter /> renders correctly does not render mobile links 1`] = `
+exports[`<SiteFooter /> renders correctly does not render business links 1`] = `
 <footer
  aria-label="Page Footer"
  className="footer d-flex justify-content-center border-top py-3 px-4"
@@ -37,44 +37,45 @@ exports[`<SiteFooter /> renders correctly does not render mobile links 1`] = `
          <a
            href="https://www.example.com/about-us"
          >
-            About
-          </a>
-        </li>
-        <li>
-          <a
-            href="https://www.example.com/enterprise"
-          >
-            example
-             for Business
+            <span>
+              About
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/affiliate-program"
          >
-            Affiliates
+            <span>
+              Affiliates
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/open"
          >
-            Open 
-            example
+            <span>
+              Open example
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/careers"
          >
-            Careers
+            <span>
+              Careers
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/news-announcements"
          >
-            News
+            <span>
+              News
+            </span>
          </a>
        </li>
      </ul>
@@ -83,7 +84,9 @@ exports[`<SiteFooter /> renders correctly does not render mobile links 1`] = `
      className="area-3"
    >
      <h2>
-        Legal
+        <span>
+          Legal
+        </span>
      </h2>
      <ul
        className="list-unstyled p-0 m-0"
@@ -92,35 +95,45 @@ exports[`<SiteFooter /> renders correctly does not render mobile links 1`] = `
          <a
            href="https://www.example.com/terms-of-service"
          >
-            Terms of Service & Honor Code
+            <span>
+              Terms of Service & Honor Code
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/privacy-policy"
          >
-            Privacy Policy
+            <span>
+              Privacy Policy
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/accessibility"
          >
-            Accessibility Policy
+            <span>
+              Accessibility Policy
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/trademarks"
          >
-            Trademark Policy
+            <span>
+              Trademark Policy
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/sitemap"
          >
-            Sitemap
+            <span>
+              Sitemap
+            </span>
          </a>
        </li>
      </ul>
@@ -129,7 +142,9 @@ exports[`<SiteFooter /> renders correctly does not render mobile links 1`] = `
      className="area-4"
    >
      <h2>
-        Connect
+        <span>
+          Connect
+        </span>
      </h2>
      <ul
        className="list-unstyled p-0 m-0"
@@ -138,35 +153,593 @@ exports[`<SiteFooter /> renders correctly does not render mobile links 1`] = `
          <a
            href="https://www.example.com/blog"
          >
-            Blog
+            <span>
+              Blog
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/contact"
          >
-            Contact Us
+            <span>
+              Contact Us
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/support"
          >
-            Help Center
+            <span>
+              Help Center
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/media-kit"
          >
-            Media Kit
+            <span>
+              Media Kit
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/donate"
          >
-            Donate
+            <span>
+              Donate
+            </span>
+          </a>
+        </li>
+      </ul>
+    </div>
+    <div
+      className="area-5"
+    >
+      <ul
+        className="d-flex flex-row justify-content-between list-unstyled max-width-264 p-0 mb-5"
+      >
+        <li>
+          <a
+            href="https://store.apple.com"
+            onClick={[Function]}
+            rel="noopener noreferrer"
+            target="_blank"
+          >
+            <img
+              alt="Download the example mobile app from the Apple App Store"
+              className="max-height-39"
+              src="https://prod-edxapp.edx-cdn.org/static/images/app/app_store_badge_135x40.d0558d910630.svg"
+            />
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://play.google.com"
+            onClick={[Function]}
+            rel="noopener noreferrer"
+            target="_blank"
+          >
+            <img
+              alt="Download the example mobile app from Google Play"
+              className="max-height-39"
+              src="https://prod-edxapp.edx-cdn.org/static/images/app/google_play_badge_45.6ea466e328da.png"
+            />
+          </a>
+        </li>
+      </ul>
+      <p>
+        <span>
+          © 2012–2019 example Inc.
+        </span>
+        <br />
+        <span>
+          EdX, Open edX, and MicroMasters are registered trademarks of edX Inc. | 粤ICP备17044299号-2
+        </span>
+      </p>
+    </div>
+  </div>
+</footer>
+`;
+
+exports[`<SiteFooter /> renders correctly does not render language selector 1`] = `
+<footer
+  aria-label="Page Footer"
+  className="footer d-flex justify-content-center border-top py-3 px-4"
+  role="contentinfo"
+>
+  <div
+    className="max-width-1180 d-grid"
+  >
+    <div
+      className="area-1"
+    >
+      <a
+        aria-label="example Home"
+        href="https://www.example.com/"
+        onClick={[Function]}
+        target="_self"
+      >
+        <img
+          alt="example logo"
+          src="test-file-stub"
+        />
+      </a>
+    </div>
+    <div
+      className="area-2"
+    >
+      <h2>
+        example
+      </h2>
+      <ul
+        className="list-unstyled p-0 m-0"
+      >
+        <li>
+          <a
+            href="https://www.example.com/about-us"
+          >
+            <span>
+              About
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/affiliate-program"
+          >
+            <span>
+              Affiliates
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/open"
+          >
+            <span>
+              Open example
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/careers"
+          >
+            <span>
+              Careers
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/news-announcements"
+          >
+            <span>
+              News
+            </span>
+          </a>
+        </li>
+      </ul>
+    </div>
+    <div
+      className="area-3"
+    >
+      <h2>
+        <span>
+          Legal
+        </span>
+      </h2>
+      <ul
+        className="list-unstyled p-0 m-0"
+      >
+        <li>
+          <a
+            href="https://www.example.com/terms-of-service"
+          >
+            <span>
+              Terms of Service & Honor Code
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/privacy-policy"
+          >
+            <span>
+              Privacy Policy
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/accessibility"
+          >
+            <span>
+              Accessibility Policy
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/trademarks"
+          >
+            <span>
+              Trademark Policy
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/sitemap"
+          >
+            <span>
+              Sitemap
+            </span>
+          </a>
+        </li>
+      </ul>
+    </div>
+    <div
+      className="area-4"
+    >
+      <h2>
+        <span>
+          Connect
+        </span>
+      </h2>
+      <ul
+        className="list-unstyled p-0 m-0"
+      >
+        <li>
+          <a
+            href="https://www.example.com/blog"
+          >
+            <span>
+              Blog
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/contact"
+          >
+            <span>
+              Contact Us
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/support"
+          >
+            <span>
+              Help Center
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/media-kit"
+          >
+            <span>
+              Media Kit
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/donate"
+          >
+            <span>
+              Donate
+            </span>
+          </a>
+        </li>
+      </ul>
+    </div>
+    <div
+      className="area-5"
+    >
+      <ul
+        className="d-flex flex-row justify-content-between list-unstyled max-width-264 p-0 mb-5"
+      >
+        <li>
+          <a
+            href="https://store.apple.com"
+            onClick={[Function]}
+            rel="noopener noreferrer"
+            target="_blank"
+          >
+            <img
+              alt="Download the example mobile app from the Apple App Store"
+              className="max-height-39"
+              src="https://prod-edxapp.edx-cdn.org/static/images/app/app_store_badge_135x40.d0558d910630.svg"
+            />
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://play.google.com"
+            onClick={[Function]}
+            rel="noopener noreferrer"
+            target="_blank"
+          >
+            <img
+              alt="Download the example mobile app from Google Play"
+              className="max-height-39"
+              src="https://prod-edxapp.edx-cdn.org/static/images/app/google_play_badge_45.6ea466e328da.png"
+            />
+          </a>
+        </li>
+      </ul>
+      <p>
+        <span>
+          © 2012–2019 example Inc.
+        </span>
+        <br />
+        <span>
+          EdX, Open edX, and MicroMasters are registered trademarks of edX Inc. | 粤ICP备17044299号-2
+        </span>
+      </p>
+    </div>
+  </div>
+</footer>
+`;
+
+exports[`<SiteFooter /> renders correctly does not render mobile links 1`] = `
+<footer
+  aria-label="Page Footer"
+  className="footer d-flex justify-content-center border-top py-3 px-4"
+  role="contentinfo"
+>
+  <div
+    className="max-width-1180 d-grid"
+  >
+    <div
+      className="area-1"
+    >
+      <a
+        aria-label="example Home"
+        href="https://www.example.com/"
+        onClick={[Function]}
+        target="_self"
+      >
+        <img
+          alt="example logo"
+          src="test-file-stub"
+        />
+      </a>
+      <div
+        className="i18n d-flex mt-2"
+      >
+        <form
+          className="d-flex align-items-start"
+          onSubmit={[Function]}
+        >
+          <label
+            htmlFor="site-footer-language-select"
+          >
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-language fa-w-20 fa-2x text-primary"
+              data-icon="language"
+              data-prefix="fas"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 640 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M152.1 236.2c-3.5-12.1-7.8-33.2-7.8-33.2h-.5s-4.3 21.1-7.8 33.2l-11.1 37.5H163zM616 96H336v320h280c13.3 0 24-10.7 24-24V120c0-13.3-10.7-24-24-24zm-24 120c0 6.6-5.4 12-12 12h-11.4c-6.9 23.6-21.7 47.4-42.7 69.9 8.4 6.4 17.1 12.5 26.1 18 5.5 3.4 7.3 10.5 4.1 16.2l-7.9 13.9c-3.4 5.9-10.9 7.8-16.7 4.3-12.6-7.8-24.5-16.1-35.4-24.9-10.9 8.7-22.7 17.1-35.4 24.9-5.8 3.5-13.3 1.6-16.7-4.3l-7.9-13.9c-3.2-5.6-1.4-12.8 4.2-16.2 9.3-5.7 18-11.7 26.1-18-7.9-8.4-14.9-17-21-25.7-4-5.7-2.2-13.6 3.7-17.1l6.5-3.9 7.3-4.3c5.4-3.2 12.4-1.7 16 3.4 5 7 10.8 14 17.4 20.9 13.5-14.2 23.8-28.9 30-43.2H412c-6.6 0-12-5.4-12-12v-16c0-6.6 5.4-12 12-12h64v-16c0-6.6 5.4-12 12-12h16c6.6 0 12 5.4 12 12v16h64c6.6 0 12 5.4 12 12zM0 120v272c0 13.3 10.7 24 24 24h280V96H24c-13.3 0-24 10.7-24 24zm58.9 216.1L116.4 167c1.7-4.9 6.2-8.1 11.4-8.1h32.5c5.1 0 9.7 3.3 11.4 8.1l57.5 169.1c2.6 7.8-3.1 15.9-11.4 15.9h-22.9a12 12 0 0 1-11.5-8.6l-9.4-31.9h-60.2l-9.1 31.8c-1.5 5.1-6.2 8.7-11.5 8.7H70.3c-8.2 0-14-8.1-11.4-15.9z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
+            <div
+              className="sr-only"
+            >
+              Choose Language
+            </div>
+          </label>
+          <select
+            className="mx-2 mt-1"
+            defaultValue="en"
+            id="site-footer-language-select"
+            name="site-footer-language-select"
+          >
+            <option
+              value="en"
+            >
+              English
+            </option>
+            <option
+              value="es-419"
+            >
+              español
+            </option>
+          </select>
+          <button
+            className="mt-1"
+            type="submit"
+          >
+            Apply
+          </button>
+        </form>
+      </div>
+    </div>
+    <div
+      className="area-2"
+    >
+      <h2>
+        example
+      </h2>
+      <ul
+        className="list-unstyled p-0 m-0"
+      >
+        <li>
+          <a
+            href="https://www.example.com/about-us"
+          >
+            <span>
+              About
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/affiliate-program"
+          >
+            <span>
+              Affiliates
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/open"
+          >
+            <span>
+              Open example
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/careers"
+          >
+            <span>
+              Careers
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/news-announcements"
+          >
+            <span>
+              News
+            </span>
+          </a>
+        </li>
+      </ul>
+    </div>
+    <div
+      className="area-3"
+    >
+      <h2>
+        <span>
+          Legal
+        </span>
+      </h2>
+      <ul
+        className="list-unstyled p-0 m-0"
+      >
+        <li>
+          <a
+            href="https://www.example.com/terms-of-service"
+          >
+            <span>
+              Terms of Service & Honor Code
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/privacy-policy"
+          >
+            <span>
+              Privacy Policy
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/accessibility"
+          >
+            <span>
+              Accessibility Policy
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/trademarks"
+          >
+            <span>
+              Trademark Policy
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/sitemap"
+          >
+            <span>
+              Sitemap
+            </span>
+          </a>
+        </li>
+      </ul>
+    </div>
+    <div
+      className="area-4"
+    >
+      <h2>
+        <span>
+          Connect
+        </span>
+      </h2>
+      <ul
+        className="list-unstyled p-0 m-0"
+      >
+        <li>
+          <a
+            href="https://www.example.com/blog"
+          >
+            <span>
+              Blog
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/contact"
+          >
+            <span>
+              Contact Us
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/support"
+          >
+            <span>
+              Help Center
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/media-kit"
+          >
+            <span>
+              Media Kit
+            </span>
+          </a>
+        </li>
+        <li>
+          <a
+            href="https://www.example.com/donate"
+          >
+            <span>
+              Donate
+            </span>
          </a>
        </li>
      </ul>
@@ -185,15 +758,27 @@ exports[`<SiteFooter /> renders correctly does not render mobile links 1`] = `
            target="_blank"
            title="Facebook"
          >
-            <span
-              aria-hidden={true}
-              className="fa fa-facebook-square fa-2x"
-              id="Icon1"
-            />
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-facebook-square fa-w-14 fa-2x social-icon"
+              data-icon="facebook-square"
+              data-prefix="fab"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 448 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M448 80v352c0 26.5-21.5 48-48 48h-85.3V302.8h60.6l8.7-67.6h-69.3V192c0-19.6 5.4-32.9 33.5-32.9H384V98.7c-6.2-.8-27.4-2.7-52.2-2.7-51.6 0-87 31.5-87 89.4v49.9H184v67.6h60.9V480H48c-26.5 0-48-21.5-48-48V80c0-26.5 21.5-48 48-48h352c26.5 0 48 21.5 48 48z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
            <span
              className="sr-only"
            >
-              Like example on Facebook
+              Like edX on Facebook
            </span>
          </a>
        </li>
@@ -205,15 +790,27 @@ exports[`<SiteFooter /> renders correctly does not render mobile links 1`] = `
            target="_blank"
            title="Twitter"
          >
-            <span
-              aria-hidden={true}
-              className="fa fa-twitter-square fa-2x"
-              id="Icon1"
-            />
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-twitter-square fa-w-14 fa-2x social-icon"
+              data-icon="twitter-square"
+              data-prefix="fab"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 448 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm-48.9 158.8c.2 2.8.2 5.7.2 8.5 0 86.7-66 186.6-186.6 186.6-37.2 0-71.7-10.8-100.7-29.4 5.3.6 10.4.8 15.8.8 30.7 0 58.9-10.4 81.4-28-28.8-.6-53-19.5-61.3-45.5 10.1 1.5 19.2 1.5 29.6-1.2-30-6.1-52.5-32.5-52.5-64.4v-.8c8.7 4.9 18.9 7.9 29.6 8.3a65.447 65.447 0 0 1-29.2-54.6c0-12.2 3.2-23.4 8.9-33.1 32.3 39.8 80.8 65.8 135.2 68.6-9.3-44.5 24-80.6 64-80.6 18.9 0 35.9 7.9 47.9 20.7 14.8-2.8 29-8.3 41.6-15.8-4.9 15.2-15.2 28-28.8 36.1 13.2-1.4 26-5.1 37.8-10.2-8.9 13.1-20.1 24.7-32.9 34z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
            <span
              className="sr-only"
            >
-              Follow example on Twitter
+              Follow edX on Twitter
            </span>
          </a>
        </li>
@@ -225,15 +822,27 @@ exports[`<SiteFooter /> renders correctly does not render mobile links 1`] = `
            target="_blank"
            title="Youtube"
          >
-            <span
-              aria-hidden={true}
-              className="fa fa-youtube-square fa-2x"
-              id="Icon1"
-            />
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-youtube-square fa-w-14 fa-2x social-icon"
+              data-icon="youtube-square"
+              data-prefix="fab"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 448 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M186.8 202.1l95.2 54.1-95.2 54.1V202.1zM448 80v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V80c0-26.5 21.5-48 48-48h352c26.5 0 48 21.5 48 48zm-42 176.3s0-59.6-7.6-88.2c-4.2-15.8-16.5-28.2-32.2-32.4C337.9 128 224 128 224 128s-113.9 0-142.2 7.7c-15.7 4.2-28 16.6-32.2 32.4-7.6 28.5-7.6 88.2-7.6 88.2s0 59.6 7.6 88.2c4.2 15.8 16.5 27.7 32.2 31.9C110.1 384 224 384 224 384s113.9 0 142.2-7.7c15.7-4.2 28-16.1 32.2-31.9 7.6-28.5 7.6-88.1 7.6-88.1z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
            <span
              className="sr-only"
            >
-              Subscribe to the example YouTube channel
+              Subscribe to the edX YouTube channel
            </span>
          </a>
        </li>
@@ -245,15 +854,27 @@ exports[`<SiteFooter /> renders correctly does not render mobile links 1`] = `
            target="_blank"
            title="LinkedIn"
          >
-            <span
-              aria-hidden={true}
-              className="fa fa-linkedin-square fa-2x"
-              id="Icon1"
-            />
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-linkedin fa-w-14 fa-2x social-icon"
+              data-icon="linkedin"
+              data-prefix="fab"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 448 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
            <span
              className="sr-only"
            >
-              Follow example on LinkedIn
+              Follow edX on LinkedIn
            </span>
          </a>
        </li>
@@ -265,15 +886,27 @@ exports[`<SiteFooter /> renders correctly does not render mobile links 1`] = `
            target="_blank"
            title="Google+"
          >
-            <span
-              aria-hidden={true}
-              className="fa fa-google-plus-square fa-2x"
-              id="Icon1"
-            />
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-google-plus-square fa-w-14 fa-2x social-icon"
+              data-icon="google-plus-square"
+              data-prefix="fab"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 448 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zM164 356c-55.3 0-100-44.7-100-100s44.7-100 100-100c27 0 49.5 9.8 67 26.2l-27.1 26.1c-7.4-7.1-20.3-15.4-39.8-15.4-34.1 0-61.9 28.2-61.9 63.2 0 34.9 27.8 63.2 61.9 63.2 39.6 0 54.4-28.5 56.8-43.1H164v-34.4h94.4c1 5 1.6 10.1 1.6 16.6 0 57.1-38.3 97.6-96 97.6zm220-81.8h-29v29h-29.2v-29h-29V245h29v-29H355v29h29v29.2z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
            <span
              className="sr-only"
            >
-              Follow example on Google+
+              Follow edX on Google+
            </span>
          </a>
        </li>
@@ -285,27 +918,39 @@ exports[`<SiteFooter /> renders correctly does not render mobile links 1`] = `
            target="_blank"
            title="Reddit"
          >
-            <span
-              aria-hidden={true}
-              className="fa fa-reddit-square fa-2x"
-              id="Icon1"
-            />
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-reddit-square fa-w-14 fa-2x social-icon"
+              data-icon="reddit-square"
+              data-prefix="fab"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 448 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M283.2 345.5c2.7 2.7 2.7 6.8 0 9.2-24.5 24.5-93.8 24.6-118.4 0-2.7-2.4-2.7-6.5 0-9.2 2.4-2.4 6.5-2.4 8.9 0 18.7 19.2 81 19.6 100.5 0 2.4-2.3 6.6-2.3 9 0zm-91.3-53.8c0-14.9-11.9-26.8-26.5-26.8-14.9 0-26.8 11.9-26.8 26.8 0 14.6 11.9 26.5 26.8 26.5 14.6 0 26.5-11.9 26.5-26.5zm90.7-26.8c-14.6 0-26.5 11.9-26.5 26.8 0 14.6 11.9 26.5 26.5 26.5 14.9 0 26.8-11.9 26.8-26.5 0-14.9-11.9-26.8-26.8-26.8zM448 80v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V80c0-26.5 21.5-48 48-48h352c26.5 0 48 21.5 48 48zm-99.7 140.6c-10.1 0-19 4.2-25.6 10.7-24.1-16.7-56.5-27.4-92.5-28.6l18.7-84.2 59.5 13.4c0 14.6 11.9 26.5 26.5 26.5 14.9 0 26.8-12.2 26.8-26.8 0-14.6-11.9-26.8-26.8-26.8-10.4 0-19.3 6.2-23.8 14.9l-65.7-14.6c-3.3-.9-6.5 1.5-7.4 4.8l-20.5 92.8c-35.7 1.5-67.8 12.2-91.9 28.9-6.5-6.8-15.8-11-25.9-11-37.5 0-49.8 50.4-15.5 67.5-1.2 5.4-1.8 11-1.8 16.7 0 56.5 63.7 102.3 141.9 102.3 78.5 0 142.2-45.8 142.2-102.3 0-5.7-.6-11.6-2.1-17 33.6-17.2 21.2-67.2-16.1-67.2z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
            <span
              className="sr-only"
            >
-              Subscribe to the example subreddit
+              Subscribe to the edX subreddit
            </span>
          </a>
        </li>
      </ul>
      <p>
-        © 2012–
-        2019
-         
-        example
-         Inc.
+        <span>
+          © 2012–2019 example Inc.
+        </span>
        <br />
-        EdX, Open edX, and MicroMasters are registered trademarks of edX Inc. | 粤ICP备17044299号-2
+        <span>
+          EdX, Open edX, and MicroMasters are registered trademarks of edX Inc. | 粤ICP备17044299号-2
+        </span>
      </p>
    </div>
  </div>
@@ -335,6 +980,64 @@ exports[`<SiteFooter /> renders correctly does not render social links 1`] = `
          src="test-file-stub"
        />
      </a>
+      <div
+        className="i18n d-flex mt-2"
+      >
+        <form
+          className="d-flex align-items-start"
+          onSubmit={[Function]}
+        >
+          <label
+            htmlFor="site-footer-language-select"
+          >
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-language fa-w-20 fa-2x text-primary"
+              data-icon="language"
+              data-prefix="fas"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 640 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M152.1 236.2c-3.5-12.1-7.8-33.2-7.8-33.2h-.5s-4.3 21.1-7.8 33.2l-11.1 37.5H163zM616 96H336v320h280c13.3 0 24-10.7 24-24V120c0-13.3-10.7-24-24-24zm-24 120c0 6.6-5.4 12-12 12h-11.4c-6.9 23.6-21.7 47.4-42.7 69.9 8.4 6.4 17.1 12.5 26.1 18 5.5 3.4 7.3 10.5 4.1 16.2l-7.9 13.9c-3.4 5.9-10.9 7.8-16.7 4.3-12.6-7.8-24.5-16.1-35.4-24.9-10.9 8.7-22.7 17.1-35.4 24.9-5.8 3.5-13.3 1.6-16.7-4.3l-7.9-13.9c-3.2-5.6-1.4-12.8 4.2-16.2 9.3-5.7 18-11.7 26.1-18-7.9-8.4-14.9-17-21-25.7-4-5.7-2.2-13.6 3.7-17.1l6.5-3.9 7.3-4.3c5.4-3.2 12.4-1.7 16 3.4 5 7 10.8 14 17.4 20.9 13.5-14.2 23.8-28.9 30-43.2H412c-6.6 0-12-5.4-12-12v-16c0-6.6 5.4-12 12-12h64v-16c0-6.6 5.4-12 12-12h16c6.6 0 12 5.4 12 12v16h64c6.6 0 12 5.4 12 12zM0 120v272c0 13.3 10.7 24 24 24h280V96H24c-13.3 0-24 10.7-24 24zm58.9 216.1L116.4 167c1.7-4.9 6.2-8.1 11.4-8.1h32.5c5.1 0 9.7 3.3 11.4 8.1l57.5 169.1c2.6 7.8-3.1 15.9-11.4 15.9h-22.9a12 12 0 0 1-11.5-8.6l-9.4-31.9h-60.2l-9.1 31.8c-1.5 5.1-6.2 8.7-11.5 8.7H70.3c-8.2 0-14-8.1-11.4-15.9z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
+            <div
+              className="sr-only"
+            >
+              Choose Language
+            </div>
+          </label>
+          <select
+            className="mx-2 mt-1"
+            defaultValue="en"
+            id="site-footer-language-select"
+            name="site-footer-language-select"
+          >
+            <option
+              value="en"
+            >
+              English
+            </option>
+            <option
+              value="es-419"
+            >
+              español
+            </option>
+          </select>
+          <button
+            className="mt-1"
+            type="submit"
+          >
+            Apply
+          </button>
+        </form>
+      </div>
    </div>
    <div
      className="area-2"
@@ -349,44 +1052,54 @@ exports[`<SiteFooter /> renders correctly does not render social links 1`] = `
          <a
            href="https://www.example.com/about-us"
          >
-            About
+            <span>
+              About
+            </span>
          </a>
        </li>
        <li>
          <a
-            href="https://www.example.com/enterprise"
+            href="https://business.edx.org/?utm_test=utm_test_value"
          >
-            example
-             for Business
+            <span>
+              example for Business
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/affiliate-program"
          >
-            Affiliates
+            <span>
+              Affiliates
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/open"
          >
-            Open 
-            example
+            <span>
+              Open example
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/careers"
          >
-            Careers
+            <span>
+              Careers
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/news-announcements"
          >
-            News
+            <span>
+              News
+            </span>
          </a>
        </li>
      </ul>
@@ -395,7 +1108,9 @@ exports[`<SiteFooter /> renders correctly does not render social links 1`] = `
      className="area-3"
    >
      <h2>
-        Legal
+        <span>
+          Legal
+        </span>
      </h2>
      <ul
        className="list-unstyled p-0 m-0"
@@ -404,35 +1119,45 @@ exports[`<SiteFooter /> renders correctly does not render social links 1`] = `
          <a
            href="https://www.example.com/terms-of-service"
          >
-            Terms of Service & Honor Code
+            <span>
+              Terms of Service & Honor Code
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/privacy-policy"
          >
-            Privacy Policy
+            <span>
+              Privacy Policy
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/accessibility"
          >
-            Accessibility Policy
+            <span>
+              Accessibility Policy
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/trademarks"
          >
-            Trademark Policy
+            <span>
+              Trademark Policy
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/sitemap"
          >
-            Sitemap
+            <span>
+              Sitemap
+            </span>
          </a>
        </li>
      </ul>
@@ -441,7 +1166,9 @@ exports[`<SiteFooter /> renders correctly does not render social links 1`] = `
      className="area-4"
    >
      <h2>
-        Connect
+        <span>
+          Connect
+        </span>
      </h2>
      <ul
        className="list-unstyled p-0 m-0"
@@ -450,35 +1177,45 @@ exports[`<SiteFooter /> renders correctly does not render social links 1`] = `
          <a
            href="https://www.example.com/blog"
          >
-            Blog
+            <span>
+              Blog
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/contact"
          >
-            Contact Us
+            <span>
+              Contact Us
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/support"
          >
-            Help Center
+            <span>
+              Help Center
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/media-kit"
          >
-            Media Kit
+            <span>
+              Media Kit
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/donate"
          >
-            Donate
+            <span>
+              Donate
+            </span>
          </a>
        </li>
      </ul>
@@ -519,13 +1256,13 @@ exports[`<SiteFooter /> renders correctly does not render social links 1`] = `
        </li>
      </ul>
      <p>
-        © 2012–
-        2019
-         
-        example
-         Inc.
+        <span>
+          © 2012–2019 example Inc.
+        </span>
        <br />
-        EdX, Open edX, and MicroMasters are registered trademarks of edX Inc. | 粤ICP备17044299号-2
+        <span>
+          EdX, Open edX, and MicroMasters are registered trademarks of edX Inc. | 粤ICP备17044299号-2
+        </span>
      </p>
    </div>
  </div>
@@ -555,6 +1292,64 @@ exports[`<SiteFooter /> renders correctly renders with social and mobile links 1
          src="test-file-stub"
        />
      </a>
+      <div
+        className="i18n d-flex mt-2"
+      >
+        <form
+          className="d-flex align-items-start"
+          onSubmit={[Function]}
+        >
+          <label
+            htmlFor="site-footer-language-select"
+          >
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-language fa-w-20 fa-2x text-primary"
+              data-icon="language"
+              data-prefix="fas"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 640 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M152.1 236.2c-3.5-12.1-7.8-33.2-7.8-33.2h-.5s-4.3 21.1-7.8 33.2l-11.1 37.5H163zM616 96H336v320h280c13.3 0 24-10.7 24-24V120c0-13.3-10.7-24-24-24zm-24 120c0 6.6-5.4 12-12 12h-11.4c-6.9 23.6-21.7 47.4-42.7 69.9 8.4 6.4 17.1 12.5 26.1 18 5.5 3.4 7.3 10.5 4.1 16.2l-7.9 13.9c-3.4 5.9-10.9 7.8-16.7 4.3-12.6-7.8-24.5-16.1-35.4-24.9-10.9 8.7-22.7 17.1-35.4 24.9-5.8 3.5-13.3 1.6-16.7-4.3l-7.9-13.9c-3.2-5.6-1.4-12.8 4.2-16.2 9.3-5.7 18-11.7 26.1-18-7.9-8.4-14.9-17-21-25.7-4-5.7-2.2-13.6 3.7-17.1l6.5-3.9 7.3-4.3c5.4-3.2 12.4-1.7 16 3.4 5 7 10.8 14 17.4 20.9 13.5-14.2 23.8-28.9 30-43.2H412c-6.6 0-12-5.4-12-12v-16c0-6.6 5.4-12 12-12h64v-16c0-6.6 5.4-12 12-12h16c6.6 0 12 5.4 12 12v16h64c6.6 0 12 5.4 12 12zM0 120v272c0 13.3 10.7 24 24 24h280V96H24c-13.3 0-24 10.7-24 24zm58.9 216.1L116.4 167c1.7-4.9 6.2-8.1 11.4-8.1h32.5c5.1 0 9.7 3.3 11.4 8.1l57.5 169.1c2.6 7.8-3.1 15.9-11.4 15.9h-22.9a12 12 0 0 1-11.5-8.6l-9.4-31.9h-60.2l-9.1 31.8c-1.5 5.1-6.2 8.7-11.5 8.7H70.3c-8.2 0-14-8.1-11.4-15.9z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
+            <div
+              className="sr-only"
+            >
+              Choose Language
+            </div>
+          </label>
+          <select
+            className="mx-2 mt-1"
+            defaultValue="en"
+            id="site-footer-language-select"
+            name="site-footer-language-select"
+          >
+            <option
+              value="en"
+            >
+              English
+            </option>
+            <option
+              value="es-419"
+            >
+              español
+            </option>
+          </select>
+          <button
+            className="mt-1"
+            type="submit"
+          >
+            Apply
+          </button>
+        </form>
+      </div>
    </div>
    <div
      className="area-2"
@@ -569,44 +1364,54 @@ exports[`<SiteFooter /> renders correctly renders with social and mobile links 1
          <a
            href="https://www.example.com/about-us"
          >
-            About
+            <span>
+              About
+            </span>
          </a>
        </li>
        <li>
          <a
-            href="https://www.example.com/enterprise"
+            href="https://business.edx.org/?utm_test=utm_test_value"
          >
-            example
-             for Business
+            <span>
+              example for Business
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/affiliate-program"
          >
-            Affiliates
+            <span>
+              Affiliates
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/open"
          >
-            Open 
-            example
+            <span>
+              Open example
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/careers"
          >
-            Careers
+            <span>
+              Careers
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/news-announcements"
          >
-            News
+            <span>
+              News
+            </span>
          </a>
        </li>
      </ul>
@@ -615,7 +1420,9 @@ exports[`<SiteFooter /> renders correctly renders with social and mobile links 1
      className="area-3"
    >
      <h2>
-        Legal
+        <span>
+          Legal
+        </span>
      </h2>
      <ul
        className="list-unstyled p-0 m-0"
@@ -624,35 +1431,45 @@ exports[`<SiteFooter /> renders correctly renders with social and mobile links 1
          <a
            href="https://www.example.com/terms-of-service"
          >
-            Terms of Service & Honor Code
+            <span>
+              Terms of Service & Honor Code
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/privacy-policy"
          >
-            Privacy Policy
+            <span>
+              Privacy Policy
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/accessibility"
          >
-            Accessibility Policy
+            <span>
+              Accessibility Policy
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/trademarks"
          >
-            Trademark Policy
+            <span>
+              Trademark Policy
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/sitemap"
          >
-            Sitemap
+            <span>
+              Sitemap
+            </span>
          </a>
        </li>
      </ul>
@@ -661,7 +1478,9 @@ exports[`<SiteFooter /> renders correctly renders with social and mobile links 1
      className="area-4"
    >
      <h2>
-        Connect
+        <span>
+          Connect
+        </span>
      </h2>
      <ul
        className="list-unstyled p-0 m-0"
@@ -670,35 +1489,45 @@ exports[`<SiteFooter /> renders correctly renders with social and mobile links 1
          <a
            href="https://www.example.com/blog"
          >
-            Blog
+            <span>
+              Blog
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/contact"
          >
-            Contact Us
+            <span>
+              Contact Us
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/support"
          >
-            Help Center
+            <span>
+              Help Center
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/media-kit"
          >
-            Media Kit
+            <span>
+              Media Kit
+            </span>
          </a>
        </li>
        <li>
          <a
            href="https://www.example.com/donate"
          >
-            Donate
+            <span>
+              Donate
+            </span>
          </a>
        </li>
      </ul>
@@ -717,15 +1546,27 @@ exports[`<SiteFooter /> renders correctly renders with social and mobile links 1
            target="_blank"
            title="Facebook"
          >
-            <span
-              aria-hidden={true}
-              className="fa fa-facebook-square fa-2x"
-              id="Icon1"
-            />
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-facebook-square fa-w-14 fa-2x social-icon"
+              data-icon="facebook-square"
+              data-prefix="fab"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 448 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M448 80v352c0 26.5-21.5 48-48 48h-85.3V302.8h60.6l8.7-67.6h-69.3V192c0-19.6 5.4-32.9 33.5-32.9H384V98.7c-6.2-.8-27.4-2.7-52.2-2.7-51.6 0-87 31.5-87 89.4v49.9H184v67.6h60.9V480H48c-26.5 0-48-21.5-48-48V80c0-26.5 21.5-48 48-48h352c26.5 0 48 21.5 48 48z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
            <span
              className="sr-only"
            >
-              Like example on Facebook
+              Like edX on Facebook
            </span>
          </a>
        </li>
@@ -737,15 +1578,27 @@ exports[`<SiteFooter /> renders correctly renders with social and mobile links 1
            target="_blank"
            title="Twitter"
          >
-            <span
-              aria-hidden={true}
-              className="fa fa-twitter-square fa-2x"
-              id="Icon1"
-            />
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-twitter-square fa-w-14 fa-2x social-icon"
+              data-icon="twitter-square"
+              data-prefix="fab"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 448 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm-48.9 158.8c.2 2.8.2 5.7.2 8.5 0 86.7-66 186.6-186.6 186.6-37.2 0-71.7-10.8-100.7-29.4 5.3.6 10.4.8 15.8.8 30.7 0 58.9-10.4 81.4-28-28.8-.6-53-19.5-61.3-45.5 10.1 1.5 19.2 1.5 29.6-1.2-30-6.1-52.5-32.5-52.5-64.4v-.8c8.7 4.9 18.9 7.9 29.6 8.3a65.447 65.447 0 0 1-29.2-54.6c0-12.2 3.2-23.4 8.9-33.1 32.3 39.8 80.8 65.8 135.2 68.6-9.3-44.5 24-80.6 64-80.6 18.9 0 35.9 7.9 47.9 20.7 14.8-2.8 29-8.3 41.6-15.8-4.9 15.2-15.2 28-28.8 36.1 13.2-1.4 26-5.1 37.8-10.2-8.9 13.1-20.1 24.7-32.9 34z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
            <span
              className="sr-only"
            >
-              Follow example on Twitter
+              Follow edX on Twitter
            </span>
          </a>
        </li>
@@ -757,15 +1610,27 @@ exports[`<SiteFooter /> renders correctly renders with social and mobile links 1
            target="_blank"
            title="Youtube"
          >
-            <span
-              aria-hidden={true}
-              className="fa fa-youtube-square fa-2x"
-              id="Icon1"
-            />
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-youtube-square fa-w-14 fa-2x social-icon"
+              data-icon="youtube-square"
+              data-prefix="fab"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 448 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M186.8 202.1l95.2 54.1-95.2 54.1V202.1zM448 80v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V80c0-26.5 21.5-48 48-48h352c26.5 0 48 21.5 48 48zm-42 176.3s0-59.6-7.6-88.2c-4.2-15.8-16.5-28.2-32.2-32.4C337.9 128 224 128 224 128s-113.9 0-142.2 7.7c-15.7 4.2-28 16.6-32.2 32.4-7.6 28.5-7.6 88.2-7.6 88.2s0 59.6 7.6 88.2c4.2 15.8 16.5 27.7 32.2 31.9C110.1 384 224 384 224 384s113.9 0 142.2-7.7c15.7-4.2 28-16.1 32.2-31.9 7.6-28.5 7.6-88.1 7.6-88.1z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
            <span
              className="sr-only"
            >
-              Subscribe to the example YouTube channel
+              Subscribe to the edX YouTube channel
            </span>
          </a>
        </li>
@@ -777,15 +1642,27 @@ exports[`<SiteFooter /> renders correctly renders with social and mobile links 1
            target="_blank"
            title="LinkedIn"
          >
-            <span
-              aria-hidden={true}
-              className="fa fa-linkedin-square fa-2x"
-              id="Icon1"
-            />
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-linkedin fa-w-14 fa-2x social-icon"
+              data-icon="linkedin"
+              data-prefix="fab"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 448 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
            <span
              className="sr-only"
            >
-              Follow example on LinkedIn
+              Follow edX on LinkedIn
            </span>
          </a>
        </li>
@@ -797,15 +1674,27 @@ exports[`<SiteFooter /> renders correctly renders with social and mobile links 1
            target="_blank"
            title="Google+"
          >
-            <span
-              aria-hidden={true}
-              className="fa fa-google-plus-square fa-2x"
-              id="Icon1"
-            />
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-google-plus-square fa-w-14 fa-2x social-icon"
+              data-icon="google-plus-square"
+              data-prefix="fab"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 448 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zM164 356c-55.3 0-100-44.7-100-100s44.7-100 100-100c27 0 49.5 9.8 67 26.2l-27.1 26.1c-7.4-7.1-20.3-15.4-39.8-15.4-34.1 0-61.9 28.2-61.9 63.2 0 34.9 27.8 63.2 61.9 63.2 39.6 0 54.4-28.5 56.8-43.1H164v-34.4h94.4c1 5 1.6 10.1 1.6 16.6 0 57.1-38.3 97.6-96 97.6zm220-81.8h-29v29h-29.2v-29h-29V245h29v-29H355v29h29v29.2z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
            <span
              className="sr-only"
            >
-              Follow example on Google+
+              Follow edX on Google+
            </span>
          </a>
        </li>
@@ -817,15 +1706,27 @@ exports[`<SiteFooter /> renders correctly renders with social and mobile links 1
            target="_blank"
            title="Reddit"
          >
-            <span
-              aria-hidden={true}
-              className="fa fa-reddit-square fa-2x"
-              id="Icon1"
-            />
+            <svg
+              aria-hidden="true"
+              className="svg-inline--fa fa-reddit-square fa-w-14 fa-2x social-icon"
+              data-icon="reddit-square"
+              data-prefix="fab"
+              focusable="false"
+              role="img"
+              style={Object {}}
+              viewBox="0 0 448 512"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M283.2 345.5c2.7 2.7 2.7 6.8 0 9.2-24.5 24.5-93.8 24.6-118.4 0-2.7-2.4-2.7-6.5 0-9.2 2.4-2.4 6.5-2.4 8.9 0 18.7 19.2 81 19.6 100.5 0 2.4-2.3 6.6-2.3 9 0zm-91.3-53.8c0-14.9-11.9-26.8-26.5-26.8-14.9 0-26.8 11.9-26.8 26.8 0 14.6 11.9 26.5 26.8 26.5 14.6 0 26.5-11.9 26.5-26.5zm90.7-26.8c-14.6 0-26.5 11.9-26.5 26.8 0 14.6 11.9 26.5 26.5 26.5 14.9 0 26.8-11.9 26.8-26.5 0-14.9-11.9-26.8-26.8-26.8zM448 80v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V80c0-26.5 21.5-48 48-48h352c26.5 0 48 21.5 48 48zm-99.7 140.6c-10.1 0-19 4.2-25.6 10.7-24.1-16.7-56.5-27.4-92.5-28.6l18.7-84.2 59.5 13.4c0 14.6 11.9 26.5 26.5 26.5 14.9 0 26.8-12.2 26.8-26.8 0-14.6-11.9-26.8-26.8-26.8-10.4 0-19.3 6.2-23.8 14.9l-65.7-14.6c-3.3-.9-6.5 1.5-7.4 4.8l-20.5 92.8c-35.7 1.5-67.8 12.2-91.9 28.9-6.5-6.8-15.8-11-25.9-11-37.5 0-49.8 50.4-15.5 67.5-1.2 5.4-1.8 11-1.8 16.7 0 56.5 63.7 102.3 141.9 102.3 78.5 0 142.2-45.8 142.2-102.3 0-5.7-.6-11.6-2.1-17 33.6-17.2 21.2-67.2-16.1-67.2z"
+                fill="currentColor"
+                style={Object {}}
+              />
+            </svg>
            <span
              className="sr-only"
            >
-              Subscribe to the example subreddit
+              Subscribe to the edX subreddit
            </span>
          </a>
        </li>
@@ -863,13 +1764,13 @@ exports[`<SiteFooter /> renders correctly renders with social and mobile links 1
        </li>
      </ul>
      <p>
-        © 2012–
-        2019
-         
-        example
-         Inc.
+        <span>
+          © 2012–2019 example Inc.
+        </span>
        <br />
-        EdX, Open edX, and MicroMasters are registered trademarks of edX Inc. | 粤ICP备17044299号-2
+        <span>
+          EdX, Open edX, and MicroMasters are registered trademarks of edX Inc. | 粤ICP备17044299号-2
+        </span>
      </p>
    </div>
  </div>
--- a/src/lib/components/SiteFooter/index.jsx
+++ b/src/lib/components/SiteFooter/index.jsx
@@ -1,15 +1,28 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Hyperlink, Icon } from '@edx/paragon';
+import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
+import { Hyperlink } from '@edx/paragon';
+import qs from 'query-string';
+
+import messages from './SiteFooter.messages';

 const EVENT_NAMES = {
  FOOTER_LINK: 'edx.bi.footer.link',
 };

+
 class SiteFooter extends React.Component {
  constructor(props) {
    super(props);
    this.externalLinkClickHandler = this.externalLinkClickHandler.bind(this);
+    this.applyLanguageSelection = this.applyLanguageSelection.bind(this);
+  }
+
+  applyLanguageSelection(event) {
+    event.preventDefault();
+    const languageCode = event.target.elements['site-footer-language-select'].value;
+    const { languageForm: { onLanguageSelected } } = this.props;
+    onLanguageSelected(languageCode);
  }

  externalLinkClickHandler(event) {
@@ -24,7 +37,13 @@ class SiteFooter extends React.Component {

  renderSiteLogo() {
    return (
-      <img src={this.props.siteLogo} alt={`${this.props.siteName} logo`} />
+      <img
+        src={this.props.siteLogo}
+        alt={this.props.intl.formatMessage(
+          messages['footer.site-footer.site-logo.alt-text'],
+          { siteName: this.props.siteName },
+        )}
+      />
    );
  }

@@ -32,101 +51,17 @@ class SiteFooter extends React.Component {
    return `${this.props.marketingSiteBaseUrl}${path}`;
  }

-  renderSocialLinks() {
+  renderEnterpriseMarketingSiteUrl(enterpriseLinkData) {
    const {
-      siteName,
-      showSocialLinks,
-      facebookUrl,
-      twitterUrl,
-      youTubeUrl,
-      linkedInUrl,
-      googlePlusUrl,
-      redditUrl,
-    } = this.props;
-    let socialLinks = null;
-    if (showSocialLinks) {
-      socialLinks = (
-        <ul
-          className="d-flex flex-row justify-content-between list-unstyled max-width-222 p-0 mb-4"
-        >
-          {/* TODO: Use Paragon HyperLink with Icon. */}
-          {/*  Would need to add rel to paragon if we still need it. */}
-          <li>
-            <a
-              href={facebookUrl}
-              title="Facebook"
-              rel="noopener noreferrer"
-              target="_blank"
-              onClick={this.externalLinkClickHandler}
-            >
-              <Icon className={['fa', 'fa-facebook-square', 'fa-2x']} screenReaderText={`Like ${siteName} on Facebook`} />
-            </a>
-          </li>
-
-
-          <li>
-            <a
-              href={twitterUrl}
-              title="Twitter"
-              rel="noopener noreferrer"
-              target="_blank"
-              onClick={this.externalLinkClickHandler}
-            >
-              <Icon className={['fa', 'fa-twitter-square', 'fa-2x']} screenReaderText={`Follow ${siteName} on Twitter`} />
-            </a>
-          </li>
-          <li>
-            <a
-              href={youTubeUrl}
-              title="Youtube"
-              rel="noopener noreferrer"
-              target="_blank"
-              onClick={this.externalLinkClickHandler}
-            >
-              <Icon className={['fa', 'fa-youtube-square', 'fa-2x']} screenReaderText={`Subscribe to the ${siteName} YouTube channel`} />
-            </a>
-          </li>
-          <li>
-            <a
-              href={linkedInUrl}
-              title="LinkedIn"
-              rel="noopener noreferrer"
-              target="_blank"
-              onClick={this.externalLinkClickHandler}
-            >
-              <Icon className={['fa', 'fa-linkedin-square', 'fa-2x']} screenReaderText={`Follow ${siteName} on LinkedIn`} />
-            </a>
-          </li>
-          <li>
-            <a
-              href={googlePlusUrl}
-              title="Google+"
-              rel="noopener noreferrer"
-              target="_blank"
-              onClick={this.externalLinkClickHandler}
-            >
-              <Icon className={['fa', 'fa-google-plus-square', 'fa-2x']} screenReaderText={`Follow ${siteName} on Google+`} />
-            </a>
-          </li>
-          <li>
-            <a
-              href={redditUrl}
-              title="Reddit"
-              rel="noopener noreferrer"
-              target="_blank"
-              onClick={this.externalLinkClickHandler}
-            >
-              <Icon className={['fa', 'fa-reddit-square', 'fa-2x']} screenReaderText={`Subscribe to the ${siteName} subreddit`} />
-            </a>
-          </li>
-        </ul>
-      );
-    }
-    return socialLinks;
+      queryParams,
+      url,
+    } = enterpriseLinkData;
+    return queryParams ? `${url}/?${qs.stringify(queryParams)}` : url;
  }

  renderMobileLinks() {
    const {
+      intl,
      siteName,
      showMobileLinks,
      appleAppStoreUrl,
@@ -140,7 +75,10 @@ class SiteFooter extends React.Component {
            <a href={appleAppStoreUrl} rel="noopener noreferrer" target="_blank" onClick={this.externalLinkClickHandler}>
              <img
                className="max-height-39"
-                alt={`Download the ${siteName} mobile app from the Apple App Store`}
+                alt={intl.formatMessage(
+                  messages['footer.site-footer.apple-app-store.alt-text'],
+                  { siteName },
+                )}
                src="https://prod-edxapp.edx-cdn.org/static/images/app/app_store_badge_135x40.d0558d910630.svg"
              />
            </a>
@@ -149,7 +87,10 @@ class SiteFooter extends React.Component {
            <a href={googlePlayUrl} rel="noopener noreferrer" target="_blank" onClick={this.externalLinkClickHandler}>
              <img
                className="max-height-39"
-                alt={`Download the ${siteName} mobile app from Google Play`}
+                alt={intl.formatMessage(
+                  messages['footer.site-footer.google-play.alt-text'],
+                  { siteName },
+                )}
                src="https://prod-edxapp.edx-cdn.org/static/images/app/google_play_badge_45.6ea466e328da.png"
              />
            </a>
@@ -160,64 +101,267 @@ class SiteFooter extends React.Component {
    return mobileLinks;
  }

+  renderBusinessMarketingListItem() {
+    const { siteName, enterpriseMarketingLink } = this.props;
+    return enterpriseMarketingLink && (
+      <li>
+        <a href={this.renderEnterpriseMarketingSiteUrl(enterpriseMarketingLink)}>
+          <FormattedMessage
+            id="footer.site-footer.link.business"
+            defaultMessage="{siteName} for Business"
+            description="A link that points to a business marketing page for a specified website"
+            values={{ siteName }}
+          />
+        </a>
+      </li>
+    );
+  }
+
  render() {
    const {
+      intl,
      siteName,
      openSourceUrl,
      termsOfServiceUrl,
      privacyPolicyUrl,
      contactUrl,
      supportUrl,
+      socialLinks,
+      supportedLanguages,
+      languageForm,
    } = this.props;
+    const showLanguageSelector = supportedLanguages.length > 0 &&
+                                 languageForm;
    return (
      <footer
        role="contentinfo"
-        aria-label="Page Footer"
+        aria-label={intl.formatMessage(messages['footer.site-footer.footer.aria-label'])}
        className="footer d-flex justify-content-center border-top py-3 px-4"
      >
        <div className="max-width-1180 d-grid">
          <div className="area-1">
-            <Hyperlink destination={this.renderMarketingSiteUrl('/')} content={this.renderSiteLogo()} aria-label={`${siteName} Home`} />
+            <Hyperlink
+              destination={this.renderMarketingSiteUrl('/')}
+              content={this.renderSiteLogo()}
+              aria-label={intl.formatMessage(
+                messages['footer.site-footer.site-logo.aria-label'],
+                { siteName },
+              )}
+            />
+            {showLanguageSelector &&
+              <div className="i18n d-flex mt-2">
+                <form
+                  className="d-flex align-items-start"
+                  onSubmit={this.applyLanguageSelection}
+                >
+                  {/* eslint-disable-next-line jsx-a11y/label-has-for */}
+                  <label htmlFor="site-footer-language-select">
+                    {languageForm.icon}
+                    <div className="sr-only">{languageForm.screenReaderLabel}</div>
+                  </label>
+                  <select
+                    id="site-footer-language-select"
+                    className="mx-2 mt-1"
+                    name="site-footer-language-select"
+                    defaultValue={languageForm.activeLanguage}
+                  >
+                    {supportedLanguages.map(({ value, label }) =>
+                      <option key={value} value={value}>{label}</option>)}
+                  </select>
+                  <button className="mt-1" type="submit">{languageForm.submitLabel}</button>
+                </form>
+              </div>
+            }
          </div>
          <div className="area-2">
            <h2>{siteName}</h2>
            <ul className="list-unstyled p-0 m-0">
-              <li><a href={this.renderMarketingSiteUrl('/about-us')}>About</a></li>
-              <li><a href={this.renderMarketingSiteUrl('/enterprise')}>{siteName} for Business</a></li>
-              <li><a href={this.renderMarketingSiteUrl('/affiliate-program')}>Affiliates</a></li>
-              <li><a href={openSourceUrl}>Open {siteName}</a></li>
-              <li><a href={this.renderMarketingSiteUrl('/careers')}>Careers</a></li>
-              <li><a href={this.renderMarketingSiteUrl('/news-announcements')}>News</a></li>
+              <li>
+                <a href={this.renderMarketingSiteUrl('/about-us')}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.about"
+                    defaultMessage="About"
+                  />
+                </a>
+              </li>
+              {this.renderBusinessMarketingListItem()}
+              <li>
+                <a href={this.renderMarketingSiteUrl('/affiliate-program')}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.affiliates"
+                    defaultMessage="Affiliates"
+                  />
+                </a>
+              </li>
+              <li>
+                <a href={openSourceUrl}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.open-source"
+                    defaultMessage="Open {siteName}"
+                    values={{ siteName }}
+                    description="Open Source link text"
+                  />
+                </a>
+              </li>
+              <li>
+                <a href={this.renderMarketingSiteUrl('/careers')}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.careers"
+                    defaultMessage="Careers"
+                  />
+                </a>
+              </li>
+              <li>
+                <a href={this.renderMarketingSiteUrl('/news-announcements')}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.news"
+                    defaultMessage="News"
+                  />
+                </a>
+              </li>
            </ul>
          </div>
          <div className="area-3">
-            <h2>Legal</h2>
+            <h2>
+              <FormattedMessage
+                id="footer.site-footer.link.header.legal"
+                defaultMessage="Legal"
+                description="Header for legal links"
+              />
+            </h2>
            <ul className="list-unstyled p-0 m-0">
-              <li><a href={termsOfServiceUrl}>Terms of Service & Honor Code</a></li>
-              <li><a href={privacyPolicyUrl}>Privacy Policy</a></li>
-              <li><a href={this.renderMarketingSiteUrl('/accessibility')}>Accessibility Policy</a></li>
-              <li><a href={this.renderMarketingSiteUrl('/trademarks')}>Trademark Policy</a></li>
-              <li><a href={this.renderMarketingSiteUrl('/sitemap')}>Sitemap</a></li>
+              <li>
+                <a href={termsOfServiceUrl}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.terms-of-service"
+                    defaultMessage="Terms of Service & Honor Code"
+                  />
+                </a>
+              </li>
+              <li>
+                <a href={privacyPolicyUrl}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.privacy"
+                    defaultMessage="Privacy Policy"
+                  />
+                </a>
+              </li>
+              <li>
+                <a href={this.renderMarketingSiteUrl('/accessibility')}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.accessibility"
+                    defaultMessage="Accessibility Policy"
+                  />
+                </a>
+              </li>
+              <li>
+                <a href={this.renderMarketingSiteUrl('/trademarks')}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.trademark"
+                    defaultMessage="Trademark Policy"
+                  />
+                </a>
+              </li>
+              <li>
+                <a href={this.renderMarketingSiteUrl('/sitemap')}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.sitemap"
+                    defaultMessage="Sitemap"
+                  />
+                </a>
+              </li>
            </ul>
          </div>
          <div className="area-4">
-            <h2>Connect</h2>
+            <h2>
+              <FormattedMessage
+                id="footer.site-footer.link.header.connect"
+                defaultMessage="Connect"
+                description="Header for connect links"
+              />
+            </h2>
            <ul className="list-unstyled p-0 m-0">
-              <li><a href={this.renderMarketingSiteUrl('/blog')}>Blog</a></li>
-              <li><a href={contactUrl}>Contact Us</a></li>
-              <li><a href={supportUrl}>Help Center</a></li>
-              <li><a href={this.renderMarketingSiteUrl('/media-kit')}>Media Kit</a></li>
-              <li><a href={this.renderMarketingSiteUrl('/donate')}>Donate</a></li>
+              <li>
+                <a href={this.renderMarketingSiteUrl('/blog')}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.blog"
+                    defaultMessage="Blog"
+                  />
+                </a>
+              </li>
+              <li>
+                <a href={contactUrl}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.contact-us"
+                    defaultMessage="Contact Us"
+                  />
+                </a>
+              </li>
+              <li>
+                <a href={supportUrl}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.help-center"
+                    defaultMessage="Help Center"
+                  />
+                </a>
+              </li>
+              <li>
+                <a href={this.renderMarketingSiteUrl('/media-kit')}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.media-kit"
+                    defaultMessage="Media Kit"
+                  />
+                </a>
+              </li>
+              <li>
+                <a href={this.renderMarketingSiteUrl('/donate')}>
+                  <FormattedMessage
+                    id="footer.site-footer.link.donate"
+                    defaultMessage="Donate"
+                  />
+                </a>
+              </li>
            </ul>
          </div>
          <div className="area-5">
-            {this.renderSocialLinks()}
+            {socialLinks.length > 0 &&
+              <ul className="d-flex flex-row justify-content-between list-unstyled max-width-222 p-0 mb-4">
+                {socialLinks.map(link => (
+                  <li key={link.url}>
+                    <a
+                      href={link.url}
+                      title={link.title}
+                      rel="noopener noreferrer"
+                      target="_blank"
+                      onClick={this.externalLinkClickHandler}
+                    >
+                      {link.icon}
+                      <span className="sr-only">{link.screenReaderText}</span>
+                    </a>
+                  </li>
+                ))}
+              </ul>
+            }
            {this.renderMobileLinks()}
            <p>
-              © 2012–{(new Date().getFullYear())} {siteName} Inc.
+              <FormattedMessage
+                id="footer.site-footer.copyright-text"
+                defaultMessage="{copyrightSymbol} {startDate}–{endDate} {siteName} Inc."
+                values={{
+                  copyrightSymbol: '©',
+                  startDate: '2012',
+                  endDate: `${new Date().getFullYear()}`,
+                  siteName,
+                }}
+                description="Footer copyright text with copyright symbol and dates"
+              />
              <br />
-              EdX, Open edX, and MicroMasters are registered trademarks of edX Inc.
-              | 粤ICP备17044299号-2
+              <FormattedMessage
+                id="footer.site-footer.trademark-text"
+                defaultMessage="EdX, Open edX, and MicroMasters are registered trademarks of edX Inc. | {icpLicense}"
+                values={{ icpLicense: '粤ICP备17044299号-2' }}
+                description="Footer trademark text"
+              />
            </p>
          </div>
        </div>
@@ -230,44 +374,56 @@ SiteFooter.propTypes = {
  siteName: PropTypes.string,
  siteLogo: PropTypes.node,
  marketingSiteBaseUrl: PropTypes.string,
+  enterpriseMarketingLink: PropTypes.shape({
+    url: PropTypes.string,
+    queryParams: PropTypes.shape({}),
+  }),
  supportUrl: PropTypes.string,
  contactUrl: PropTypes.string,
  openSourceUrl: PropTypes.string,
  termsOfServiceUrl: PropTypes.string,
  privacyPolicyUrl: PropTypes.string,
-  showSocialLinks: PropTypes.bool,
-  facebookUrl: PropTypes.string,
-  twitterUrl: PropTypes.string,
-  youTubeUrl: PropTypes.string,
-  linkedInUrl: PropTypes.string,
-  googlePlusUrl: PropTypes.string,
-  redditUrl: PropTypes.string,
+  socialLinks: PropTypes.arrayOf(PropTypes.shape({
+    title: PropTypes.string.isRequired,
+    url: PropTypes.string.isRequired,
+    icon: PropTypes.element.isRequired,
+    screenReaderText: PropTypes.string.isRequired,
+  })),
  showMobileLinks: PropTypes.bool,
  appleAppStoreUrl: PropTypes.string,
  googlePlayUrl: PropTypes.string,
+  supportedLanguages: PropTypes.arrayOf(PropTypes.shape({
+    label: PropTypes.string.isRequired,
+    value: PropTypes.string.isRequired,
+  })),
+  languageForm: PropTypes.shape({
+    screenReaderLabel: PropTypes.string.isRequired,
+    submitLabel: PropTypes.string.isRequired,
+    onLanguageSelected: PropTypes.func.isRequired,
+    icon: PropTypes.node.isRequired,
+    activeLanguage: PropTypes.string,
+  }),
  handleAllTrackEvents: PropTypes.func.isRequired,
+  intl: intlShape.isRequired,
 };

 SiteFooter.defaultProps = {
  siteName: null,
  siteLogo: null,
  marketingSiteBaseUrl: null,
+  enterpriseMarketingLink: null,
  supportUrl: null,
  contactUrl: null,
  openSourceUrl: null,
  termsOfServiceUrl: null,
  privacyPolicyUrl: null,
-  showSocialLinks: true,
-  facebookUrl: null,
-  twitterUrl: null,
-  youTubeUrl: null,
-  linkedInUrl: null,
-  googlePlusUrl: null,
-  redditUrl: null,
+  socialLinks: [],
  showMobileLinks: true,
  appleAppStoreUrl: null,
  googlePlayUrl: null,
+  supportedLanguages: [],
+  languageForm: null,
 };

-export default SiteFooter;
+export default injectIntl(SiteFooter);
 export { EVENT_NAMES };
--- a/stats.json
+++ b/stats.json
Author	SHA1	Message	Date
edX Transifex Bot	9eeccc63cb	fix(i18n): update translations	2019-05-19 17:33:41 -04:00
Robert Raposa	2f33c6718b	Merge pull request #31 from edx/robrap/ARCH-748-fix-i18n-jobs fix(i18n): fix i18n make targets	2019-05-16 13:20:46 -04:00
Adam Stankiewicz	89397fcfdb	Merge pull request #32 from edx/astankiewicz/downgrade-query-string fix(query-string): downgrade query-string to version 5 for es5	2019-05-16 12:57:21 -04:00
Adam Stankiewicz	278b4b1473	fix(query-string): downgrade query-string to version 5 for es5	2019-05-16 09:44:44 -07:00
Robert Raposa	7ff9039bb7	fix(i18n): fix i18n make targets ARCH-748	2019-05-16 12:27:27 -04:00
Chris Pappas	0cf3164901	Merge pull request #28 from edx/cpappas/ENT-1888 fix: updating enterprise marketing link logic	2019-05-10 16:55:50 -04:00
Christopher Pappas	bf8020dfac	fix: updating business marketing footer fix: adding https:// to business marketing link fix: fixing marketing link for business fix: fixing marketing link for business	2019-05-10 15:49:40 -04:00
Adam Butterworth	f2a13b8c8e	fix: move dependencies out of footer	2019-05-10 08:27:18 -06:00
Adam Butterworth	3dd9b25d11	fix: move peerDependencies to dependencies	2019-05-10 10:24:23 -04:00
Adam Butterworth	21d7fe04e3	fix: move dependencies out of footer	2019-05-10 10:14:37 -04:00
AlasdairSwan	46d464d515	Merge pull request #27 from edx/alasdair/add-language-selector Alasdair/add language selector	2019-05-08 13:42:52 -04:00
AlasdairSwan	85ed8fbff4	feat(langselect): add optional language selector	2019-05-08 13:38:01 -04:00
AlasdairSwan	d6adfec189	Merge pull request #25 from edx/alasdair/update-social-media-link-approach fix(sociallinks): update link props	2019-05-07 12:53:21 -04:00
AlasdairSwan	8b1943356e	fix(sociallinks): update link props BREAKING CHANGE will not render social links unless array is passed in	2019-05-07 12:17:42 -04:00
AlasdairSwan	5aae6e8336	Merge pull request #26 from edx/alasdair/version-bump fix(version): trivial update to minor version bump	2019-05-07 12:12:33 -04:00
AlasdairSwan	ae18ad45b9	fix(version): trivial update to minor version bump	2019-05-07 11:56:32 -04:00
AlasdairSwan	0e15bb7e55	Merge pull request #24 from edx/alasdair/revert-social-media-links Revert social media links PR	2019-05-07 11:30:02 -04:00
AlasdairSwan	ff664b9d3b	Revert social media links PR	2019-05-07 11:24:04 -04:00
AlasdairSwan	da91fb6392	Merge pull request #23 from edx/alasdair/fontawesome-svg-and-social-link-array-prop fix(sociallinks): array for social props BREAKING CHANGE: props change	2019-05-07 10:29:25 -04:00
AlasdairSwan	f265c7daa6	fix(sociallinks): array for social props BREAKING CHANGE: props change	2019-05-06 15:08:50 -04:00
albemarle	3037e4d8a6	Merge pull request #22 from edx/albemarle/i18n-travis build: validate i18n	2019-05-06 10:20:20 -04:00
albemarle	b2a7696c0e	build: validate i18n	2019-05-03 15:32:30 -04:00
albemarle	6dc8f64ccb	Merge pull request #19 from edx/albemarle/more-i18n fix(i18n): use up-to-date i18n-concat.js	2019-04-09 15:46:31 -04:00
albemarle	0453d7fbaa	fix(i18n): use up-to-date i18n-concat.js	2019-04-09 15:38:46 -04:00
Robert Raposa	fa6d38f422	Merge pull request #18 from edx/albemarle/check-changes fix(i18n): add detect_changed_source_translations target to stop jobs erroring	2019-04-05 16:52:44 -04:00
albemarle	9f3e945d4e	fix(i18n): add detect_changed_source_translations target to stop jobs erroring	2019-04-05 16:42:50 -04:00
edX Transifex Bot	429d19291d	fix(i18n): update translations	2019-04-05 16:21:24 -04:00
Matt Tuchfarber	e27bc8de39	Merge pull request #16 from edx/tuchfarber/remove_translation_fail fix: remove incorrect translation files	2019-04-05 15:38:56 -04:00
Matt Tuchfarber	cd0b84c223	fix: remove incorrect translation files Remove translation files that were generated by an incorrect transifex config	2019-04-05 15:33:23 -04:00
Matt Tuchfarber	26810c99e6	Merge pull request #15 from edx/tuchfarber/make_umd_build Generate builds so they can be used in server rendered apps	2019-04-05 15:20:44 -04:00
Matt Tuchfarber	2fb8ea2608	Generate builds so they can be used in server rendered apps Current build uses window everywhere, thus breaking server rendered apps	2019-04-05 12:34:52 -04:00
albemarle	16c6da229b	Merge pull request #14 from edx/tuchfarber/fix_i18n_quoting Fix i18n paths	2019-04-04 15:26:50 -04:00
Matt Tuchfarber	fb8de7a59c	Fix i18n paths	2019-04-04 15:13:55 -04:00
Robert Raposa	21a9e6c5e1	Merge pull request #13 from edx/robrap/ARCH-460-change-file-ext fix: update file extension	2019-03-21 14:52:25 -04:00
Robert Raposa	9475888392	fix: update file extension	2019-03-21 14:45:35 -04:00
Robert Raposa	c069f20716	Merge pull request #12 from edx/robrap/ARCH-460-add-empty-language ARCH-460: fix: add empty language files	2019-03-20 17:14:10 -04:00
Robert Raposa	46772ecc0e	fix: add empty language files ARCH-460	2019-03-20 17:03:47 -04:00
edX Transifex Bot	ca09a07c62	fix(i18n): update translations	2019-03-20 16:36:53 -04:00
Robert Raposa	66f6832887	Merge pull request #9 from edx/robrap/ARCH-460-i18n ARCH-460: feat: initial localization of footer	2019-03-20 13:16:42 -04:00
Robert Raposa	8f35487558	feat: initial localization of footer BREAKING CHANGE: Now requires containing app to use `react-intl`. See update to README for details. ARCH-460	2019-03-20 12:37:11 -04:00
Adam Butterworth	349a458617	Merge pull request #8 from edx/abutterworth/unique-ids fix: add unique ids to Icon components	2019-03-08 14:00:06 -05:00
Adam Butterworth	abe3d03f58	fix: update snapshot to reflect new ids	2019-03-08 12:44:00 -05:00
Adam Butterworth	7af4b71faa	fix: add unique ids to Icon components	2019-03-08 12:35:35 -05:00