Merge pull request #863 from DmytroAlipov/feat-unlink-social-media-account-palm

feat: add toggling for the hardcode support link
fix: trim long text in links in the social networks block (#915 )
2023-10-25 19:14:14 +03:00 · 2023-10-25 15:05:23 +05:00 · 2023-10-20 00:27:29 +05:00 · 2023-09-01 14:14:56 +03:00 · 2023-05-02 17:16:27 -03:00
12 changed files with 151 additions and 26 deletions
--- a/.env
+++ b/.env
@@ -31,3 +31,4 @@ MARKETING_EMAILS_OPT_IN=''
 APP_ID=
 MFE_CONFIG_API_URL=
 PASSWORD_RESET_SUPPORT_LINK=''
+SUPPORT_URL_TO_UNLINK_SOCIAL_MEDIA_ACCOUNT='https://support.edx.org/hc/en-us/articles/207206067'
--- a/.env.development
+++ b/.env.development
@@ -32,4 +32,4 @@ MARKETING_EMAILS_OPT_IN=''
 APP_ID=
 MFE_CONFIG_API_URL=
 PASSWORD_RESET_SUPPORT_LINK='mailto:support@example.com'
-
+SUPPORT_URL_TO_UNLINK_SOCIAL_MEDIA_ACCOUNT='https://support.edx.org/hc/en-us/articles/207206067'
--- a/.env.test
+++ b/.env.test
@@ -30,3 +30,4 @@ ENABLE_DOB_UPDATE=''
 MARKETING_EMAILS_OPT_IN=''
 APP_ID=
 MFE_CONFIG_API_URL=
+SUPPORT_URL_TO_UNLINK_SOCIAL_MEDIA_ACCOUNT='https://support.edx.org/hc/en-us/articles/207206067'
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,9 +10,9 @@
      "license": "AGPL-3.0",
      "dependencies": {
        "@edx/brand": "npm:@edx/brand-openedx@1.2.0",
-        "@edx/frontend-component-footer": "11.7.1",
-        "@edx/frontend-component-header": "3.7.2",
-        "@edx/frontend-platform": "4.0.2",
+        "@edx/frontend-component-footer": "12.0.0",
+        "@edx/frontend-component-header": "4.0.0",
+        "@edx/frontend-platform": "4.2.0",
        "@edx/paragon": "20.28.5",
        "@fortawesome/fontawesome-svg-core": "1.2.36",
        "@fortawesome/free-brands-svg-icons": "5.15.4",
@@ -1989,10 +1989,10 @@
      }
    },
    "node_modules/@edx/frontend-component-footer": {
-      "version": "11.7.1",
-      "license": "AGPL-3.0",
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-component-footer/-/frontend-component-footer-12.0.0.tgz",
+      "integrity": "sha512-m8Rx6ZPWzIN5XLrz6Ft3aTuFo0rty0jECd79CBYWdm0D9KD1WxoYEG+fElluyOQp/t42T5jLImHTSWjFURx5kw==",
      "dependencies": {
-        "@edx/frontend-platform": "^4.0.1",
        "@fortawesome/fontawesome-svg-core": "6.4.0",
        "@fortawesome/free-brands-svg-icons": "6.4.0",
        "@fortawesome/free-regular-svg-icons": "6.4.0",
@@ -2000,9 +2000,10 @@
        "@fortawesome/react-fontawesome": "0.2.0"
      },
      "peerDependencies": {
+        "@edx/frontend-platform": "^4.0.0",
        "prop-types": "^15.5.10",
-        "react": "^16.9.0",
-        "react-dom": "^16.9.0"
+        "react": "^16.9.0 || ^17.0.0",
+        "react-dom": "^16.9.0 || ^17.0.0"
      }
    },
    "node_modules/@edx/frontend-component-footer/node_modules/@fortawesome/fontawesome-common-types": {
@@ -2058,11 +2059,10 @@
      }
    },
    "node_modules/@edx/frontend-component-header": {
-      "version": "3.7.2",
-      "resolved": "https://registry.npmjs.org/@edx/frontend-component-header/-/frontend-component-header-3.7.2.tgz",
-      "integrity": "sha512-tUGatyYfFB5bKg+iqbFfvRNtvLM54A7WlRKWQ4dY3iIjcMDCD99CcdfqGup3gbIMIBehS14o0skDs2J8R3OElw==",
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-component-header/-/frontend-component-header-4.0.0.tgz",
+      "integrity": "sha512-r/L3p2ZSI1DitjxVKAor18GmgJllafYslrdpzGI0vcX/gTemH13jf2Xr9iQqrT921DP2nzZ5GOwGJNptTSjiaA==",
      "dependencies": {
-        "@edx/frontend-platform": "^4.0.1",
        "@edx/paragon": "20.30.1",
        "@fortawesome/fontawesome-svg-core": "6.3.0",
        "@fortawesome/free-brands-svg-icons": "6.3.0",
@@ -2074,6 +2074,7 @@
        "react-transition-group": "4.4.5"
      },
      "peerDependencies": {
+        "@edx/frontend-platform": "^4.0.0",
        "prop-types": "^15.5.10",
        "react": "^16.9.0 || ^17.0.0",
        "react-dom": "^16.9.0 || ^17.0.0"
@@ -2223,8 +2224,9 @@
      }
    },
    "node_modules/@edx/frontend-platform": {
-      "version": "4.0.2",
-      "license": "AGPL-3.0",
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/@edx/frontend-platform/-/frontend-platform-4.2.0.tgz",
+      "integrity": "sha512-iDoFeccENQKBjqUgdjl5KSwBrjNEj8YW6Ual+6twcHHJUBg3yRoBEphwHIoRREcMgQjhdKVAdWj8eleh4JsEKA==",
      "dependencies": {
        "@cospired/i18n-iso-languages": "2.2.0",
        "@formatjs/intl-pluralrules": "4.3.3",
@@ -2247,13 +2249,14 @@
        "universal-cookie": "4.0.4"
      },
      "bin": {
+        "intl-imports.js": "i18n/scripts/intl-imports.js",
        "transifex-utils.js": "i18n/scripts/transifex-utils.js"
      },
      "peerDependencies": {
        "@edx/paragon": ">= 10.0.0 < 21.0.0",
        "prop-types": "^15.7.2",
-        "react": "^16.9.0",
-        "react-dom": "^16.9.0",
+        "react": "^16.9.0 || ^17.0.0",
+        "react-dom": "^16.9.0 || ^17.0.0",
        "react-redux": "^7.1.1",
        "react-router-dom": "^5.0.1",
        "redux": "^4.0.4"
--- a/package.json
+++ b/package.json
@@ -28,9 +28,9 @@
  ],
  "dependencies": {
    "@edx/brand": "npm:@edx/brand-openedx@1.2.0",
-    "@edx/frontend-component-footer": "11.7.1",
-    "@edx/frontend-component-header": "3.7.2",
-    "@edx/frontend-platform": "4.0.2",
+    "@edx/frontend-component-footer": "12.0.0",
+    "@edx/frontend-component-header": "4.0.0",
+    "@edx/frontend-platform": "4.2.0",
    "@edx/paragon": "20.28.5",
    "@fortawesome/fontawesome-svg-core": "1.2.36",
    "@fortawesome/free-brands-svg-icons": "5.15.4",
--- a/src/account-settings/AccountSettingsPage.messages.jsx
+++ b/src/account-settings/AccountSettingsPage.messages.jsx
@@ -411,8 +411,8 @@ const messages = defineMessages({
    defaultMessage: 'No formal education',
    description: 'Selected by the user to describe their education.',
  },
-  'account.settings.field.education.levels.o': {
-    id: 'account.settings.field.education.levels.o',
+  'account.settings.field.education.levels.other': {
+    id: 'account.settings.field.education.levels.other',
    defaultMessage: 'Other education',
    description: 'Selected by the user if they have a type of education not described by the other choices.',
  },
--- a/src/account-settings/EditableField.jsx
+++ b/src/account-settings/EditableField.jsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
+import classNames from 'classnames';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
 import {
  Button, Form, StatefulButton,
@@ -155,7 +156,7 @@ const EditableField = (props) => {
                </Button>
              ) : null}
            </div>
-            <p data-hj-suppress className={isGrayedOut ? 'grayed-out' : null}>{renderValue(value)}</p>
+            <p data-hj-suppress className={classNames('text-truncate', { 'grayed-out': isGrayedOut })}>{renderValue(value)}</p>
            <p className="small text-muted mt-n2">{renderConfirmationMessage() || helpText}</p>
          </div>
        ),
--- a/src/account-settings/data/constants.js
+++ b/src/account-settings/data/constants.js
@@ -25,7 +25,7 @@ export const EDUCATION_LEVELS = [
  'jhs',
  'el',
  'none',
-  'o',
+  'other',
 ];

 export const GENDER_OPTIONS = [
--- a/src/account-settings/delete-account/BeforeProceedingBanner.jsx
+++ b/src/account-settings/delete-account/BeforeProceedingBanner.jsx
@@ -25,10 +25,12 @@ const BeforeProceedingBanner = (props) => {
        defaultMessage="Before proceeding, please {actionLink}."
        description="Error that appears if you are trying to delete your account, but something about your account needs attention first.  The actionLink will be instructions, such as 'unlink your Facebook account'."
        values={{
-          actionLink: (
+          actionLink: supportArticleUrl ? (
            <Hyperlink destination={supportArticleUrl}>
              {intl.formatMessage(messages[instructionMessageId])}
            </Hyperlink>
+          ) : (
+            intl.formatMessage(messages[instructionMessageId])
          ),
          siteName: getConfig().SITE_NAME,
        }}
--- a/src/account-settings/delete-account/BeforeProceedingBanner.test.jsx
+++ b/src/account-settings/delete-account/BeforeProceedingBanner.test.jsx
@@ -0,0 +1,48 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import renderer from 'react-test-renderer';
+import { IntlProvider, injectIntl, createIntl } from '@edx/frontend-platform/i18n';
+
+ReactDOM.createPortal = node => node;
+
+import BeforeProceedingBanner from './BeforeProceedingBanner'; // eslint-disable-line import/first
+
+const IntlBeforeProceedingBanner = injectIntl(BeforeProceedingBanner);
+
+describe('BeforeProceedingBanner', () => {
+  it('should match the snapshot if SUPPORT_URL_TO_UNLINK_SOCIAL_MEDIA_ACCOUNT does not have a support link', () => {
+    const props = {
+      instructionMessageId: 'account.settings.delete.account.please.unlink',
+      intl: createIntl({ locale: 'en' }),
+      supportArticleUrl: '',
+    };
+    const tree = renderer
+      .create((
+        <IntlProvider locale="en">
+          <IntlBeforeProceedingBanner
+            {...props}
+          />
+        </IntlProvider>
+      ))
+      .toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  it('should match the snapshot when SUPPORT_URL_TO_UNLINK_SOCIAL_MEDIA_ACCOUNT has a support link', () => {
+    const props = {
+      instructionMessageId: 'account.settings.delete.account.please.unlink',
+      intl: createIntl({ locale: 'en' }),
+      supportArticleUrl: 'http://test-support.edx',
+    };
+    const tree = renderer
+      .create((
+        <IntlProvider locale="en">
+          <IntlBeforeProceedingBanner
+            {...props}
+          />
+        </IntlProvider>
+      ))
+      .toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});
--- a/src/account-settings/delete-account/DeleteAccount.jsx
+++ b/src/account-settings/delete-account/DeleteAccount.jsx
@@ -59,6 +59,7 @@ export class DeleteAccount extends React.Component {
      hasLinkedTPA, isVerifiedAccount, status, errorType, intl,
    } = this.props;
    const canDelete = isVerifiedAccount && !hasLinkedTPA;
+    const supportArticleUrl = process.env.SUPPORT_URL_TO_UNLINK_SOCIAL_MEDIA_ACCOUNT;

    // TODO: We lack a good way of providing custom language for a particular site.  This is a hack
    // to allow edx.org to fulfill its business requirements.
@@ -122,7 +123,7 @@ export class DeleteAccount extends React.Component {
        {hasLinkedTPA ? (
          <BeforeProceedingBanner
            instructionMessageId="account.settings.delete.account.please.unlink"
-            supportArticleUrl="https://support.edx.org/hc/en-us/articles/207206067"
+            supportArticleUrl={supportArticleUrl}
          />
        ) : null}

--- a/src/account-settings/delete-account/snapshots/BeforeProceedingBanner.test.jsx.snap
+++ b/src/account-settings/delete-account/snapshots/BeforeProceedingBanner.test.jsx.snap
@@ -0,0 +1,68 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`BeforeProceedingBanner should match the snapshot if SUPPORT_URL_TO_UNLINK_SOCIAL_MEDIA_ACCOUNT does not have a support link 1`] = `
+<div
+  className="alert d-flex align-items-start alert-warning mt-n2"
+>
+  <div>
+    <svg
+      aria-hidden="true"
+      className="svg-inline--fa fa-exclamation-triangle fa-w-18 mr-2"
+      data-icon="exclamation-triangle"
+      data-prefix="fas"
+      focusable="false"
+      role="img"
+      style={Object {}}
+      viewBox="0 0 576 512"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937 0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154 0l239.94 416.028zM288 354c-25.405 0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346l7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373 0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884 0-12.356 5.78-11.981 12.654z"
+        fill="currentColor"
+        style={Object {}}
+      />
+    </svg>
+  </div>
+  <div>
+    Before proceeding, please unlink all social media accounts.
+  </div>
+</div>
+`;
+
+exports[`BeforeProceedingBanner should match the snapshot when SUPPORT_URL_TO_UNLINK_SOCIAL_MEDIA_ACCOUNT has a support link 1`] = `
+<div
+  className="alert d-flex align-items-start alert-warning mt-n2"
+>
+  <div>
+    <svg
+      aria-hidden="true"
+      className="svg-inline--fa fa-exclamation-triangle fa-w-18 mr-2"
+      data-icon="exclamation-triangle"
+      data-prefix="fas"
+      focusable="false"
+      role="img"
+      style={Object {}}
+      viewBox="0 0 576 512"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937 0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154 0l239.94 416.028zM288 354c-25.405 0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346l7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373 0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884 0-12.356 5.78-11.981 12.654z"
+        fill="currentColor"
+        style={Object {}}
+      />
+    </svg>
+  </div>
+  <div>
+    Before proceeding, please 
+    <a
+      className="pgn__hyperlink default-link standalone-link"
+      href="http://test-support.edx"
+      onClick={[Function]}
+      target="_self"
+    >
+      unlink all social media accounts
+    </a>
+    .
+  </div>
+</div>
+`;
Author	SHA1	Message	Date
Max Sokolski	92fd5fdc65	Merge pull request #863 from DmytroAlipov/feat-unlink-social-media-account-palm feat: add toggling for the hardcode support link	2023-10-25 19:14:14 +03:00
Ihor Romaniuk	cba396cf3d	fix: trim long text in links in the social networks block (#915 )	2023-10-25 15:05:23 +05:00
Taras Lytvynenko	9e338d062c	fix: error when trying to save 'other education' (#881 )	2023-10-20 00:27:29 +05:00
alipov_d	7ea26d5ffc	feat: add toggling for the hardcode support link Add a toggling mechanism for the "unlink all social media accounts" text to show it as a link or text depending on the MFE env setting.	2023-09-01 14:14:56 +03:00
Sagirov Eugeniy	03e3b674f6	chore: update frontend-platform version to v4.2.0	2023-05-02 17:16:27 -03:00