[Bug Bash] Fixes I (#5826)

* Enable Clear Date Input (#5809)

* Validate Non Valid Input Characters (#5810)

* ci:deploying

* fix: issue #5807 (#5811)

* fix: issue #5802 (#5812)

* fix: issue #5796 (#5813)

* fix: #5798 (#5814)

* fix:5798-2

* fix: test

* fix: issue #5800 (#5816)

* fix: issue #5786 (#5815)

* fix: issue #5802 (#5823)

* deploying ca-branch

* revert ci

Co-authored-by: M Fikri A <81801960+fikzzzy@users.noreply.github.com>
Co-authored-by: yoution <yoution@users.noreply.github.com>
Co-authored-by: Shivam Kumar Singh <shivamhere247@gmail.com>

Author: 4 people

.circleci/config.yml

@@ -342,7 +342,7 @@ workflows:
           filters:
             branches:
               only:
-                - free
+                - develop
       # This is alternate dev env for parallel testing
       - "build-test":
           context : org-global      

__tests__/shared/components/Settings/Account/__snapshots__/index.jsx.snap

@@ -10,12 +10,6 @@ exports[`renders account setting page correctly 1`] = `
     <SideBar
       icons={
         Object {
-          "linked accounts": <LinkedAccountIcon
-            height="30"
-            viewBox="0 0 30 30"
-            width="30"
-            xmlns="http://www.w3.org/2000/svg"
-          />,
           "my account": <MyAccountIcon
             height="30"
             viewBox="0 0 30 30"
@@ -27,7 +21,6 @@ exports[`renders account setting page correctly 1`] = `
       names={
         Array [
           "my account",
-          "linked account",
         ]
       }
     />

__tests__/shared/components/Settings/Account/index.jsx

@@ -12,7 +12,7 @@ const settingsUI = {
   TABS: {
     ACCOUNT: {
       MYACCOUNT: 'my account',
-      LINKEDACCOUNT: 'linked account',
+      // LINKEDACCOUNT: 'linked account',
     },
   },
 };

src/shared/components/Settings/Account/LinkedAccount/AddWebLink.jsx

@@ -13,6 +13,7 @@ export default class AddWebLink extends React.Component {
     super(props);
     this.state = {
       webLink: '',
+      webLinkEmpty: false,
     };
 
     this.onUpdateWebLink = this.onUpdateWebLink.bind(this);
@@ -32,6 +33,11 @@ export default class AddWebLink extends React.Component {
   // Set web link
   onUpdateWebLink(e) {
     e.preventDefault();
+    if (e.target.value) {
+      this.setState({
+        webLinkEmpty: false,
+      });
+    }
     this.setState({ webLink: e.target.value });
   }
 
@@ -62,6 +68,11 @@ export default class AddWebLink extends React.Component {
       tokenV3,
     } = this.props;
     const { webLink } = this.state;
+    if (!webLink) {
+      this.setState({
+        webLinkEmpty: true,
+      });
+    }
     if (webLink && this.isWebLinkValid() && !this.webLinkExist()) {
       addWebLink(handle, tokenV3, webLink);
     }
@@ -82,7 +93,7 @@ export default class AddWebLink extends React.Component {
   }
 
   render() {
-    const { webLink } = this.state;
+    const { webLink, webLinkEmpty } = this.state;
 
     const webLinkValid = this.isWebLinkValid();
     const webLinkExist = this.webLinkExist();
@@ -172,6 +183,15 @@ export default class AddWebLink extends React.Component {
                 onKeyDown={this.onAddWebLink}
                 required
               />
+              {
+                webLinkEmpty && (
+                <div styleName="form-input-error">
+                  <p>
+                    Please Enter External Link
+                  </p>
+                </div>
+                )
+              }
               {
                 !webLinkValid && !webLinkExist
                 && (

src/shared/components/Settings/Account/LinkedAccount/index.jsx

@@ -105,11 +105,13 @@ export default class LinkedAccount extends React.Component {
     if (!linkedAccounts.length) {
       const providers = _.omit(externalAccountsData, ['userId', 'updatedAt', 'createdAt', 'createdBy', 'updatedBy']);
 
-      _.forEach(_.keys(providers), (p) => {
-        if (providers[p]) {
-          linkedAccounts.push({ providerType: p });
-        }
-      });
+      if (_.keys(_.omitBy(providers, _.isNil)).length > 1) {
+        _.forEach(_.keys(providers), (p) => {
+          if (providers[p]) {
+            linkedAccounts.push({ providerType: p });
+          }
+        });
+      }
     }
     _.forEach(linkedAccounts, (linkedAccount) => {
       const providerType = linkedAccount.providerType || linkedAccount.provider;

src/shared/components/Settings/Account/index.jsx

@@ -8,12 +8,12 @@ import _ from 'lodash';
 
 import Accordion from 'components/Settings/Accordion';
 import MyAccountIcon from 'assets/images/account/sideicons/myaccount.svg';
-import LinkedAccountIcon from 'assets/images/account/sideicons/linkedaccount.svg';
+// import LinkedAccountIcon from 'assets/images/account/sideicons/linkedaccount.svg';
 import ErrorWrapper from 'components/Settings/ErrorWrapper';
 import SideBar from '../SideBar';
 import ComingSoon from '../ComingSoon';
 import MyAccount from './MyAccount';
-import LinkedAccount from './LinkedAccount';
+// import LinkedAccount from './LinkedAccount';
 import { SCREEN_SIZE } from '../constants';
 import './styles.scss';
 
@@ -74,14 +74,14 @@ export default class Account extends React.Component {
     const currentTab = this.tablink || settingsUI.currentAccountTab;
     const icons = {
       'my account': <MyAccountIcon />,
-      'linked accounts': <LinkedAccountIcon />,
+      // 'linked accounts': <LinkedAccountIcon />,
     };
     const renderTabContent = (tab) => {
       switch (tab) {
         case 'my account':
           return <MyAccount {...this.props} />;
-        case 'linked accounts':
-          return <LinkedAccount {...this.props} />;
+        // case 'linked accounts':
+        //   return <LinkedAccount {...this.props} />;
         default:
           return <ComingSoon />;
       }

src/shared/components/Settings/Profile/BasicInfo/index.jsx

@@ -255,6 +255,10 @@ export default class BasicInfo extends ConsentComponent {
       case 'streetAddr2':
         newBasicInfo.addresses[0][e.target.name] = e.target.value;
         break;
+      case 'firstName':
+      case 'lastName':
+        newBasicInfo[e.target.name] = e.target.value.replace(/[^a-zA-Z0-9,.]/g, '');
+        break;
       default:
         newBasicInfo[e.target.name] = e.target.value;
     }

src/shared/components/Settings/Profile/Education/index.jsx

@@ -181,12 +181,10 @@ export default class Education extends ConsentComponent {
   }
 
   onUpdateDate(date, timePeriod) {
-    if (date) {
-      const { newEducation: oldEducation } = this.state;
-      const newEducation = { ...oldEducation };
-      newEducation[timePeriod] = date;
-      this.setState({ newEducation, isSubmit: false });
-    }
+    const { newEducation: oldEducation } = this.state;
+    const newEducation = { ...oldEducation };
+    newEducation[timePeriod] = date || '';
+    this.setState({ newEducation, isSubmit: false });
   }
 
   /**
@@ -530,6 +528,7 @@ export default class Education extends ConsentComponent {
                 <div styleName="field col-2">
                   <DatePicker
                     readOnly
+                    showClearDate
                     numberOfMonths={1}
                     isOutsideRange={moment().subtract(1, 'd')}
                     date={newEducation.timePeriodFrom}
@@ -559,6 +558,7 @@ export default class Education extends ConsentComponent {
                     newEducation.graduated ? (
                       <DatePicker
                         readOnly
+                        showClearDate
                         numberOfMonths={1}
                         isOutsideRange={moment().subtract(1, 'd')}
                         date={newEducation.timePeriodTo}
@@ -569,6 +569,7 @@ export default class Education extends ConsentComponent {
                     ) : (
                       <DatePicker
                         readOnly
+                        showClearDate
                         numberOfMonths={1}
                         date={newEducation.timePeriodTo}
                         id="date-to1"

src/shared/components/Settings/Profile/Education/styles.scss

@@ -13,6 +13,20 @@ $checkbox-bg-selected: $tc-dark-blue;
   flex-direction: column;
   align-items: left;
 
+  :global {
+    .SingleDatePickerInput {
+      &__showClearDate {
+        padding-right: 0;
+      }
+
+      &_clearDate {
+        padding: 8px 10px;
+        top: 20px;
+        background: transparent;
+      }
+    }
+  }
+
   @include upto-sm {
     padding-bottom: 0;
   }

src/shared/components/Settings/Profile/Hobby/index.jsx

@@ -137,6 +137,7 @@ export default class Hobby extends ConsentComponent {
     }
     this.setState({
       showConfirmation: false,
+      isEdit: false,
       indexNo: null,
       isSubmit: false,
     });

src/shared/components/Settings/Profile/Work/index.jsx

@@ -81,15 +81,6 @@ export default class Work extends ConsentComponent {
       endDateInvalid: false,
       endDateDisabled: false,
       endDateInvalidMsg: '',
-      newWork: {
-        company: '',
-        position: '',
-        cityTown: '',
-        timePeriodFrom: '',
-        timePeriodTo: '',
-        industry: '',
-        working: false,
-      },
     });
   }
 

src/shared/components/Settings/Tools/Devices/index.jsx

@@ -84,46 +84,43 @@ export default class Devices extends ConsentComponent {
    */
   onHandleAddDevice(e) {
     e.preventDefault();
-    const { newDevice, deviceTrait, isEdit } = this.state;
+    const { newDevice, deviceTrait } = this.state;
     const { clearDeviceState } = this.props;
     this.setState({ isSubmit: true });
     if (this.onCheckFormValue(newDevice)) {
       return;
     }
-    if (!isEdit) {
-      const deviceItems = deviceTrait.traits
-        ? deviceTrait.traits.data.slice() : [];
-      let exist = false;
-      // eslint-disable-next-line no-restricted-syntax
-      for (const item of deviceItems) {
-        if (item.deviceType === newDevice.deviceType
-          && item.manufacturer === newDevice.manufacturer
-          && item.model === newDevice.model
-          && item.operatingSystem === newDevice.operatingSystem) {
-          exist = true;
-          break;
-        }
-      }
-      if (exist === true) {
-        const empty = {
-          deviceType: '',
-          manufacturer: '',
-          model: '',
-          operatingSystem: '',
-        };
-        this.setState({
-          newDevice: empty,
-          isEdit: false,
-          indexNo: null,
-          isSubmit: false,
-        });
-        clearDeviceState();
-        setImmediate(() => {
-          toastr.error('Looks like you\'ve already entered this device.');
-        });
-        return;
+    const deviceItems = deviceTrait.traits
+      ? deviceTrait.traits.data.slice() : [];
+    let exist = false;
+    // eslint-disable-next-line no-restricted-syntax
+    for (const item of deviceItems) {
+      if (item.deviceType === newDevice.deviceType
+        && item.manufacturer === newDevice.manufacturer
+        && item.model === newDevice.model) {
+        exist = true;
+        break;
       }
     }
+    if (exist === true) {
+      const empty = {
+        deviceType: '',
+        manufacturer: '',
+        model: '',
+        operatingSystem: '',
+      };
+      this.setState({
+        newDevice: empty,
+        isEdit: false,
+        indexNo: null,
+        isSubmit: false,
+      });
+      clearDeviceState();
+      setImmediate(() => {
+        toastr.error('Looks like you\'ve already entered this device.');
+      });
+      return;
+    }
     this.showConsent(this.onAddDevice.bind(this));
   }
 

src/shared/reducers/page/ui/settings.js

@@ -25,7 +25,7 @@ const TABS = {
   },
   ACCOUNT: {
     MYACCOUNT: 'my account',
-    LINKEDACCOUNT: 'linked accounts',
+    // LINKEDACCOUNT: 'linked accounts',
   },
 };