feat: Change Twitter to X (#1186)

Author: Lunyachek

package-lock.json

@@ -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/ProfilePage.test.jsx

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

src/profile/__mocks__/savingEditedBio.mockStore.js

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

src/profile/__mocks__/viewOtherProfile.mockStore.js

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

src/profile/__mocks__/viewOwnProfile.mockStore.js

@@ -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
@@ -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
@@ -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

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

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

src/profile/data/constants.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/reducers.test.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/data/selectors.js

@@ -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: {
-    icon: faTwitter,
-    name: 'X',
+  x: {
+    icon: faXTwitter,
+    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>