feat: use openedx footer by default (#282)

* feat: use openedx footer by default

* fix: delete footer directory and update package-lock

footer/Footer.jsx

@@ -1,99 +0,0 @@
-import React from 'react';
-import SiteFooter from '@edx/frontend-component-footer';
-import { sendTrackEvent } from '@edx/frontend-analytics';
-import { App, validateConfig } from '@edx/frontend-base';
-import {
-  faFacebookSquare,
-  faTwitterSquare,
-  faYoutubeSquare,
-  faLinkedin,
-  faRedditSquare,
-} from '@fortawesome/free-brands-svg-icons';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-
-
-import FooterLogo from './edx-footer.png';
-
-const config = {
-  APPLE_APP_STORE_URL: process.env.APPLE_APP_STORE_URL,
-  CONTACT_URL: process.env.CONTACT_URL,
-  ENTERPRISE_MARKETING_FOOTER_UTM_MEDIUM: process.env.ENTERPRISE_MARKETING_FOOTER_UTM_MEDIUM,
-  ENTERPRISE_MARKETING_URL: process.env.ENTERPRISE_MARKETING_URL,
-  ENTERPRISE_MARKETING_UTM_CAMPAIGN: process.env.ENTERPRISE_MARKETING_UTM_CAMPAIGN,
-  ENTERPRISE_MARKETING_UTM_SOURCE: process.env.ENTERPRISE_MARKETING_UTM_SOURCE,
-  FACEBOOK_URL: process.env.FACEBOOK_URL,
-  GOOGLE_PLAY_URL: process.env.GOOGLE_PLAY_URL,
-  LINKED_IN_URL: process.env.LINKED_IN_URL,
-  OPEN_SOURCE_URL: process.env.OPEN_SOURCE_URL,
-  PRIVACY_POLICY_URL: process.env.PRIVACY_POLICY_URL,
-  REDDIT_URL: process.env.REDDIT_URL,
-  SUPPORT_URL: process.env.SUPPORT_URL,
-  TERMS_OF_SERVICE_URL: process.env.TERMS_OF_SERVICE_URL,
-  TWITTER_URL: process.env.TWITTER_URL,
-  YOU_TUBE_URL: process.env.YOU_TUBE_URL,
-};
-
-App.requireConfig(['SITE_NAME', 'MARKETING_SITE_BASE_URL'], 'ProfileFooter');
-validateConfig(config, 'ProfileFooter');
-
-export default function ProfileFooter() {
-  const socialLinks = [
-    {
-      title: 'Facebook',
-      url: config.FACEBOOK_URL,
-      icon: <FontAwesomeIcon icon={faFacebookSquare} className="social-icon" size="2x" />,
-      screenReaderText: 'Like edX on Facebook',
-    },
-    {
-      title: 'Twitter',
-      url: config.TWITTER_URL,
-      icon: <FontAwesomeIcon icon={faTwitterSquare} className="social-icon" size="2x" />,
-      screenReaderText: 'Follow edX on Twitter',
-    },
-    {
-      title: 'Youtube',
-      url: config.YOU_TUBE_URL,
-      icon: <FontAwesomeIcon icon={faYoutubeSquare} className="social-icon" size="2x" />,
-      screenReaderText: 'Subscribe to the edX YouTube channel',
-    },
-    {
-      title: 'LinkedIn',
-      url: config.LINKED_IN_URL,
-      icon: <FontAwesomeIcon icon={faLinkedin} className="social-icon" size="2x" />,
-      screenReaderText: 'Follow edX on LinkedIn',
-    },
-    {
-      title: 'Reddit',
-      url: config.REDDIT_URL,
-      icon: <FontAwesomeIcon icon={faRedditSquare} className="social-icon" size="2x" />,
-      screenReaderText: 'Subscribe to the edX subreddit',
-    },
-  ];
-
-  const enterpriseMarketingLinkData = {
-    url: config.ENTERPRISE_MARKETING_URL,
-    queryParams: {
-      utm_campaign: config.ENTERPRISE_MARKETING_UTM_CAMPAIGN,
-      utm_source: config.ENTERPRISE_MARKETING_UTM_SOURCE,
-      utm_medium: config.ENTERPRISE_MARKETING_FOOTER_UTM_MEDIUM,
-    },
-  };
-
-  return (
-    <SiteFooter
-      appleAppStoreUrl={config.APPLE_APP_STORE_URL}
-      contactUrl={config.CONTACT_URL}
-      enterpriseMarketingLink={enterpriseMarketingLinkData}
-      googlePlayUrl={config.GOOGLE_PLAY_URL}
-      handleAllTrackEvents={sendTrackEvent}
-      marketingSiteBaseUrl={App.config.MARKETING_SITE_BASE_URL}
-      openSourceUrl={config.OPEN_SOURCE_URL}
-      privacyPolicyUrl={config.PRIVACY_POLICY_URL}
-      siteLogo={FooterLogo}
-      siteName={App.config.SITE_NAME}
-      socialLinks={socialLinks}
-      supportUrl={config.SUPPORT_URL}
-      termsOfServiceUrl={config.TERMS_OF_SERVICE_URL}
-    />
-  );
-}

package-lock.json

@@ -1132,11 +1132,54 @@
       }
     },
     "@edx/frontend-component-footer": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/@edx/frontend-component-footer/-/frontend-component-footer-6.0.2.tgz",
-      "integrity": "sha512-TB9fc85uXLRbznjshMNYJcLcwOA1GgPxaRrga8qpybb/80p4fawZnBY1XsupHFs15j/Xltk6xvF+QIm26K7m7A==",
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-component-footer/-/frontend-component-footer-8.0.0.tgz",
+      "integrity": "sha512-ZeZ15jhchHF8LS8yyhqvfqsm38nTcHgIDPGNzkvotDHNjqa2m+onIum1AouoQ3WDbynii3OiFVcl3u40W7c1CA==",
       "requires": {
-        "query-string": "^5.1.1"
+        "@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"
+      },
+      "dependencies": {
+        "@fortawesome/fontawesome-common-types": {
+          "version": "0.2.25",
+          "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.25.tgz",
+          "integrity": "sha512-3RuZPDuuPELd7RXtUqTCfed14fcny9UiPOkdr2i+cYxBoTOfQgxcDoq77fHiiHcgWuo1LoBUpvGxFF1H/y7s3Q=="
+        },
+        "@fortawesome/fontawesome-svg-core": {
+          "version": "1.2.25",
+          "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.25.tgz",
+          "integrity": "sha512-MotKnn53JKqbkLQiwcZSBJVYtTgIKFbh7B8+kd05TSnfKYPFmjKKI59o2fpz5t0Hzl35vVGU6+N4twoOpZUrqA==",
+          "requires": {
+            "@fortawesome/fontawesome-common-types": "^0.2.25"
+          }
+        },
+        "@fortawesome/free-brands-svg-icons": {
+          "version": "5.11.2",
+          "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-5.11.2.tgz",
+          "integrity": "sha512-wKK5znpHiZ2S0VgOvbeAnYuzkk3H86rxWajD9PVpfBj3s/kySEWTFKh/uLPyxiTOx8Tsd0OGN4En/s9XudVHLQ==",
+          "requires": {
+            "@fortawesome/fontawesome-common-types": "^0.2.25"
+          }
+        },
+        "@fortawesome/free-regular-svg-icons": {
+          "version": "5.11.2",
+          "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-5.11.2.tgz",
+          "integrity": "sha512-k0vbThRv9AvnXYBWi1gn1rFW4X7co/aFkbm0ZNmAR5PoWb9vY9EDDDobg8Ay4ISaXtCPypvJ0W1FWkSpLQwZ6w==",
+          "requires": {
+            "@fortawesome/fontawesome-common-types": "^0.2.25"
+          }
+        },
+        "@fortawesome/free-solid-svg-icons": {
+          "version": "5.11.2",
+          "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.11.2.tgz",
+          "integrity": "sha512-zBue4i0PAZJUXOmLBBvM7L0O7wmsDC8dFv9IhpW5QL4kT9xhhVUsYg/LX1+5KaukWq4/cbDcKT+RT1aRe543sg==",
+          "requires": {
+            "@fortawesome/fontawesome-common-types": "^0.2.25"
+          }
+        }
       }
     },
     "@edx/frontend-component-header": {
@@ -5211,7 +5254,8 @@
     "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="
+      "integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU=",
+      "dev": true
     },
     "decompress": {
       "version": "4.2.0",
@@ -14153,6 +14197,7 @@
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/query-string/-/query-string-5.1.1.tgz",
       "integrity": "sha512-gjWOsm2SoGlgLEdAGt7a6slVOk9mGiXmPFMqrEhLQ68rhQuBnpfs3+EmlvqKyxnCo9/PPlF+9MtY02S1aFg+Jw==",
+      "dev": true,
       "requires": {
         "decode-uri-component": "^0.2.0",
         "object-assign": "^4.1.0",

package.json

@@ -44,7 +44,7 @@
     "@edx/frontend-analytics": "3.0.0",
     "@edx/frontend-auth": "7.0.1",
     "@edx/frontend-base": "2.2.0",
-    "@edx/frontend-component-footer": "6.0.2",
+    "@edx/frontend-component-footer": "8.0.0",
     "@edx/frontend-component-header": "1.1.2",
     "@edx/frontend-i18n": "3.0.2",
     "@edx/frontend-logging": "3.0.1",

src/index.jsx

@@ -6,7 +6,7 @@ import ReactDOM from 'react-dom';
 import { Route, Switch } from 'react-router-dom';
 
 import Header, { messages as headerMessages } from '@edx/frontend-component-header';
-import Footer from '../footer/Footer';
+import Footer, { messages as footerMessages } from '@edx/frontend-component-footer';
 
 import appMessages from './i18n';
 import './index.scss';
@@ -34,4 +34,10 @@ App.subscribe(APP_ERROR, (error) => {
   ReactDOM.render(<ErrorPage message={error.message} />, document.getElementById('root'));
 });
 
-App.initialize({ messages: [appMessages, headerMessages] });
+App.initialize({
+  messages: [
+    appMessages,
+    headerMessages,
+    footerMessages,
+  ],
+});

src/index.scss

@@ -4,4 +4,4 @@
 @import './profile/index.scss';
 
 @import "~@edx/frontend-component-header/src/index";
-@import "~@edx/frontend-component-footer/src/lib/scss/site-footer";
+@import "~@edx/frontend-component-footer/src/footer";