From 08e264a649509c4304882436700042d03ea0776e Mon Sep 17 00:00:00 2001 From: amina-deriv Date: Fri, 16 Jun 2023 13:27:42 +0400 Subject: [PATCH 1/9] fix: notifications_in_cashier_and_accounts --- packages/account/src/App.tsx | 3 +++ .../Sections/Profile/PersonalDetails/personal-details.jsx | 6 +----- .../TwoFactorAuthentication/two-factor-authentication.jsx | 6 +----- .../app/_common/components/app-notification-message.scss | 1 + 4 files changed, 6 insertions(+), 10 deletions(-) diff --git a/packages/account/src/App.tsx b/packages/account/src/App.tsx index 0a666cb80bf1..c89d307630a7 100644 --- a/packages/account/src/App.tsx +++ b/packages/account/src/App.tsx @@ -17,8 +17,11 @@ const App = ({ passthrough }: TAppProps) => { const { root_store, WS } = passthrough; initStore(root_store, WS); + const { notification_messages_ui: Notifications } = root_store.ui; + return ( + {Notifications && } diff --git a/packages/account/src/Sections/Profile/PersonalDetails/personal-details.jsx b/packages/account/src/Sections/Profile/PersonalDetails/personal-details.jsx index b7b352190d0a..8396c4079cea 100644 --- a/packages/account/src/Sections/Profile/PersonalDetails/personal-details.jsx +++ b/packages/account/src/Sections/Profile/PersonalDetails/personal-details.jsx @@ -109,7 +109,6 @@ export const PersonalDetailsForm = ({ refreshNotifications, showPOAAddressMismatchSuccessNotification, showPOAAddressMismatchFailureNotification, - Notifications, fetchResidenceList, fetchStatesList, has_residence, @@ -555,7 +554,6 @@ export const PersonalDetailsForm = ({ dirty, }) => ( - {Notifications && } {show_form && (
({ +export default connect(({ client, notifications, common }) => ({ account_settings: client.account_settings, authentication_status: client.authentication_status, has_residence: client.has_residence, @@ -1319,7 +1316,6 @@ export default connect(({ client, notifications, ui, common }) => ({ refreshNotifications: notifications.refreshNotifications, showPOAAddressMismatchSuccessNotification: notifications.showPOAAddressMismatchSuccessNotification, showPOAAddressMismatchFailureNotification: notifications.showPOAAddressMismatchFailureNotification, - Notifications: ui.notification_messages_ui, updateAccountStatus: client.updateAccountStatus, has_poa_address_mismatch: client.account_status.status?.includes('poa_address_mismatch'), is_language_changing: common.is_language_changing, diff --git a/packages/account/src/Sections/Security/TwoFactorAuthentication/two-factor-authentication.jsx b/packages/account/src/Sections/Security/TwoFactorAuthentication/two-factor-authentication.jsx index c18230f8aec6..85988dc56532 100644 --- a/packages/account/src/Sections/Security/TwoFactorAuthentication/two-factor-authentication.jsx +++ b/packages/account/src/Sections/Security/TwoFactorAuthentication/two-factor-authentication.jsx @@ -25,7 +25,6 @@ const TwoFactorAuthentication = ({ setTwoFAStatus, getTwoFAStatus, has_enabled_two_fa, - Notifications, setTwoFAChangedStatus, }) => { const [is_loading, setLoading] = React.useState(true); @@ -200,7 +199,6 @@ const TwoFactorAuthentication = ({ 'two-factor__wrapper-dashboard': is_appstore, })} > - {Notifications && } {has_enabled_two_fa ? TwoFactorEnabled : TwoFactorDisabled} @@ -213,16 +211,14 @@ TwoFactorAuthentication.propTypes = { setTwoFAStatus: PropTypes.func, getTwoFAStatus: PropTypes.func, has_enabled_two_fa: PropTypes.bool, - Notifications: PropTypes.node, setTwoFAChangedStatus: PropTypes.func, }; -export default connect(({ client, ui }) => ({ +export default connect(({ client }) => ({ email_address: client.email_address, is_switching: client.is_switching, setTwoFAStatus: client.setTwoFAStatus, getTwoFAStatus: client.getTwoFAStatus, has_enabled_two_fa: client.has_enabled_two_fa, - Notifications: ui.notification_messages_ui, setTwoFAChangedStatus: client.setTwoFAChangedStatus, }))(TwoFactorAuthentication); diff --git a/packages/core/src/sass/app/_common/components/app-notification-message.scss b/packages/core/src/sass/app/_common/components/app-notification-message.scss index 83254c5c4318..ceca615a6630 100644 --- a/packages/core/src/sass/app/_common/components/app-notification-message.scss +++ b/packages/core/src/sass/app/_common/components/app-notification-message.scss @@ -4,6 +4,7 @@ z-index: 6; position: absolute; right: 0; + margin-top: 1.6rem; > div { display: flex; From 9874cbf1f8ad785278f0c996e90daa181a0e5b93 Mon Sep 17 00:00:00 2001 From: amina-deriv Date: Tue, 20 Jun 2023 10:39:22 +0400 Subject: [PATCH 2/9] fix: notification for maintenance --- .../Containers/app-notification-messages.jsx | 21 +++++++++++++--- .../Stores/Helpers/client-notifications.js | 11 +++++++- packages/core/src/Stores/client-store.js | 13 ---------- .../core/src/Stores/notification-store.js | 25 ++++++++++++++++--- 4 files changed, 49 insertions(+), 21 deletions(-) diff --git a/packages/core/src/App/Containers/app-notification-messages.jsx b/packages/core/src/App/Containers/app-notification-messages.jsx index a9e8fc5a03dc..4ace77632262 100644 --- a/packages/core/src/App/Containers/app-notification-messages.jsx +++ b/packages/core/src/App/Containers/app-notification-messages.jsx @@ -11,7 +11,11 @@ import Notification, { max_display_notifications_mobile, } from '../Components/Elements/NotificationMessage'; import { useLocation } from 'react-router-dom'; -import { excluded_notifications, priority_toast_messages } from '../../Stores/Helpers/client-notifications'; +import { + excluded_notifications, + priority_toast_messages, + maintenance_notifications, +} from '../../Stores/Helpers/client-notifications'; const Portal = ({ children }) => isMobile() ? ReactDOM.createPortal(children, document.getElementById('deriv_app')) : children; @@ -107,6 +111,8 @@ const AppNotificationMessages = ({ const is_not_marked_notification = !marked_notifications.includes(message.key); const is_non_hidden_notification = isMobile() ? [ + 'system_maintenance', + 'site_maintenance', 'authenticate', 'deriv_go', 'document_needs_action', @@ -145,7 +151,14 @@ const AppNotificationMessages = ({ const is_only_for_p2p_notification = window.location.pathname !== routes.cashier_p2p || message?.platform === 'P2P'; - return is_not_marked_notification && is_non_hidden_notification && is_only_for_p2p_notification; + + const is_maintenance_notifications = maintenance_notifications.includes(message.key); + + return ( + is_not_marked_notification && + is_non_hidden_notification && + (is_only_for_p2p_notification || is_maintenance_notifications) + ); }); const notifications_limit = isMobile() ? max_display_notifications_mobile : max_display_notifications; @@ -159,7 +172,9 @@ const AppNotificationMessages = ({ const notifications_sublist = window.location.pathname === routes.cashier_deposit - ? filtered_excluded_notifications.filter(message => message.key.includes('switched_to_real')) + ? filtered_excluded_notifications.filter( + message => message.key.includes('switched_to_real') || maintenance_notifications.includes(message.key) + ) : filtered_excluded_notifications.slice(0, notifications_limit); if (!should_show_popups) return null; diff --git a/packages/core/src/Stores/Helpers/client-notifications.js b/packages/core/src/Stores/Helpers/client-notifications.js index 16cf5ec70b34..3cfdd811db86 100644 --- a/packages/core/src/Stores/Helpers/client-notifications.js +++ b/packages/core/src/Stores/Helpers/client-notifications.js @@ -64,4 +64,13 @@ export const getCashierValidations = cashier_arr => { // Notifications keys will not be added to localStorage and will appear again after user logout/login export const excluded_notifications = ['contract_sold', 'switched_to_real', 'has_changed_two_fa']; -export const priority_toast_messages = ['svg', 'need_fa', 'p2p_daily_limit_increase', 'authenticate']; +export const priority_toast_messages = [ + 'system_maintenance', + 'site_maintenance', + 'svg', + 'need_fa', + 'p2p_daily_limit_increase', + 'authenticate', +]; + +export const maintenance_notifications = ['system_maintenance', 'site_maintenance']; diff --git a/packages/core/src/Stores/client-store.js b/packages/core/src/Stores/client-store.js index d52a1fd5a7a9..0aaee55d6d3c 100644 --- a/packages/core/src/Stores/client-store.js +++ b/packages/core/src/Stores/client-store.js @@ -1729,19 +1729,6 @@ export default class ClientStore extends BaseStore { responseWebsiteStatus(response) { this.website_status = response.website_status; - if (this.website_status.message && this.website_status.message.length) { - this.root_store.notifications.addNotificationMessage({ - key: 'maintenance', - header: localize('Site is being updated'), - message: localize(this.website_status.message), - type: 'warning', - is_persistent: true, - }); - } else { - this.root_store.notifications.removeNotificationMessage({ - key: 'maintenance', - }); - } } responseLandingCompany(response) { diff --git a/packages/core/src/Stores/notification-store.js b/packages/core/src/Stores/notification-store.js index 3d26e79fc3af..877d5e8f4917 100644 --- a/packages/core/src/Stores/notification-store.js +++ b/packages/core/src/Stores/notification-store.js @@ -27,6 +27,7 @@ import { getCashierValidations, getStatusValidations, hasMissingRequiredField, + maintenance_notifications, } from './Helpers/client-notifications'; import { sortNotifications, sortNotificationsMobile } from '../App/Components/Elements/NotificationMessage/constants'; import BaseStore from './base-store'; @@ -223,10 +224,10 @@ export default class NotificationStore extends BaseStore { filterNotificationMessages() { if (LocalStore.get('active_loginid') !== 'null') this.resetVirtualBalanceNotification(LocalStore.get('active_loginid')); - if (window.location.pathname === routes.personal_details) { this.notification_messages = this.notification_messages.filter( - notification => notification.platform === 'Account' + notification => + notification.platform === 'Account' || maintenance_notifications.includes(notification.key) ); } else if (window.location.pathname !== routes.cashier_p2p) { this.notification_messages = this.notification_messages.filter(notification => { @@ -315,6 +316,12 @@ export default class NotificationStore extends BaseStore { let has_missing_required_field; + if (website_status.message && website_status.message.length) { + this.addNotificationMessage(this.client_notifications.site_maintenance); + } else { + this.removeNotificationByKey({ key: this.client_notifications.site_maintenance }); + } + if (is_logged_in) { if (isEmptyObject(account_status)) return; const { @@ -1233,6 +1240,14 @@ export default class NotificationStore extends BaseStore { type: 'danger', }; }, + site_maintenance: { + key: 'site_maintenance', + header: localize('We’re updating our site'), + message: localize('Some services may be temporarily unavailable.'), + type: 'warning', + should_show_again: true, + closeOnClick: notification_obj => this.markNotificationMessage({ key: notification_obj.key }), + }, system_maintenance: (withdrawal_locked, deposit_locked) => { let message, header; if (isCryptocurrency(client_data.currency)) { @@ -1253,9 +1268,9 @@ export default class NotificationStore extends BaseStore { ); } } else { - header = localize('Scheduled cashier system maintenance'); + header = localize('Scheduled cashier maintenance'); message = localize( - 'Our cashier is temporarily down due to system maintenance. You can access the cashier in a few minutes when the maintenance is complete.' + 'The cashier is temporarily down due to maintenance. It will be available as soon as the maintenance is complete.' ); } return { @@ -1263,6 +1278,8 @@ export default class NotificationStore extends BaseStore { header, message, type: 'warning', + should_show_again: true, + closeOnClick: notification_obj => this.markNotificationMessage({ key: notification_obj.key }), }; }, tax: { From f60b2876072775a6a73f7a64b6db75387980a571 Mon Sep 17 00:00:00 2001 From: amina-deriv Date: Tue, 20 Jun 2023 16:20:36 +0400 Subject: [PATCH 3/9] fix: notification_filter --- .../core/src/App/Containers/app-notification-messages.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/core/src/App/Containers/app-notification-messages.jsx b/packages/core/src/App/Containers/app-notification-messages.jsx index 4ace77632262..eef3d1752781 100644 --- a/packages/core/src/App/Containers/app-notification-messages.jsx +++ b/packages/core/src/App/Containers/app-notification-messages.jsx @@ -172,8 +172,8 @@ const AppNotificationMessages = ({ const notifications_sublist = window.location.pathname === routes.cashier_deposit - ? filtered_excluded_notifications.filter( - message => message.key.includes('switched_to_real') || maintenance_notifications.includes(message.key) + ? filtered_excluded_notifications.filter(message => + ['switched_to_real', ...maintenance_notifications].includes(message.key) ) : filtered_excluded_notifications.slice(0, notifications_limit); From 4a07ecc590e402ce47b2e8a5947904ffe5a88d5a Mon Sep 17 00:00:00 2001 From: amina-deriv Date: Tue, 20 Jun 2023 16:24:54 +0400 Subject: [PATCH 4/9] fix: notification_filter --- packages/core/src/Stores/Helpers/client-notifications.js | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/packages/core/src/Stores/Helpers/client-notifications.js b/packages/core/src/Stores/Helpers/client-notifications.js index 3cfdd811db86..a76f3f9ee9c6 100644 --- a/packages/core/src/Stores/Helpers/client-notifications.js +++ b/packages/core/src/Stores/Helpers/client-notifications.js @@ -64,13 +64,12 @@ export const getCashierValidations = cashier_arr => { // Notifications keys will not be added to localStorage and will appear again after user logout/login export const excluded_notifications = ['contract_sold', 'switched_to_real', 'has_changed_two_fa']; +export const maintenance_notifications = ['system_maintenance', 'site_maintenance']; + export const priority_toast_messages = [ - 'system_maintenance', - 'site_maintenance', 'svg', 'need_fa', 'p2p_daily_limit_increase', 'authenticate', + ...maintenance_notifications, ]; - -export const maintenance_notifications = ['system_maintenance', 'site_maintenance']; From 29dab29a931b21b415fd86a533354c8af4ad20d4 Mon Sep 17 00:00:00 2001 From: amina-deriv Date: Tue, 20 Jun 2023 16:33:50 +0400 Subject: [PATCH 5/9] fix: filter notifications in mobile --- packages/core/src/App/Containers/app-notification-messages.jsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/core/src/App/Containers/app-notification-messages.jsx b/packages/core/src/App/Containers/app-notification-messages.jsx index eef3d1752781..09038a58cb21 100644 --- a/packages/core/src/App/Containers/app-notification-messages.jsx +++ b/packages/core/src/App/Containers/app-notification-messages.jsx @@ -111,8 +111,7 @@ const AppNotificationMessages = ({ const is_not_marked_notification = !marked_notifications.includes(message.key); const is_non_hidden_notification = isMobile() ? [ - 'system_maintenance', - 'site_maintenance', + ...maintenance_notifications, 'authenticate', 'deriv_go', 'document_needs_action', From aaeeaf23ccaed6a446f3f187fa248cfc80f3e811 Mon Sep 17 00:00:00 2001 From: amina-deriv Date: Tue, 20 Jun 2023 16:43:28 +0400 Subject: [PATCH 6/9] fix: code_review_suggestions --- packages/core/src/Stores/notification-store.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/core/src/Stores/notification-store.js b/packages/core/src/Stores/notification-store.js index 877d5e8f4917..4d9bb91cd083 100644 --- a/packages/core/src/Stores/notification-store.js +++ b/packages/core/src/Stores/notification-store.js @@ -316,7 +316,7 @@ export default class NotificationStore extends BaseStore { let has_missing_required_field; - if (website_status.message && website_status.message.length) { + if (website_status?.message?.length) { this.addNotificationMessage(this.client_notifications.site_maintenance); } else { this.removeNotificationByKey({ key: this.client_notifications.site_maintenance }); From 64c0961bc026effe0749c6c66b1faee17dd2a26f Mon Sep 17 00:00:00 2001 From: amina-deriv Date: Thu, 22 Jun 2023 13:49:38 +0400 Subject: [PATCH 7/9] chore: merge master From 921b7aef42e8d41e749c9e72b5fb9bc2d0a6d7c0 Mon Sep 17 00:00:00 2001 From: amina-deriv Date: Thu, 22 Jun 2023 13:51:28 +0400 Subject: [PATCH 8/9] chore: resolve conflict --- .../Form/Purchase/contract-info.jsx | 8 ++++++-- .../Duration/advanced-duration.jsx | 4 +++- .../TradeParams/Duration/duration-mobile.jsx | 20 +++++++------------ .../Components/Form/TradeParams/strike.jsx | 4 +++- .../Trading/Containers/strike-param-modal.jsx | 4 +++- 5 files changed, 22 insertions(+), 18 deletions(-) diff --git a/packages/trader/src/Modules/Trading/Components/Form/Purchase/contract-info.jsx b/packages/trader/src/Modules/Trading/Components/Form/Purchase/contract-info.jsx index 3b1007a9139d..b33394dea8b3 100644 --- a/packages/trader/src/Modules/Trading/Components/Form/Purchase/contract-info.jsx +++ b/packages/trader/src/Modules/Trading/Components/Form/Purchase/contract-info.jsx @@ -86,7 +86,9 @@ const ContractInfo = ({ const setHintMessage = () => { if (['VANILLALONGCALL', 'VANILLALONGPUT'].includes(type)) { return ( - + ); } return message; @@ -155,7 +157,9 @@ const ContractInfo = ({ id='dt_vanilla-stake__tooltip' zIndex={9999} message={ - + } /> diff --git a/packages/trader/src/Modules/Trading/Components/Form/TradeParams/Duration/advanced-duration.jsx b/packages/trader/src/Modules/Trading/Components/Form/TradeParams/Duration/advanced-duration.jsx index e9ab6b1d74a5..2d52cecf4291 100644 --- a/packages/trader/src/Modules/Trading/Components/Form/TradeParams/Duration/advanced-duration.jsx +++ b/packages/trader/src/Modules/Trading/Components/Form/TradeParams/Duration/advanced-duration.jsx @@ -128,7 +128,9 @@ const AdvancedDuration = observer( is_24_hours_contract && // validation_errors={validation_errors.end_time} TODO: add validation_errors for end time } - {!is_24_hours_contract && is_vanilla && } + {!is_24_hours_contract && is_vanilla && ( + + )} )} diff --git a/packages/trader/src/Modules/Trading/Components/Form/TradeParams/Duration/duration-mobile.jsx b/packages/trader/src/Modules/Trading/Components/Form/TradeParams/Duration/duration-mobile.jsx index 0851c2f92da4..c53ae8a02a1c 100644 --- a/packages/trader/src/Modules/Trading/Components/Form/TradeParams/Duration/duration-mobile.jsx +++ b/packages/trader/src/Modules/Trading/Components/Form/TradeParams/Duration/duration-mobile.jsx @@ -167,19 +167,15 @@ const Numbers = observer( }; const setExpiryDate = (epoch, duration) => { - let expiry_date = new Date((epoch - trade_duration * 24 * 60 * 60) * 1000); + let expiry_date = new Date((epoch - (trade_duration * 24 * 60 * 60)) * 1000); if (duration) { - expiry_date = new Date(expiry_date.getTime() + duration * 24 * 60 * 60 * 1000); + expiry_date = new Date(expiry_date.getTime() + (duration) * 24 * 60 * 60 * 1000); } - return expiry_date - .toUTCString() - .replace('GMT', 'GMT +0') - .substring(5) - .replace(/(\d{2}) (\w{3} \d{4})/, '$1 $2,'); - }; - + return expiry_date.toUTCString().replace('GMT', 'GMT +0').substring(5).replace(/(\d{2}) (\w{3} \d{4})/, '$1 $2,'); + } + const onNumberChange = num => { setSelectedDuration(duration_unit, num); validateDuration(num); @@ -189,11 +185,9 @@ const Numbers = observer(
{is_vanilla && ( - )} diff --git a/packages/trader/src/Modules/Trading/Components/Form/TradeParams/strike.jsx b/packages/trader/src/Modules/Trading/Components/Form/TradeParams/strike.jsx index e48ba76b826b..3190606654e9 100644 --- a/packages/trader/src/Modules/Trading/Components/Form/TradeParams/strike.jsx +++ b/packages/trader/src/Modules/Trading/Components/Form/TradeParams/strike.jsx @@ -79,7 +79,9 @@ const Strike = observer(() => { components={[]} values={{ trade_type: - vanilla_trade_type === 'VANILLALONGCALL' ? localize('Call') : localize('Put'), + vanilla_trade_type === 'VANILLALONGCALL' + ? localize('Call') + : localize('Put'), payout_status: vanilla_trade_type === 'VANILLALONGCALL' ? localize('above') : localize('below'), }} diff --git a/packages/trader/src/Modules/Trading/Containers/strike-param-modal.jsx b/packages/trader/src/Modules/Trading/Containers/strike-param-modal.jsx index 9ca4475caca2..435dc5a80bda 100644 --- a/packages/trader/src/Modules/Trading/Containers/strike-param-modal.jsx +++ b/packages/trader/src/Modules/Trading/Containers/strike-param-modal.jsx @@ -28,7 +28,9 @@ const StrikeParamModal = ({ is_open, toggleModal, strike, onChange, name, strike components={[]} values={{ trade_type: - vanilla_trade_type === 'VANILLALONGCALL' ? localize('Call') : localize('Put'), + vanilla_trade_type === 'VANILLALONGCALL' + ? localize('Call') + : localize('Put'), payout_status: vanilla_trade_type === 'VANILLALONGCALL' ? localize('above') : localize('below'), }} From bc76b832c63e4269125aee657709275f04644c31 Mon Sep 17 00:00:00 2001 From: amina-deriv Date: Fri, 23 Jun 2023 19:42:11 +0400 Subject: [PATCH 9/9] fix: showing notification in mobile --- packages/core/src/Stores/client-store.js | 1 + packages/core/src/Stores/notification-store.js | 7 +++++-- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/packages/core/src/Stores/client-store.js b/packages/core/src/Stores/client-store.js index 0aaee55d6d3c..97302847f2dc 100644 --- a/packages/core/src/Stores/client-store.js +++ b/packages/core/src/Stores/client-store.js @@ -2059,6 +2059,7 @@ export default class ClientStore extends BaseStore { this.landing_companies = {}; localStorage.removeItem('readScamMessage'); localStorage.removeItem('isNewAccount'); + LocalStore.set('marked_notifications', JSON.stringify([])); localStorage.setItem('active_loginid', this.loginid); localStorage.setItem('client.accounts', JSON.stringify(this.accounts)); diff --git a/packages/core/src/Stores/notification-store.js b/packages/core/src/Stores/notification-store.js index 4d9bb91cd083..93e810a4a673 100644 --- a/packages/core/src/Stores/notification-store.js +++ b/packages/core/src/Stores/notification-store.js @@ -90,6 +90,7 @@ export default class NotificationStore extends BaseStore { () => root_store.common.app_routing_history.map(i => i.pathname), () => { this.filterNotificationMessages(); + this.marked_notifications = JSON.parse(LocalStore.get('marked_notifications') || '[]'); } ); reaction( @@ -257,7 +258,6 @@ export default class NotificationStore extends BaseStore { const is_p2p_notifications_visible = p2p_settings[loginid] ? p2p_settings[loginid].is_notifications_visible : false; - if (refined_list.length) { refined_list.map(refined => { if (refined.includes('p2p')) { @@ -636,7 +636,10 @@ export default class NotificationStore extends BaseStore { } markNotificationMessage({ key }) { - this.marked_notifications.push(key); + if (!this.marked_notifications.includes(key)) { + this.marked_notifications.push(key); + LocalStore.set('marked_notifications', JSON.stringify(this.marked_notifications)); + } } refreshNotifications() {