mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-15 20:30:33 +00:00
feat: add notify via SMS Form.
This commit is contained in:
@@ -20,7 +20,10 @@ import ReceiptPdfPreviewDialog from '../containers/Dialogs/ReceiptPdfPreviewDial
|
||||
import MoneyInDialog from '../containers/Dialogs/MoneyInDialog';
|
||||
import MoneyOutDialog from '../containers/Dialogs/MoneyOutDialog';
|
||||
import BadDebtDialog from '../containers/Dialogs/BadDebtDialog';
|
||||
import NotifyContactViaSMSDialog from '../containers/Dialogs/NotifyContactViaSMSDialog';
|
||||
import NotifyInvoiceViaSMSDialog from '../containers/Dialogs/NotifyInvoiceViaSMSDialog';
|
||||
import NotifyReceiptViaSMSDialog from '../containers/Dialogs/NotifyReceiptViaSMSDialog';
|
||||
import NotifyEstimateViaSMSDialog from '../containers/Dialogs/NotifyEstimateViaSMSDialog';
|
||||
import NotifyPaymentReceiveViaSMSDialog from '../containers/Dialogs/NotifyPaymentReceiveViaSMSDialog'
|
||||
import SMSMessageDialog from '../containers/Dialogs/SMSMessageDialog';
|
||||
|
||||
/**
|
||||
@@ -47,7 +50,10 @@ export default function DialogsContainer() {
|
||||
<ReceiptPdfPreviewDialog dialogName={'receipt-pdf-preview'} />
|
||||
<MoneyInDialog dialogName={'money-in'} />
|
||||
<MoneyOutDialog dialogName={'money-out'} />
|
||||
<NotifyContactViaSMSDialog dialogName={'notify-via-sms'} />
|
||||
<NotifyInvoiceViaSMSDialog dialogName={'notify-invoice-via-sms'} />
|
||||
<NotifyReceiptViaSMSDialog dialogName={'notify-receipt-via-sms'} />
|
||||
<NotifyEstimateViaSMSDialog dialogName={'notify-estimate-via-sms'} />
|
||||
<NotifyPaymentReceiveViaSMSDialog dialogName={'notify-payment-via-sms'} />
|
||||
<BadDebtDialog dialogName={'write-off-bad-debt'} />
|
||||
<SMSMessageDialog dialogName={'sms-message-form'} />
|
||||
</div>
|
||||
|
||||
@@ -1,23 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
import 'style/pages/NotifyConactViaSMS/NotifyConactViaSMSDialog.scss';
|
||||
import { NotifyContactViaSMSFormProvider } from './NotifyContactViaSMSFormProvider';
|
||||
import NotifyContactViaSMSForm from './NotifyContactViaSMSForm';
|
||||
|
||||
/**
|
||||
* Notify contact via SMS.
|
||||
*/
|
||||
export default function NotifyContactViaSMSContent({
|
||||
// #ownProps
|
||||
dialogName,
|
||||
invoice,
|
||||
}) {
|
||||
return (
|
||||
<NotifyContactViaSMSFormProvider
|
||||
invoiceId={invoice}
|
||||
dialogName={dialogName}
|
||||
>
|
||||
<NotifyContactViaSMSForm />
|
||||
</NotifyContactViaSMSFormProvider>
|
||||
);
|
||||
}
|
||||
@@ -1,16 +0,0 @@
|
||||
import React from 'react';
|
||||
import { Form } from 'formik';
|
||||
|
||||
import NotifyContactViaSMSFormFields from './NotifyContactViaSMSFormFields';
|
||||
import NotifyContactViaSMSFormFloatingActions from './NotifyContactViaSMSFormFloatingActions';
|
||||
/**
|
||||
* Nofity contact via SMS form content.
|
||||
*/
|
||||
export default function NotifyContactViaSMSFormContent() {
|
||||
return (
|
||||
<Form>
|
||||
<NotifyContactViaSMSFormFields />
|
||||
<NotifyContactViaSMSFormFloatingActions />
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
@@ -1,47 +0,0 @@
|
||||
import React from 'react';
|
||||
import { DialogContent } from 'components';
|
||||
import {
|
||||
useInvoice,
|
||||
useCreateNotifyInvoiceBySMS,
|
||||
useInvocieSMSDetails,
|
||||
} from 'hooks/query';
|
||||
|
||||
const NotifyContactViaSMSContext = React.createContext();
|
||||
|
||||
/**
|
||||
* Notify contact via SMS provider.
|
||||
*/
|
||||
function NotifyContactViaSMSFormProvider({ invoiceId, dialogName, ...props }) {
|
||||
// Handle fetch invoice data.
|
||||
const { data: invoice, isLoading: isInvoiceLoading } = useInvoice(invoiceId, {
|
||||
enabled: !!invoiceId,
|
||||
});
|
||||
|
||||
const { data: invoiceSMSDetail, isLoading: isInvoiceSMSDetailLoading } =
|
||||
useInvocieSMSDetails(invoiceId, {
|
||||
enabled: !!invoiceId,
|
||||
});
|
||||
|
||||
// Create notfiy invoice by sms mutations.
|
||||
const { mutateAsync: createNotifyInvoiceBySMSMutate } =
|
||||
useCreateNotifyInvoiceBySMS();
|
||||
|
||||
// State provider.
|
||||
const provider = {
|
||||
invoiceId,
|
||||
invoiceSMSDetail,
|
||||
dialogName,
|
||||
createNotifyInvoiceBySMSMutate,
|
||||
};
|
||||
|
||||
return (
|
||||
<DialogContent isLoading={isInvoiceLoading || isInvoiceSMSDetailLoading}>
|
||||
<NotifyContactViaSMSContext.Provider value={provider} {...props} />
|
||||
</DialogContent>
|
||||
);
|
||||
}
|
||||
|
||||
const useNotifyContactViaSMSContext = () =>
|
||||
React.useContext(NotifyContactViaSMSContext);
|
||||
|
||||
export { NotifyContactViaSMSFormProvider, useNotifyContactViaSMSContext };
|
||||
@@ -0,0 +1,18 @@
|
||||
import React from 'react';
|
||||
import { NotifyEstimateViaSMSFormProvider } from './NotifyEstimateViaSMSFormProvider';
|
||||
import NotifyEstimateViaSMSForm from './NotifyEstimateViaSMSForm';
|
||||
|
||||
export default function NotifyEstimateViaSMSDialogContent({
|
||||
// #ownProps
|
||||
dialogName,
|
||||
estimate,
|
||||
}) {
|
||||
return (
|
||||
<NotifyEstimateViaSMSFormProvider
|
||||
estimateId={estimate}
|
||||
dialogName={dialogName}
|
||||
>
|
||||
<NotifyEstimateViaSMSForm />
|
||||
</NotifyEstimateViaSMSFormProvider>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,49 @@
|
||||
import React from 'react';
|
||||
import intl from 'react-intl-universal';
|
||||
|
||||
import { Intent } from '@blueprintjs/core';
|
||||
import { AppToaster } from 'components';
|
||||
|
||||
import NotifyViaSMSForm from '../../NotifyViaSMS/NotifyViaSMSForm';
|
||||
import { useEstimateViaSMSContext } from './NotifyEstimateViaSMSFormProvider';
|
||||
|
||||
import withDialogActions from 'containers/Dialog/withDialogActions';
|
||||
import { compose } from 'utils';
|
||||
|
||||
function NotifyEstimateViaSMSForm({
|
||||
// #withDialogActions
|
||||
closeDialog,
|
||||
}) {
|
||||
const { dialogName, estimateId } = useEstimateViaSMSContext();
|
||||
|
||||
// Handles the form submit.
|
||||
const handleFormSubmit = (values, { setSubmitting, setErrors }) => {
|
||||
// Handle request response success.
|
||||
const onSuccess = (response) => {
|
||||
AppToaster.show({
|
||||
message: intl.get('notify_via_sms.dialog.success_message'),
|
||||
intent: Intent.SUCCESS,
|
||||
});
|
||||
closeDialog(dialogName);
|
||||
};
|
||||
|
||||
// Handle request response errors.
|
||||
const onError = ({
|
||||
response: {
|
||||
data: { errors },
|
||||
},
|
||||
}) => {
|
||||
setSubmitting(false);
|
||||
};
|
||||
};
|
||||
|
||||
return (
|
||||
<NotifyViaSMSForm
|
||||
NotificationDetail={{}}
|
||||
NotificationName={dialogName}
|
||||
onSubmit={handleFormSubmit}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
export default compose(withDialogActions)(NotifyEstimateViaSMSForm);
|
||||
@@ -0,0 +1,30 @@
|
||||
import React from 'react';
|
||||
import { DialogContent } from 'components';
|
||||
// import { } from 'hooks/query';
|
||||
|
||||
const NotifyEstimateViaSMSContext = React.createContext();
|
||||
|
||||
function NotifyEstimateViaSMSFormProvider({
|
||||
estimateId,
|
||||
dialogName,
|
||||
...props
|
||||
}) {
|
||||
// State provider.
|
||||
const provider = {
|
||||
estimateId,
|
||||
dialogName,
|
||||
};
|
||||
|
||||
return (
|
||||
<DialogContent
|
||||
// isLoading={}
|
||||
>
|
||||
<NotifyEstimateViaSMSContext.Provider value={provider} {...props} />
|
||||
</DialogContent>
|
||||
);
|
||||
}
|
||||
|
||||
const useEstimateViaSMSContext = () =>
|
||||
React.useContext(NotifyEstimateViaSMSContext);
|
||||
|
||||
export { NotifyEstimateViaSMSFormProvider, useEstimateViaSMSContext };
|
||||
36
src/containers/Dialogs/NotifyEstimateViaSMSDialog/index.js
Normal file
36
src/containers/Dialogs/NotifyEstimateViaSMSDialog/index.js
Normal file
@@ -0,0 +1,36 @@
|
||||
import React from 'react';
|
||||
|
||||
import { FormattedMessage as T } from 'components';
|
||||
import { Dialog, DialogSuspense } from 'components';
|
||||
import withDialogRedux from 'components/DialogReduxConnect';
|
||||
import { compose } from 'utils';
|
||||
|
||||
const NotifyEstimateViaSMSDialogContent = React.lazy(() =>
|
||||
import('./NotifyEstimateViaSMSDialogContent'),
|
||||
);
|
||||
|
||||
function NotifyEstimateViaSMSDialog({
|
||||
dialogName,
|
||||
payload: { estimateId },
|
||||
isOpen,
|
||||
}) {
|
||||
return (
|
||||
<Dialog
|
||||
name={dialogName}
|
||||
title={<T id={'notify_via_sms.dialog.notify_via_sms'} />}
|
||||
isOpen={isOpen}
|
||||
canEscapeJeyClose={true}
|
||||
autoFocus={true}
|
||||
className={'dialog--notify-vis-sms'}
|
||||
>
|
||||
<DialogSuspense>
|
||||
<NotifyEstimateViaSMSDialogContent
|
||||
dialogName={dialogName}
|
||||
estimate={estimateId}
|
||||
/>
|
||||
</DialogSuspense>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
|
||||
export default compose(withDialogRedux())(NotifyEstimateViaSMSDialog);
|
||||
@@ -0,0 +1,19 @@
|
||||
import React from 'react';
|
||||
|
||||
import { NotifyInvoiceViaSMSFormProvider } from './NotifyInvoiceViaSMSFormProvider';
|
||||
import NotifyInvoiceViaSMSForm from './NotifyInvoiceViaSMSForm';
|
||||
|
||||
export default function NotifyInvoiceViaSMSDialogContent({
|
||||
// #ownProps
|
||||
dialogName,
|
||||
invoice,
|
||||
}) {
|
||||
return (
|
||||
<NotifyInvoiceViaSMSFormProvider
|
||||
invoiceId={invoice}
|
||||
dialogName={dialogName}
|
||||
>
|
||||
<NotifyInvoiceViaSMSForm />
|
||||
</NotifyInvoiceViaSMSFormProvider>
|
||||
);
|
||||
}
|
||||
@@ -1,42 +1,28 @@
|
||||
import React from 'react';
|
||||
import intl from 'react-intl-universal';
|
||||
|
||||
import { Formik } from 'formik';
|
||||
import { Intent } from '@blueprintjs/core';
|
||||
|
||||
import { AppToaster } from 'components';
|
||||
import { CreateNotifyContactViaSMSFormSchema } from './NotifyContactViaSMSForm.schema';
|
||||
|
||||
import NotifyContactViaSMSFormContent from './NotifyContactViaSMSFormContent';
|
||||
import NotifyViaSMSForm from '../../NotifyViaSMS/NotifyViaSMSForm';
|
||||
import { useNotifyInvoiceViaSMSContext } from './NotifyInvoiceViaSMSFormProvider';
|
||||
|
||||
import withDialogActions from 'containers/Dialog/withDialogActions';
|
||||
import { compose } from 'utils';
|
||||
|
||||
import { useNotifyContactViaSMSContext } from './NotifyContactViaSMSFormProvider';
|
||||
|
||||
import { transformToForm, compose } from 'utils';
|
||||
|
||||
const defaultInitialValues = {
|
||||
customer_name: '',
|
||||
customer_personal_phone: '',
|
||||
sms_message: '',
|
||||
};
|
||||
|
||||
function NotifyContactViaSMSForm({
|
||||
/**
|
||||
* Notify Invoice Via SMS Form.
|
||||
*/
|
||||
function NotifyInvoiceViaSMSForm({
|
||||
// #withDialogActions
|
||||
closeDialog,
|
||||
}) {
|
||||
const {
|
||||
createNotifyInvoiceBySMSMutate,
|
||||
invoiceId,
|
||||
invoiceSMSDetail,
|
||||
dialogName,
|
||||
createNotifyInvoiceBySMSMutate,
|
||||
} = useNotifyContactViaSMSContext();
|
||||
|
||||
// Initial form values
|
||||
const initialValues = {
|
||||
...defaultInitialValues,
|
||||
...transformToForm(invoiceSMSDetail, defaultInitialValues),
|
||||
};
|
||||
} = useNotifyInvoiceViaSMSContext();
|
||||
|
||||
// Handles the form submit.
|
||||
const handleFormSubmit = (values, { setSubmitting, setErrors }) => {
|
||||
@@ -63,12 +49,12 @@ function NotifyContactViaSMSForm({
|
||||
};
|
||||
|
||||
return (
|
||||
<Formik
|
||||
validationSchema={CreateNotifyContactViaSMSFormSchema}
|
||||
initialValues={initialValues}
|
||||
<NotifyViaSMSForm
|
||||
NotificationDetail={invoiceSMSDetail}
|
||||
NotificationName={dialogName}
|
||||
onSubmit={handleFormSubmit}
|
||||
component={NotifyContactViaSMSFormContent}
|
||||
/>
|
||||
);
|
||||
}
|
||||
export default compose(withDialogActions)(NotifyContactViaSMSForm);
|
||||
|
||||
export default compose(withDialogActions)(NotifyInvoiceViaSMSForm);
|
||||
@@ -0,0 +1,35 @@
|
||||
import React from 'react';
|
||||
import { DialogContent } from 'components';
|
||||
import { useCreateNotifyInvoiceBySMS, useInvocieSMSDetails } from 'hooks/query';
|
||||
|
||||
const NotifyInvoiceViaSMSContext = React.createContext();
|
||||
|
||||
function NotifyInvoiceViaSMSFormProvider({ invoiceId, dialogName, ...props }) {
|
||||
const { data: invoiceSMSDetail, isLoading: isInvoiceSMSDetailLoading } =
|
||||
useInvocieSMSDetails(invoiceId, {
|
||||
enabled: !!invoiceId,
|
||||
});
|
||||
|
||||
// Create notfiy invoice by sms mutations.
|
||||
const { mutateAsync: createNotifyInvoiceBySMSMutate } =
|
||||
useCreateNotifyInvoiceBySMS();
|
||||
|
||||
// State provider.
|
||||
const provider = {
|
||||
invoiceId,
|
||||
invoiceSMSDetail,
|
||||
dialogName,
|
||||
createNotifyInvoiceBySMSMutate,
|
||||
};
|
||||
|
||||
return (
|
||||
<DialogContent isLoading={isInvoiceSMSDetailLoading}>
|
||||
<NotifyInvoiceViaSMSContext.Provider value={provider} {...props} />
|
||||
</DialogContent>
|
||||
);
|
||||
}
|
||||
|
||||
const useNotifyInvoiceViaSMSContext = () =>
|
||||
React.useContext(NotifyInvoiceViaSMSContext);
|
||||
|
||||
export { NotifyInvoiceViaSMSFormProvider, useNotifyInvoiceViaSMSContext };
|
||||
@@ -3,16 +3,13 @@ import React from 'react';
|
||||
import { FormattedMessage as T } from 'components';
|
||||
import { Dialog, DialogSuspense } from 'components';
|
||||
import withDialogRedux from 'components/DialogReduxConnect';
|
||||
import { compose } from 'redux';
|
||||
import { compose } from 'utils';
|
||||
|
||||
const NotifyContactViaSMSDialogContent = React.lazy(() =>
|
||||
import('./NotifyContactViaSMSContent'),
|
||||
const NotifyInvoiceViaSMSDialogContent = React.lazy(() =>
|
||||
import('./NotifyInvoiceViaSMSDialogContent'),
|
||||
);
|
||||
|
||||
/**
|
||||
* Notify contact via SMS.
|
||||
*/
|
||||
function NotifyContactViaSMSDialog({
|
||||
function NotifyInvoiceViaSMSDialog({
|
||||
dialogName,
|
||||
payload: { invoiceId },
|
||||
isOpen,
|
||||
@@ -27,7 +24,7 @@ function NotifyContactViaSMSDialog({
|
||||
className={'dialog--notify-vis-sms'}
|
||||
>
|
||||
<DialogSuspense>
|
||||
<NotifyContactViaSMSDialogContent
|
||||
<NotifyInvoiceViaSMSDialogContent
|
||||
dialogName={dialogName}
|
||||
invoice={invoiceId}
|
||||
/>
|
||||
@@ -35,5 +32,4 @@ function NotifyContactViaSMSDialog({
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
|
||||
export default compose(withDialogRedux())(NotifyContactViaSMSDialog);
|
||||
export default compose(withDialogRedux())(NotifyInvoiceViaSMSDialog);
|
||||
@@ -0,0 +1,33 @@
|
||||
import React from 'react';
|
||||
import { DialogContent } from 'components';
|
||||
// import { useCreateNotifyInvoiceBySMS, useInvocieSMSDetails } from 'hooks/query';
|
||||
|
||||
const NotifyPaymentReceiveViaSMSContext = React.createContext();
|
||||
|
||||
function NotifyPaymentReceiveViaFormProvider({
|
||||
paymentReceiveId,
|
||||
dialogName,
|
||||
...props
|
||||
}) {
|
||||
// State provider.
|
||||
const provider = {
|
||||
paymentReceiveId,
|
||||
dialogName,
|
||||
};
|
||||
|
||||
return (
|
||||
<DialogContent
|
||||
// isLoading={}
|
||||
>
|
||||
<NotifyPaymentReceiveViaSMSContext.Provider value={provider} {...props} />
|
||||
</DialogContent>
|
||||
);
|
||||
}
|
||||
|
||||
const useNotifyPaymentReceiveViaSMSContext = () =>
|
||||
React.useContext(NotifyPaymentReceiveViaSMSContext);
|
||||
|
||||
export {
|
||||
NotifyPaymentReceiveViaFormProvider,
|
||||
useNotifyPaymentReceiveViaSMSContext,
|
||||
};
|
||||
@@ -0,0 +1,19 @@
|
||||
import React from 'react';
|
||||
|
||||
import { NotifyPaymentReceiveViaFormProvider } from './NotifyPaymentReceiveViaFormProvider';
|
||||
import NotifyPaymentReceiveViaSMSForm from './NotifyPaymentReceiveViaSMSForm';
|
||||
|
||||
export default function NotifyPaymentReceiveViaSMSContent({
|
||||
// #ownProps
|
||||
dialogName,
|
||||
paymentReceive,
|
||||
}) {
|
||||
return (
|
||||
<NotifyPaymentReceiveViaFormProvider
|
||||
paymentReceiveId={paymentReceive}
|
||||
dialogName={dialogName}
|
||||
>
|
||||
<NotifyPaymentReceiveViaSMSForm />
|
||||
</NotifyPaymentReceiveViaFormProvider>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,52 @@
|
||||
import React from 'react';
|
||||
import intl from 'react-intl-universal';
|
||||
|
||||
import { Intent } from '@blueprintjs/core';
|
||||
import { AppToaster } from 'components';
|
||||
|
||||
import NotifyViaSMSForm from '../../NotifyViaSMS/NotifyViaSMSForm';
|
||||
import { useNotifyPaymentReceiveViaSMSContext } from './NotifyPaymentReceiveViaFormProvider';
|
||||
|
||||
import withDialogActions from 'containers/Dialog/withDialogActions';
|
||||
import { compose } from 'utils';
|
||||
|
||||
/**
|
||||
* Notify Payment Recive Via SMS Form.
|
||||
*/
|
||||
function NotifyPaymentReceiveViaSMSForm({
|
||||
// #withDialogActions
|
||||
closeDialog,
|
||||
}) {
|
||||
const { dialogName, paymentReceiveId } =
|
||||
useNotifyPaymentReceiveViaSMSContext();
|
||||
|
||||
// Handles the form submit.
|
||||
const handleFormSubmit = (values, { setSubmitting, setErrors }) => {
|
||||
// Handle request response success.
|
||||
const onSuccess = (response) => {
|
||||
AppToaster.show({
|
||||
message: intl.get('notify_via_sms.dialog.success_message'),
|
||||
intent: Intent.SUCCESS,
|
||||
});
|
||||
closeDialog(dialogName);
|
||||
};
|
||||
|
||||
// Handle request response errors.
|
||||
const onError = ({
|
||||
response: {
|
||||
data: { errors },
|
||||
},
|
||||
}) => {
|
||||
setSubmitting(false);
|
||||
};
|
||||
};
|
||||
|
||||
return (
|
||||
<NotifyViaSMSForm
|
||||
NotificationDetail={{}}
|
||||
NotificationName={dialogName}
|
||||
onSubmit={handleFormSubmit}
|
||||
/>
|
||||
);
|
||||
}
|
||||
export default compose(withDialogActions)(NotifyPaymentReceiveViaSMSForm);
|
||||
@@ -0,0 +1,34 @@
|
||||
import React from 'react';
|
||||
import { FormattedMessage as T } from 'components';
|
||||
import { Dialog, DialogSuspense } from 'components';
|
||||
import withDialogRedux from 'components/DialogReduxConnect';
|
||||
import { compose } from 'utils';
|
||||
|
||||
const NotifyPaymentReceiveViaSMSDialogContent = React.lazy(() =>
|
||||
import('./NotifyPaymentReceiveViaSMSContent'),
|
||||
);
|
||||
|
||||
function NotifyPaymentReciveViaSMSDialog({
|
||||
dialogName,
|
||||
payload: { paymentReceiveId },
|
||||
isOpen,
|
||||
}) {
|
||||
return (
|
||||
<Dialog
|
||||
name={dialogName}
|
||||
title={<T id={'notify_via_sms.dialog.notify_via_sms'} />}
|
||||
isOpen={isOpen}
|
||||
canEscapeJeyClose={true}
|
||||
autoFocus={true}
|
||||
className={'dialog--notify-vis-sms'}
|
||||
>
|
||||
<DialogSuspense>
|
||||
<NotifyPaymentReceiveViaSMSDialogContent
|
||||
dialogName={dialogName}
|
||||
paymnetReceive={paymentReceiveId}
|
||||
/>
|
||||
</DialogSuspense>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
export default compose(withDialogRedux())(NotifyPaymentReciveViaSMSDialog);
|
||||
@@ -0,0 +1,19 @@
|
||||
import React from 'react';
|
||||
|
||||
import { NotifyReceiptViaSMSFormProvider } from './NotifyReceiptViaSMSFormProvider';
|
||||
import NotifyReceiptViaSMSForm from './NotifyReceiptViaSMSForm';
|
||||
|
||||
export default function NotifyReceiptViaSMSDialogContent({
|
||||
// #ownProps
|
||||
dialogName,
|
||||
receipt,
|
||||
}) {
|
||||
return (
|
||||
<NotifyReceiptViaSMSFormProvider
|
||||
receiptId={receipt}
|
||||
dialogName={dialogName}
|
||||
>
|
||||
<NotifyReceiptViaSMSForm />
|
||||
</NotifyReceiptViaSMSFormProvider>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,52 @@
|
||||
import React from 'react';
|
||||
import intl from 'react-intl-universal';
|
||||
|
||||
import { Intent } from '@blueprintjs/core';
|
||||
import { AppToaster } from 'components';
|
||||
|
||||
import NotifyViaSMSForm from '../../NotifyViaSMS/NotifyViaSMSForm';
|
||||
import { useNotifyReceiptViaSMSContext } from './NotifyReceiptViaSMSFormProvider';
|
||||
|
||||
import withDialogActions from 'containers/Dialog/withDialogActions';
|
||||
import { compose } from 'utils';
|
||||
|
||||
/**
|
||||
* Notify Receipt Via SMS Form.
|
||||
*/
|
||||
function NotifyReceiptViaSMSForm({
|
||||
// #withDialogActions
|
||||
closeDialog,
|
||||
}) {
|
||||
const { dialogName, receiptId } = useNotifyReceiptViaSMSContext();
|
||||
|
||||
// Handles the form submit.
|
||||
const handleFormSubmit = (values, { setSubmitting, setErrors }) => {
|
||||
// Handle request response success.
|
||||
const onSuccess = (response) => {
|
||||
AppToaster.show({
|
||||
message: intl.get('notify_via_sms.dialog.success_message'),
|
||||
intent: Intent.SUCCESS,
|
||||
});
|
||||
closeDialog(dialogName);
|
||||
};
|
||||
|
||||
// Handle request response errors.
|
||||
const onError = ({
|
||||
response: {
|
||||
data: { errors },
|
||||
},
|
||||
}) => {
|
||||
setSubmitting(false);
|
||||
};
|
||||
};
|
||||
|
||||
return (
|
||||
<NotifyViaSMSForm
|
||||
NotificationDetail={{}}
|
||||
NotificationName={dialogName}
|
||||
onSubmit={handleFormSubmit}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
export default compose(withDialogActions)(NotifyReceiptViaSMSForm);
|
||||
@@ -0,0 +1,28 @@
|
||||
import React from 'react';
|
||||
import { DialogContent } from 'components';
|
||||
// import { useCreateNotifyInvoiceBySMS, useInvocieSMSDetails } from 'hooks/query';
|
||||
|
||||
const NotifyReceiptViaSMSContext = React.createContext();
|
||||
|
||||
function NotifyReceiptViaSMSFormProvider({ receiptId, dialogName, ...props }) {
|
||||
// Create notfiy receipt via sms mutations.
|
||||
|
||||
// State provider.
|
||||
const provider = {
|
||||
receiptId,
|
||||
dialogName,
|
||||
};
|
||||
|
||||
return (
|
||||
<DialogContent
|
||||
// isLoading={}
|
||||
>
|
||||
<NotifyReceiptViaSMSContext.Provider value={provider} {...props} />
|
||||
</DialogContent>
|
||||
);
|
||||
}
|
||||
|
||||
const useNotifyReceiptViaSMSContext = () =>
|
||||
React.useContext(NotifyReceiptViaSMSContext);
|
||||
|
||||
export { NotifyReceiptViaSMSFormProvider, useNotifyReceiptViaSMSContext };
|
||||
35
src/containers/Dialogs/NotifyReceiptViaSMSDialog/index.js
Normal file
35
src/containers/Dialogs/NotifyReceiptViaSMSDialog/index.js
Normal file
@@ -0,0 +1,35 @@
|
||||
import React from 'react';
|
||||
import { FormattedMessage as T } from 'components';
|
||||
import { Dialog, DialogSuspense } from 'components';
|
||||
import withDialogRedux from 'components/DialogReduxConnect';
|
||||
import { compose } from 'utils';
|
||||
|
||||
const NotifyReceiptViaSMSDialogContent = React.lazy(() =>
|
||||
import('./NotifyReceiptViaSMSDialogContent'),
|
||||
);
|
||||
|
||||
function NotifyReceiptViaSMSDialog({
|
||||
dialogName,
|
||||
payload: { receiptId },
|
||||
isOpen,
|
||||
}) {
|
||||
return (
|
||||
<Dialog
|
||||
name={dialogName}
|
||||
title={<T id={'notify_via_sms.dialog.notify_via_sms'} />}
|
||||
isOpen={isOpen}
|
||||
canEscapeJeyClose={true}
|
||||
autoFocus={true}
|
||||
className={'dialog--notify-vis-sms'}
|
||||
>
|
||||
<DialogSuspense>
|
||||
<NotifyReceiptViaSMSDialogContent
|
||||
dialogName={dialogName}
|
||||
receipt={receiptId}
|
||||
/>
|
||||
</DialogSuspense>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
|
||||
export default compose(withDialogRedux())(NotifyReceiptViaSMSDialog);
|
||||
@@ -15,7 +15,7 @@ import withDialogActions from 'containers/Dialog/withDialogActions';
|
||||
import withAlertsActions from 'containers/Alert/withAlertActions';
|
||||
import withDrawerActions from 'containers/Drawer/withDrawerActions';
|
||||
|
||||
import { Icon, FormattedMessage as T } from 'components';
|
||||
import { Icon, FormattedMessage as T, MoreMenuItems } from 'components';
|
||||
|
||||
import { compose } from 'utils';
|
||||
|
||||
@@ -51,6 +51,10 @@ function EstimateDetailActionsBar({
|
||||
const handlePrintEstimate = () => {
|
||||
openDialog('estimate-pdf-preview', { estimateId });
|
||||
};
|
||||
// Handle notify via SMS.
|
||||
const handleNotifyViaSMS = () => {
|
||||
openDialog('notify-estimate-via-sms', { estimateId });
|
||||
};
|
||||
|
||||
return (
|
||||
<DashboardActionsBar>
|
||||
@@ -75,6 +79,12 @@ function EstimateDetailActionsBar({
|
||||
intent={Intent.DANGER}
|
||||
onClick={handleDeleteEstimate}
|
||||
/>
|
||||
<NavbarDivider />
|
||||
<MoreMenuItems
|
||||
payload={{
|
||||
onNotifyViaSMS: handleNotifyViaSMS,
|
||||
}}
|
||||
/>
|
||||
</NavbarGroup>
|
||||
</DashboardActionsBar>
|
||||
);
|
||||
|
||||
@@ -67,7 +67,7 @@ function InvoiceDetailActionsBar({
|
||||
};
|
||||
// Handle notify via SMS.
|
||||
const handleNotifyViaSMS = () => {
|
||||
openDialog('notify-via-sms', { invoiceId });
|
||||
openDialog('notify-invoice-via-sms', { invoiceId });
|
||||
};
|
||||
|
||||
// Handle cancele write-off invoice.
|
||||
|
||||
@@ -16,7 +16,7 @@ import withDialogActions from 'containers/Dialog/withDialogActions';
|
||||
import withAlertsActions from 'containers/Alert/withAlertActions';
|
||||
import withDrawerActions from 'containers/Drawer/withDrawerActions';
|
||||
|
||||
import { Icon, FormattedMessage as T } from 'components';
|
||||
import { Icon, FormattedMessage as T, MoreMenuItems } from 'components';
|
||||
|
||||
import { compose } from 'utils';
|
||||
|
||||
@@ -29,6 +29,9 @@ function PaymentReceiveActionsBar({
|
||||
|
||||
// #withDrawerActions
|
||||
closeDrawer,
|
||||
|
||||
// #withDialogActions
|
||||
openDialog,
|
||||
}) {
|
||||
const history = useHistory();
|
||||
|
||||
@@ -46,6 +49,11 @@ function PaymentReceiveActionsBar({
|
||||
openAlert('payment-receive-delete', { paymentReceiveId });
|
||||
};
|
||||
|
||||
// Handle notify via SMS.
|
||||
const handleNotifyViaSMS = () => {
|
||||
openDialog('notify-payment-via-sms', { paymentReceiveId });
|
||||
};
|
||||
|
||||
return (
|
||||
<DashboardActionsBar>
|
||||
<NavbarGroup>
|
||||
@@ -63,6 +71,12 @@ function PaymentReceiveActionsBar({
|
||||
intent={Intent.DANGER}
|
||||
onClick={handleDeletePaymentReceive}
|
||||
/>
|
||||
<NavbarDivider />
|
||||
<MoreMenuItems
|
||||
payload={{
|
||||
onNotifyViaSMS: handleNotifyViaSMS,
|
||||
}}
|
||||
/>
|
||||
</NavbarGroup>
|
||||
</DashboardActionsBar>
|
||||
);
|
||||
|
||||
@@ -14,7 +14,7 @@ import withDialogActions from 'containers/Dialog/withDialogActions';
|
||||
import withAlertsActions from 'containers/Alert/withAlertActions';
|
||||
import withDrawerActions from 'containers/Drawer/withDrawerActions';
|
||||
|
||||
import { Icon, FormattedMessage as T } from 'components';
|
||||
import { Icon, FormattedMessage as T, MoreMenuItems } from 'components';
|
||||
import { useReceiptDetailDrawerContext } from './ReceiptDetailDrawerProvider';
|
||||
|
||||
import { safeCallback, compose } from 'utils';
|
||||
@@ -46,6 +46,11 @@ function ReceiptDetailActionBar({
|
||||
const onPrintReceipt = () => {
|
||||
openDialog('receipt-pdf-preview', { receiptId });
|
||||
};
|
||||
|
||||
// Handle notify via SMS.
|
||||
const handleNotifyViaSMS = () => {
|
||||
openDialog('notify-receipt-via-sms', { receiptId });
|
||||
};
|
||||
return (
|
||||
<DashboardActionsBar>
|
||||
<NavbarGroup>
|
||||
@@ -69,6 +74,12 @@ function ReceiptDetailActionBar({
|
||||
intent={Intent.DANGER}
|
||||
onClick={safeCallback(onDeleteReceipt)}
|
||||
/>
|
||||
<NavbarDivider />
|
||||
<MoreMenuItems
|
||||
payload={{
|
||||
onNotifyViaSMS: handleNotifyViaSMS,
|
||||
}}
|
||||
/>
|
||||
</NavbarGroup>
|
||||
</DashboardActionsBar>
|
||||
);
|
||||
|
||||
42
src/containers/NotifyViaSMS/NotifyViaSMSForm.js
Normal file
42
src/containers/NotifyViaSMS/NotifyViaSMSForm.js
Normal file
@@ -0,0 +1,42 @@
|
||||
import React from 'react';
|
||||
import { Formik, Form } from 'formik';
|
||||
|
||||
import 'style/pages/NotifyConactViaSMS/NotifyConactViaSMSDialog.scss';
|
||||
|
||||
import { CreateNotifyViaSMSFormSchema } from './NotifyViaSMSForm.schema';
|
||||
import NotifyViaSMSFormFields from './NotifyViaSMSFormFields';
|
||||
import NotifyViaSMSFormFloatingActions from './NotifyViaSMSFormFloatingActions';
|
||||
|
||||
import { transformToForm, saveInvoke } from 'utils';
|
||||
|
||||
const defaultInitialValues = {
|
||||
customer_name: '',
|
||||
customer_personal_phone: '',
|
||||
sms_message: '',
|
||||
};
|
||||
|
||||
/**
|
||||
* Notify Via SMS Form.
|
||||
*/
|
||||
function NotifyViaSMSForm({ onSubmit, NotificationDetail, NotificationName }) {
|
||||
// Initial form values
|
||||
const initialValues = {
|
||||
...defaultInitialValues,
|
||||
...transformToForm(NotificationDetail, defaultInitialValues),
|
||||
};
|
||||
|
||||
return (
|
||||
<Formik
|
||||
validationSchema={CreateNotifyViaSMSFormSchema}
|
||||
initialValues={initialValues}
|
||||
onSubmit={onSubmit}
|
||||
>
|
||||
<Form>
|
||||
<NotifyViaSMSFormFields />
|
||||
<NotifyViaSMSFormFloatingActions dialogName={NotificationName} />
|
||||
</Form>
|
||||
</Formik>
|
||||
);
|
||||
}
|
||||
|
||||
export default NotifyViaSMSForm;
|
||||
@@ -8,4 +8,4 @@ const Schema = Yup.object().shape({
|
||||
sms_message: Yup.string().required().trim().max(DATATYPES_LENGTH.TEXT),
|
||||
});
|
||||
|
||||
export const CreateNotifyContactViaSMSFormSchema = Schema;
|
||||
export const CreateNotifyViaSMSFormSchema = Schema;
|
||||
@@ -2,25 +2,13 @@ import React from 'react';
|
||||
import { FastField, ErrorMessage } from 'formik';
|
||||
import { FormattedMessage as T } from 'components';
|
||||
|
||||
import { useAutofocus } from 'hooks';
|
||||
import {
|
||||
Classes,
|
||||
FormGroup,
|
||||
TextArea,
|
||||
Intent,
|
||||
InputGroup,
|
||||
} from '@blueprintjs/core';
|
||||
import { Classes, FormGroup, TextArea, InputGroup } from '@blueprintjs/core';
|
||||
import classNames from 'classnames';
|
||||
import { CLASSES } from 'common/classes';
|
||||
import { inputIntent } from 'utils';
|
||||
import { FieldRequiredHint } from 'components';
|
||||
|
||||
import { useNotifyContactViaSMSContext } from './NotifyContactViaSMSFormProvider';
|
||||
|
||||
/**
|
||||
* Notify contact via SMS fields.
|
||||
*/
|
||||
function NotifyContactViaSMSFormFields() {
|
||||
function NotifyViaSMSFormFields() {
|
||||
return (
|
||||
<div className={Classes.DIALOG_BODY}>
|
||||
{/* ----------- Send Notification to ----------- */}
|
||||
@@ -88,4 +76,4 @@ function NotifyContactViaSMSFormFields() {
|
||||
);
|
||||
}
|
||||
|
||||
export default NotifyContactViaSMSFormFields;
|
||||
export default NotifyViaSMSFormFields;
|
||||
@@ -1,21 +1,20 @@
|
||||
import React from 'react';
|
||||
import { Intent, Button, Classes } from '@blueprintjs/core';
|
||||
import { useFormikContext } from 'formik';
|
||||
import { Intent, Button, Classes } from '@blueprintjs/core';
|
||||
|
||||
import { FormattedMessage as T } from 'components';
|
||||
|
||||
import { useNotifyContactViaSMSContext } from './NotifyContactViaSMSFormProvider';
|
||||
import withDialogActions from 'containers/Dialog/withDialogActions';
|
||||
import { compose } from 'utils';
|
||||
|
||||
function NotifyContactViaSMSFormFloatingActions({
|
||||
function NotifyViaSMSFormFloatingActions({
|
||||
// #withDialogActions
|
||||
closeDialog,
|
||||
dialogName,
|
||||
}) {
|
||||
// Formik context.
|
||||
const { isSubmitting } = useFormikContext();
|
||||
|
||||
const { dialogName } = useNotifyContactViaSMSContext();
|
||||
|
||||
// Handle close button click.
|
||||
const handleCancelBtnClick = () => {
|
||||
closeDialog(dialogName);
|
||||
@@ -39,7 +38,4 @@ function NotifyContactViaSMSFormFloatingActions({
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default compose(withDialogActions)(
|
||||
NotifyContactViaSMSFormFloatingActions,
|
||||
);
|
||||
export default compose(withDialogActions)(NotifyViaSMSFormFloatingActions);
|
||||
Reference in New Issue
Block a user