chore: update browserslist DB (#1334)

Co-authored-by: jsnwesson <62807795+jsnwesson@users.noreply.github.com>

.github/pull_request_template.md

@@ -20,5 +20,5 @@ Include a link to the sandbox for design changes or screenshot for before and af
 
 #### Post-merge Checklist
 
-* [ ] Deploy the changes to prod after verifying on stage or ask **@openedx/2u-infinity** to do it. 
+* [ ] Deploy the changes to prod after verifying on stage or ask **@jacobo-dominguez-wgu** to do it. 
 * [ ] 🎉 🙌 Celebrate! Thanks for your contribution.

README.rst

@@ -32,44 +32,52 @@ When a user views someone else's profile, they see all those fields that that us
 Getting Started
 ***************
 
-Installation
+Prerequisites
-============
+=============
 
-Follow these steps to provision, run, and enable an instance of the
+The Tutor_ platform is a prerequisite for developing an MFE.
-Profile MFE for local development via the `devstack`_.
+Utilize `relevant tutor-mfe documentation`_ to guide you through
+the process of MFE development within the Tutor environment.
 
-.. _devstack: https://github.com/openedx/devstack#getting-started
+.. _Tutor: https://github.com/overhangio/tutor
 
-#. To use this application, `devstack <https://github.com/openedx/devstack>`__ must be running and you must be logged into it.
+.. _relevant tutor-mfe documentation: https://github.com/overhangio/tutor-mfe#mfe-development
 
-   * Start devstack
-   * Log in (http://localhost:18000/login)
 
-#. To run Profile, install requirements and start the development server by running:
+Cloning and Startup
+===================
 
-.. code-block::
+1. Clone the repo:
-
-  1. Clone your new repo:
 
   ``git clone https://github.com/openedx/frontend-app-profile.git``
 
-  2. Use node v18.x.
+2. Use the version of node in the `.nvmrc` file.
 
-    The current version of the micro-frontend build scripts support node 18.
+  The current version of the micro-frontend build scripts support the version of node found in `.nvmrc`.
   Using other major versions of node *may* work, but this is unsupported.  For
   convenience, this repository includes an .nvmrc file to help in setting the
   correct node version via `nvm <https://github.com/nvm-sh/nvm>`_.
 
-  3. Install npm dependencies:
+3. Install npm dependencies:
 
   ``cd frontend-app-profile && npm ci``
 
-  4. Start the dev server:
+4. Mount the frontend-app-profile MFE in Tutor:
 
-    ``npm start``
+  ``tutor mounts add <your-tutor-project-dir>/frontend-app-profile``
-     The server will run on port 1995
+5. Build the Docker image:
 
-Once the dev server is up, visit http://localhost:1995/u/staff.
+  ``tutor images build profile-dev``
+
+6. Launch the development server with Tutor:
+
+  ``tutor dev start profile``
+
+
+The dev server is running at `http://localhost:1995/u/staff <http://localhost:1995/u/staff>`_.
+
+`Tutor <https://github.com/overhangio/tutor>`_. If you start Tutor with ``tutor dev start profile``
+that should give you everything you need as a companion to this frontend.
 
 Plugins
 =======

catalog-info.yaml

@@ -19,7 +19,7 @@ metadata:
     openedx.org/add-to-projects: "openedx:23"
     openedx.org/release: "master"
 spec:
-  owner: group:2u-infinity
+  owner: jacobo-dominguez-wgu
   type: 'service'
   lifecycle: 'production'
 # (Optional) An array of different components or resources.

package.json

@@ -44,7 +44,7 @@
     "@pact-foundation/pact": "^11.0.2",
     "@redux-devtools/extension": "3.3.0",
     "classnames": "2.5.1",
-    "core-js": "3.46.0",
+    "core-js": "3.48.0",
     "history": "5.3.0",
     "lodash.camelcase": "4.3.0",
     "lodash.get": "4.4.2",
@@ -55,11 +55,11 @@
     "react-dom": "18.3.1",
     "react-helmet": "6.1.0",
     "react-redux": "7.2.9",
-    "react-router": "6.30.1",
+    "react-router": "6.30.3",
-    "react-router-dom": "6.30.1",
+    "react-router-dom": "6.30.3",
     "redux": "4.2.1",
     "redux-logger": "3.0.6",
-    "redux-saga": "1.3.0",
+    "redux-saga": "1.4.2",
     "redux-thunk": "2.4.2",
     "regenerator-runtime": "0.14.1",
     "reselect": "5.1.1",
@@ -72,7 +72,7 @@
     "@openedx/frontend-build": "^14.6.2",
     "@testing-library/jest-dom": "6.9.1",
     "@testing-library/react": "14.3.1",
-    "glob": "11.0.3",
+    "glob": "11.1.0",
     "redux-mock-store": "1.5.5"
   }
 }

src/profile/ProfilePage.test.jsx

@@ -158,7 +158,7 @@ describe('<ProfilePage />', () => {
                 courseCertificates: [{ title: 'Course 1' }],
                 levelOfEducation: 'bachelors',
                 languageProficiencies: [{ code: 'en' }],
-                socialLinks: [{ platform: 'twitter', socialLink: 'https://twitter.com/user' }],
+                socialLinks: [{ platform: 'x', socialLink: 'https://x.com/user' }],
               },
               preferences: {
                 ...storeMocks.viewOtherProfile.profilePage.preferences,

src/profile/__mocks__/savingEditedBio.mockStore.js

@@ -13,8 +13,8 @@ module.exports = {
         socialLink: 'https://www.facebook.com/aloha'
       },
       {
-        platform: 'twitter',
+        platform: 'x',
-        socialLink: 'https://www.twitter.com/ALOHA'
+        socialLink: 'https://www.x.com/ALOHA'
       }
     ],
     profileImage: {
@@ -85,8 +85,8 @@ module.exports = {
           socialLink: 'https://www.facebook.com/aloha'
         },
         {
-          platform: 'twitter',
+          platform: 'x',
-          socialLink: 'https://www.twitter.com/ALOHA'
+          socialLink: 'https://www.x.com/ALOHA'
         }
       ],
       timeZone: null,

src/profile/__mocks__/viewOtherProfile.mockStore.js

@@ -13,8 +13,8 @@ module.exports = {
         socialLink: 'https://www.facebook.com/aloha'
       },
       {
-        platform: 'twitter',
+        platform: 'x',
-        socialLink: 'https://www.twitter.com/ALOHA'
+        socialLink: 'https://www.x.com/ALOHA'
       }
     ],
     profileImage: {

src/profile/__mocks__/viewOwnProfile.mockStore.js

@@ -13,8 +13,8 @@ module.exports = {
         socialLink: 'https://www.facebook.com/aloha'
       },
       {
-        platform: 'twitter',
+        platform: 'x',
-        socialLink: 'https://www.twitter.com/ALOHA'
+        socialLink: 'https://www.x.com/ALOHA'
       }
     ],
     profileImage: {
@@ -85,8 +85,8 @@ module.exports = {
           socialLink: 'https://www.facebook.com/aloha'
         },
         {
-          platform: 'twitter',
+          platform: 'x',
-          socialLink: 'https://www.twitter.com/ALOHA'
+          socialLink: 'https://www.x.com/ALOHA'
         }
       ],
       timeZone: null,

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

@@ -307,7 +307,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing other profi
               class="pgn-transition-replace-group position-relative pt-40px"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <div
                   class="row m-0 pb-1.5 align-items-center"
@@ -357,7 +357,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing other profi
               class="pgn-transition-replace-group position-relative pt-40px"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <p
                   class="h5 font-weight-bold m-0 pb-1.5"
@@ -390,7 +390,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing other profi
               class="pgn-transition-replace-group position-relative pt-40px"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <p
                   class="h5 font-weight-bold m-0 pb-1.5"
@@ -423,7 +423,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing other profi
               class="pgn-transition-replace-group position-relative pt-40px"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <p
                   class="h5 font-weight-bold m-0 pb-1.5"
@@ -460,7 +460,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing other profi
               class="pgn-transition-replace-group position-relative pt-0"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <p
                   class="h5 font-weight-bold m-0 pb-1.5"
@@ -493,7 +493,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing other profi
               class="pgn-transition-replace-group position-relative p-0"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <div>
                   <div>
@@ -504,7 +504,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing other profi
                         class="h5 font-weight-bold m-0 pb-1.5"
                         data-hj-suppress="true"
                       >
-                        X
+                        X (Twitter)
                       </p>
                       <div
                         class="row m-0 p-0 d-flex flex-nowrap align-items-center"
@@ -515,7 +515,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing other profi
                           <h4
                             class="edit-section-header text-gray-700"
                           >
-                            https://twitter.com/user
+                            https://x.com/user
                           </h4>
                         </div>
                         <div
@@ -747,7 +747,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
               class="pgn-transition-replace-group position-relative pt-40px"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <div
                   class="row m-0 pb-1.5 align-items-center"
@@ -842,7 +842,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
               class="pgn-transition-replace-group position-relative pt-40px"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <p
                   class="h5 font-weight-bold m-0 pb-1.5"
@@ -920,7 +920,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
               class="pgn-transition-replace-group position-relative pt-40px"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <p
                   class="h5 font-weight-bold m-0 pb-1.5"
@@ -998,7 +998,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
               class="pgn-transition-replace-group position-relative pt-40px"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <p
                   class="h5 font-weight-bold m-0 pb-1.5"
@@ -1080,7 +1080,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
               class="pgn-transition-replace-group position-relative pt-0"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <p
                   class="h5 font-weight-bold m-0 pb-1.5"
@@ -1158,7 +1158,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
               class="pgn-transition-replace-group position-relative p-0"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <div>
                   <div>
@@ -1169,7 +1169,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
                         class="h5 font-weight-bold m-0 pb-1.5"
                         data-hj-suppress="true"
                       >
-                        X
+                        X (Twitter)
                       </p>
                       <div
                         class="w-100 overflowWrap-breakWord"
@@ -1183,7 +1183,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
                             <h4
                               class="edit-section-header text-gray-700"
                             >
-                              https://www.twitter.com/ALOHA
+                              https://www.x.com/ALOHA
                             </h4>
                           </div>
                           <div
@@ -1403,7 +1403,7 @@ exports[`<ProfilePage /> Renders correctly in various states viewing own profile
               >
                 <div
                   class="certificate-type-illustration"
-                  style="background-image: url(icon/mock/path);"
+                  style="background-image: url("icon/mock/path");"
                 />
                 <div
                   class="d-flex flex-column position-relative p-0 width-314px"
@@ -1663,7 +1663,7 @@ exports[`<ProfilePage /> Renders correctly in various states without credentials
               class="pgn-transition-replace-group position-relative pt-40px"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <div
                   class="row m-0 pb-1.5 align-items-center"
@@ -1758,7 +1758,7 @@ exports[`<ProfilePage /> Renders correctly in various states without credentials
               class="pgn-transition-replace-group position-relative pt-40px"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <p
                   class="h5 font-weight-bold m-0 pb-1.5"
@@ -1836,7 +1836,7 @@ exports[`<ProfilePage /> Renders correctly in various states without credentials
               class="pgn-transition-replace-group position-relative pt-40px"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <p
                   class="h5 font-weight-bold m-0 pb-1.5"
@@ -1914,7 +1914,7 @@ exports[`<ProfilePage /> Renders correctly in various states without credentials
               class="pgn-transition-replace-group position-relative pt-40px"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <p
                   class="h5 font-weight-bold m-0 pb-1.5"
@@ -1996,7 +1996,7 @@ exports[`<ProfilePage /> Renders correctly in various states without credentials
               class="pgn-transition-replace-group position-relative pt-0"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <p
                   class="h5 font-weight-bold m-0 pb-1.5"
@@ -2074,7 +2074,7 @@ exports[`<ProfilePage /> Renders correctly in various states without credentials
               class="pgn-transition-replace-group position-relative p-0"
             >
               <div
-                style="padding: .1px 0px;"
+                style="padding: 0.1px 0px;"
               >
                 <div>
                   <div>
@@ -2085,7 +2085,7 @@ exports[`<ProfilePage /> Renders correctly in various states without credentials
                         class="h5 font-weight-bold m-0 pb-1.5"
                         data-hj-suppress="true"
                       >
-                        X
+                        X (Twitter)
                       </p>
                       <div
                         class="w-100 overflowWrap-breakWord"
@@ -2099,7 +2099,7 @@ exports[`<ProfilePage /> Renders correctly in various states without credentials
                             <h4
                               class="edit-section-header text-gray-700"
                             >
-                              https://www.twitter.com/ALOHA
+                              https://www.x.com/ALOHA
                             </h4>
                           </div>
                           <div
@@ -2319,7 +2319,7 @@ exports[`<ProfilePage /> Renders correctly in various states without credentials
               >
                 <div
                   class="certificate-type-illustration"
-                  style="background-image: url(icon/mock/path);"
+                  style="background-image: url("icon/mock/path");"
                 />
                 <div
                   class="d-flex flex-column position-relative p-0 width-314px"

src/profile/data/constants.js

@@ -14,8 +14,8 @@ const SOCIAL = {
   linkedin: {
     title: 'LinkedIn',
   },
-  twitter: {
+  x: {
-    title: 'Twitter',
+    title: 'X',
   },
   facebook: {
     title: 'Facebook',

src/profile/data/reducers.test.js

@@ -32,7 +32,7 @@ describe('profilePage reducer', () => {
           bio: 'Software Engineer',
           country: 'US',
           levelOfEducation: 'bachelors',
-          socialLinks: [{ platform: 'twitter', link: 'twitter.com/johndoe' }],
+          socialLinks: [{ platform: 'x', link: 'x.com/johndoe' }],
           languageProficiencies: [{ code: 'en', name: 'English' }],
           profileImage: { url: 'profile.jpg' },
           yearOfBirth: 1990,

src/profile/data/selectors.js

@@ -187,7 +187,7 @@ export const formSocialLinksSelector = createSelector(
   socialLinksByPlatformSelector,
   draftSocialLinksByPlatformSelector,
   (linksByPlatform, draftLinksByPlatform) => {
-    const knownPlatforms = ['twitter', 'facebook', 'linkedin'];
+    const knownPlatforms = ['x', 'facebook', 'linkedin'];
     const socialLinks = [];
     knownPlatforms.forEach((platform) => {
       if (draftLinksByPlatform[platform] !== undefined) {

src/profile/forms/SocialLinks.jsx

@@ -2,7 +2,7 @@ import React, { useState } from 'react';
 import PropTypes from 'prop-types';
 import { Alert } from '@openedx/paragon';
 import { connect } from 'react-redux';
-import { faTwitter, faFacebook, faLinkedin } from '@fortawesome/free-brands-svg-icons';
+import { faXTwitter, faFacebook, faLinkedin } from '@fortawesome/free-brands-svg-icons';
 import { FormattedMessage } from '@edx/frontend-platform/i18n';
 import classNames from 'classnames';
 
@@ -19,9 +19,9 @@ const platformDisplayInfo = {
     icon: faFacebook,
     name: 'Facebook',
   },
-  twitter: {
+  x: {
-    icon: faTwitter,
+    icon: faXTwitter,
-    name: 'X',
+    name: 'X (Twitter)',
   },
   linkedin: {
     icon: faLinkedin,
@@ -46,7 +46,7 @@ const SocialLinks = ({
   const [activePlatform, setActivePlatform] = useState(null);
 
   const mergeWithDrafts = (newSocialLink) => {
-    const knownPlatforms = ['twitter', 'facebook', 'linkedin'];
+    const knownPlatforms = ['x', 'facebook', 'linkedin'];
     const updated = [];
     knownPlatforms.forEach((platform) => {
       if (newSocialLink.platform === platform) {
@@ -164,7 +164,7 @@ const SocialLinks = ({
                       values={{
                         network: platformDisplayInfo[platform].name,
                       }}
-                      description="{network} is the name of a social network such as Facebook or Twitter"
+                      description="{network} is the name of a social network such as Facebook or X"
                     />
                   </EmptyContent>
                 </div>