From a99fc78fe10ff7a9575607c14d73560bd22bf0ac Mon Sep 17 00:00:00 2001 From: elforjani13 <39470382+elforjani13@users.noreply.github.com> Date: Mon, 29 Nov 2021 20:28:28 +0200 Subject: [PATCH] feat: EasySMS integrate. --- src/components/DialogsContainer.js | 2 + .../EasySMSDisconnectAlert.js | 50 ++++++++++ src/containers/AlertsContainer/registered.js | 2 + .../EasySMSIntegrationDialogContent.js | 18 ++++ .../EasySMSIntegrationForm.js | 44 +++++++++ .../EasySMSIntegrationForm.schema.js | 7 ++ .../EasySMSIntegrationFormContent.js | 68 +++++++++++++ .../EasySMSIntegrationProvider.js | 25 +++++ .../Dialogs/EasySMSIntegrationDialog/index.js | 29 ++++++ .../EasySMSIntegrationAlerts.js | 12 +++ .../EasySMSIntegrationProvider.js | 29 ++++++ .../EasySMSIntegration/components.js | 0 .../Preferences/EasySMSIntegration/index.js | 99 +++++++++++++++++++ .../SMSIntegration/SMSIntegrationTabs.js | 2 + src/hooks/query/settings.js | 54 ++++++++++ src/hooks/query/types.js | 1 + src/lang/en/index.json | 8 +- .../EasySMSIntegration.scss | 17 ++++ 18 files changed, 466 insertions(+), 1 deletion(-) create mode 100644 src/containers/Alerts/EasySMSIntegration/EasySMSDisconnectAlert.js create mode 100644 src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationDialogContent.js create mode 100644 src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationForm.js create mode 100644 src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationForm.schema.js create mode 100644 src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationFormContent.js create mode 100644 src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationProvider.js create mode 100644 src/containers/Dialogs/EasySMSIntegrationDialog/index.js create mode 100644 src/containers/Preferences/EasySMSIntegration/EasySMSIntegrationAlerts.js create mode 100644 src/containers/Preferences/EasySMSIntegration/EasySMSIntegrationProvider.js create mode 100644 src/containers/Preferences/EasySMSIntegration/components.js create mode 100644 src/containers/Preferences/EasySMSIntegration/index.js create mode 100644 src/style/pages/EasySMSIntegration/EasySMSIntegration.scss diff --git a/src/components/DialogsContainer.js b/src/components/DialogsContainer.js index 871e38a58..c5f440466 100644 --- a/src/components/DialogsContainer.js +++ b/src/components/DialogsContainer.js @@ -26,6 +26,7 @@ import NotifyEstimateViaSMSDialog from '../containers/Dialogs/NotifyEstimateViaS import NotifyPaymentReceiveViaSMSDialog from '../containers/Dialogs/NotifyPaymentReceiveViaSMSDialog'; import SMSMessageDialog from '../containers/Dialogs/SMSMessageDialog'; import TransactionsLockingDialog from '../containers/Dialogs/TransactionsLockingDialog'; +import EasySMSIntegrationDialog from '../containers/Dialogs/EasySMSIntegrationDialog'; /** * Dialogs container. @@ -60,6 +61,7 @@ export default function DialogsContainer() { + ); } diff --git a/src/containers/Alerts/EasySMSIntegration/EasySMSDisconnectAlert.js b/src/containers/Alerts/EasySMSIntegration/EasySMSDisconnectAlert.js new file mode 100644 index 000000000..899392528 --- /dev/null +++ b/src/containers/Alerts/EasySMSIntegration/EasySMSDisconnectAlert.js @@ -0,0 +1,50 @@ +import React from 'react'; +import intl from 'react-intl-universal'; +import { FormattedMessage as T, FormattedHTMLMessage } from 'components'; +import { Intent, Alert } from '@blueprintjs/core'; +import { AppToaster } from 'components'; + +import withAlertStoreConnect from 'containers/Alert/withAlertStoreConnect'; +import withAlertActions from 'containers/Alert/withAlertActions'; + +import { compose } from 'utils'; + +/** + * Easy SMS disconnect alert. + */ +function EasySMSDisconnectAlert({ + name, + + // #withAlertStoreConnect + isOpen, + payload: {}, + + // #withAlertActions + closeAlert, +}) { + // Handle cancel Disconnect alert. + const handleCancelDisconnect = () => { + closeAlert(name); + }; + + // Handle confirm Disconnect alert. + const handleConfirmDisconnect = () => {}; + + return ( + } + confirmButtonText={} + intent={Intent.WARNING} + isOpen={isOpen} + onCancel={handleCancelDisconnect} + onConfirm={handleConfirmDisconnect} + > +

Ea aliqua elit reprehenderit pariatur consequat voluptate quis.

+ + ); +} + +export default compose( + withAlertStoreConnect(), + withAlertActions, +)(EasySMSDisconnectAlert); diff --git a/src/containers/AlertsContainer/registered.js b/src/containers/AlertsContainer/registered.js index d0e77fcfb..73b02e93f 100644 --- a/src/containers/AlertsContainer/registered.js +++ b/src/containers/AlertsContainer/registered.js @@ -17,6 +17,7 @@ import AccountTransactionsAlerts from '../CashFlow/AccountTransactions/AccountTr import UsersAlerts from '../Preferences/Users/UsersAlerts'; import CurrenciesAlerts from '../Preferences/Currencies/CurrenciesAlerts'; import RolesAlerts from '../Preferences/Users/Roles/RolesAlerts'; +import EasySMSIntegrationAlerts from '../Preferences/EasySMSIntegration/EasySMSIntegrationAlerts'; export default [ ...AccountsAlerts, @@ -38,4 +39,5 @@ export default [ ...UsersAlerts, ...CurrenciesAlerts, ...RolesAlerts, + ...EasySMSIntegrationAlerts, ]; diff --git a/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationDialogContent.js b/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationDialogContent.js new file mode 100644 index 000000000..79b10c6cf --- /dev/null +++ b/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationDialogContent.js @@ -0,0 +1,18 @@ +import React from 'react'; + +import { EasySMSIntegrationProvider } from './EasySMSIntegrationProvider'; +import EasySMSIntegrationForm from './EasySMSIntegrationForm'; + +/** + * EasySMS integration dialog content. + */ +export default function EasySMSIntegrationDialogContent({ + // #ownProps + dialogName, +}) { + return ( + + + + ); +} diff --git a/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationForm.js b/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationForm.js new file mode 100644 index 000000000..4fcd66873 --- /dev/null +++ b/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationForm.js @@ -0,0 +1,44 @@ +import React from 'react'; +import intl from 'react-intl-universal'; +import { Formik } from 'formik'; +import { Intent } from '@blueprintjs/core'; + +import '../../../style/pages/EasySMSIntegration/EasySMSIntegration.scss'; + +import { AppToaster } from 'components'; +import EasySMSIntegrationFormContent from './EasySMSIntegrationFormContent'; +import { CreateEasySMSIntegrationSchema } from './EasySMSIntegrationForm.schema'; + +import withDialogActions from 'containers/Dialog/withDialogActions'; +import { compose } from 'utils'; + +const defaultInitialValues = { + token: '', +}; + +/** + * EasySMS Integration form. + */ +function EasySMSIntegrationForm({ + // #withDialogActions + closeDialog, +}) { + // Initial form values. + const initialValues = { + ...defaultInitialValues, + }; + + // Handles the form submit. + const handleFormSubmit = (values, { setSubmitting, setErrors }) => {}; + + return ( + + ); +} + +export default compose(withDialogActions)(EasySMSIntegrationForm); diff --git a/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationForm.schema.js b/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationForm.schema.js new file mode 100644 index 000000000..a49aa615d --- /dev/null +++ b/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationForm.schema.js @@ -0,0 +1,7 @@ +import * as Yup from 'yup'; + +const Schema = Yup.object().shape({ + token: Yup.string().required(), +}); + +export const CreateEasySMSIntegrationSchema = Schema; diff --git a/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationFormContent.js b/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationFormContent.js new file mode 100644 index 000000000..425d50ac7 --- /dev/null +++ b/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationFormContent.js @@ -0,0 +1,68 @@ +import React from 'react'; +import { Form, FastField, ErrorMessage, useFormikContext } from 'formik'; +import { Classes, FormGroup, InputGroup, Button } from '@blueprintjs/core'; +import { FieldRequiredHint, FormattedMessage as T } from 'components'; +import { useEasySMSIntegration } from './EasySMSIntegrationProvider'; +import withDialogActions from 'containers/Dialog/withDialogActions'; +import { inputIntent, compose } from 'utils'; + +/** + * EasySMS Integration form content. + */ +function EasySMSIntegrationFormContent({ + // #withDialogActions + closeDialog, +}) { + // Formik context. + const { isSubmitting } = useFormikContext(); + + // EasySMS Integration dialog context. + const { dialogName } = useEasySMSIntegration(); + + // Handle close button click. + const handleCloseBtnClick = () => { + closeDialog(dialogName); + }; + + return ( +
+
+ {/*------------ Token -----------*/} + + {({ form, field, meta: { error, touched } }) => ( + } + labelInfo={} + intent={inputIntent({ error, touched })} + helperText={} + className={'form-group--token'} + > + + + )} + +
+
+
+ + + +
+
+
+ ); +} + +export default compose(withDialogActions)(EasySMSIntegrationFormContent); diff --git a/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationProvider.js b/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationProvider.js new file mode 100644 index 000000000..573980381 --- /dev/null +++ b/src/containers/Dialogs/EasySMSIntegrationDialog/EasySMSIntegrationProvider.js @@ -0,0 +1,25 @@ +import React from 'react'; +import { DialogContent } from 'components'; +import { useSettingEasySMSIntegrate } from 'hooks/query'; + +const EasySMSIntegrationDialogContext = React.createContext(); +/** + * Easy SMS integration dialog provider. + */ +function EasySMSIntegrationProvider({ dialogName, ...props }) { + // State provider. + const provider = { + dialogName, + }; + + return ( + + + + ); +} + +const useEasySMSIntegration = () => + React.useContext(EasySMSIntegrationDialogContext); + +export { EasySMSIntegrationProvider, useEasySMSIntegration }; diff --git a/src/containers/Dialogs/EasySMSIntegrationDialog/index.js b/src/containers/Dialogs/EasySMSIntegrationDialog/index.js new file mode 100644 index 000000000..9e3c795f0 --- /dev/null +++ b/src/containers/Dialogs/EasySMSIntegrationDialog/index.js @@ -0,0 +1,29 @@ +import React from 'react'; +import { Dialog, DialogSuspense, FormattedMessage as T } from 'components'; +import withDialogRedux from 'components/DialogReduxConnect'; +import { compose } from 'redux'; + +const EasySMSIntegrationDialogContent = React.lazy(() => + import('./EasySMSIntegrationDialogContent'), +); + +/** + * EasySms integration dialog. + */ +function EasySMSIntegrationDialog({ dialogName, payload = {}, isOpen }) { + return ( + + + + + + ); +} +export default compose(withDialogRedux())(EasySMSIntegrationDialog); diff --git a/src/containers/Preferences/EasySMSIntegration/EasySMSIntegrationAlerts.js b/src/containers/Preferences/EasySMSIntegration/EasySMSIntegrationAlerts.js new file mode 100644 index 000000000..9709b7fb1 --- /dev/null +++ b/src/containers/Preferences/EasySMSIntegration/EasySMSIntegrationAlerts.js @@ -0,0 +1,12 @@ +import React from 'react'; + +const EasySMSDisconnectAlert = React.lazy(() => + import('../../Alerts/EasySMSIntegration/EasySMSDisconnectAlert'), +); + +export default [ + { + name: 'easysms-disconnect', + component: EasySMSDisconnectAlert, + }, +]; diff --git a/src/containers/Preferences/EasySMSIntegration/EasySMSIntegrationProvider.js b/src/containers/Preferences/EasySMSIntegration/EasySMSIntegrationProvider.js new file mode 100644 index 000000000..6600418d5 --- /dev/null +++ b/src/containers/Preferences/EasySMSIntegration/EasySMSIntegrationProvider.js @@ -0,0 +1,29 @@ +import React from 'react'; +import classNames from 'classnames'; +import { CLASSES } from 'common/classes'; +import { + useSettingEasySMS, + useSettingEasySMSDisconnect, + useSettingEasySMSIntegrate, +} from 'hooks/query'; + +const EasySMSIntegrationContext = React.createContext(); + +/** + * Easysms integration data provider. + */ +function EasySMSIntegrationProvider({ ...props }) { + // Provider + const provider = {}; + + return ( +
+ +
+ ); +} + +const useEasySMSIntegrationContext = () => + React.useContext(EasySMSIntegrationContext); + +export { EasySMSIntegrationProvider, useEasySMSIntegrationContext }; diff --git a/src/containers/Preferences/EasySMSIntegration/components.js b/src/containers/Preferences/EasySMSIntegration/components.js new file mode 100644 index 000000000..e69de29bb diff --git a/src/containers/Preferences/EasySMSIntegration/index.js b/src/containers/Preferences/EasySMSIntegration/index.js new file mode 100644 index 000000000..5dcd1aead --- /dev/null +++ b/src/containers/Preferences/EasySMSIntegration/index.js @@ -0,0 +1,99 @@ +import React from 'react'; +import styled from 'styled-components'; +import { Button, Intent } from '@blueprintjs/core'; +import clsx from 'classnames'; +import { FormattedMessage as T } from 'components'; + +import { EasySMSIntegrationProvider } from './EasySMSIntegrationProvider'; +import withDialogActions from 'containers/Dialog/withDialogActions'; +import withAlertsActions from 'containers/Alert/withAlertActions'; + +import { compose } from 'utils'; + +/** + * EasySMS integration. + */ +function EasySMSIntegrationList({ + // #withDialogActions + openDialog, + + // #withAlertsActions + openAlert, +}) { + // Handle EasySMS integrate. + const handleEasySMSIntegrate = () => { + openDialog('easysms-integrate', {}); + }; + + // Handle EsaySMS disconnect + const handleEasySMSDiconnect = ({}) => { + openAlert('easysms-disconnect', {}); + }; + + return ( + + + + Easysms Integration + + Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed + do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem + ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod + +