mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-19 22:30:31 +00:00
fix: SMS message templates.
This commit is contained in:
@@ -1,28 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { useFormikContext } from 'formik';
|
|
||||||
|
|
||||||
import { Intent, Button, Classes } from '@blueprintjs/core';
|
|
||||||
import { FormattedMessage as T } from 'components';
|
|
||||||
import { useHistory } from 'react-router-dom';
|
|
||||||
|
|
||||||
function SMSMessageTemplateFloatingAction() {
|
|
||||||
const history = useHistory();
|
|
||||||
const { isSubmitting } = useFormikContext();
|
|
||||||
|
|
||||||
const handleCloseClick = () => {
|
|
||||||
history.go(-1);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className={'card__footer'}>
|
|
||||||
<Button intent={Intent.PRIMARY} loading={isSubmitting} type="submit">
|
|
||||||
<T id={'save'} />
|
|
||||||
</Button>
|
|
||||||
<Button onClick={handleCloseClick} disabled={isSubmitting}>
|
|
||||||
<T id={'close'} />
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default SMSMessageTemplateFloatingAction;
|
|
||||||
@@ -1,57 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { Formik, Form } from 'formik';
|
|
||||||
import { Intent } from '@blueprintjs/core';
|
|
||||||
import intl from 'react-intl-universal';
|
|
||||||
import classNames from 'classnames';
|
|
||||||
import { CLASSES } from 'common/classes';
|
|
||||||
|
|
||||||
import { CreateSMSMessageTemplateSchema } from './SMSMessageTemplateForm.schema';
|
|
||||||
import SMSMessageTemplateFormContent from './SMSMessageTemplateFormContent';
|
|
||||||
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
|
|
||||||
|
|
||||||
import { compose } from 'utils';
|
|
||||||
|
|
||||||
export const defaultInitialValues = {
|
|
||||||
entries: [
|
|
||||||
{
|
|
||||||
notification: '',
|
|
||||||
service: '',
|
|
||||||
message: '',
|
|
||||||
auto: true,
|
|
||||||
switch: true,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
};
|
|
||||||
|
|
||||||
function SMSMessageTemplateForm({
|
|
||||||
// #withDashboardActions
|
|
||||||
changePreferencesPageTitle,
|
|
||||||
}) {
|
|
||||||
// Form initial values.
|
|
||||||
const initialValues = {
|
|
||||||
...defaultInitialValues,
|
|
||||||
};
|
|
||||||
|
|
||||||
React.useEffect(() => {
|
|
||||||
changePreferencesPageTitle(
|
|
||||||
intl.get('sms_message_template.label.sms_messages_template'),
|
|
||||||
);
|
|
||||||
}, [changePreferencesPageTitle]);
|
|
||||||
|
|
||||||
// Handles form submit.
|
|
||||||
const handleSubmit = (values, { setSubmitting, setErrors, resetForm }) => {};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className={classNames(CLASSES.PAGE_FORM, CLASSES.PAGE_FORM_STRIP_STYLE)}
|
|
||||||
>
|
|
||||||
<Formik
|
|
||||||
validationSchema={CreateSMSMessageTemplateSchema}
|
|
||||||
initialValues={initialValues}
|
|
||||||
onSubmit={handleSubmit}
|
|
||||||
component={SMSMessageTemplateFormContent}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
export default compose(withDashboardActions)(SMSMessageTemplateForm);
|
|
||||||
@@ -1,19 +0,0 @@
|
|||||||
import * as Yup from 'yup';
|
|
||||||
import intl from 'react-intl-universal';
|
|
||||||
import { DATATYPES_LENGTH } from 'common/dataTypes';
|
|
||||||
import { isBlank } from 'utils';
|
|
||||||
|
|
||||||
const Schema = Yup.object().shape({
|
|
||||||
|
|
||||||
entries: Yup.array().of(
|
|
||||||
Yup.object().shape({
|
|
||||||
notification: Yup.string().nullable(),
|
|
||||||
service: Yup.number().nullable(),
|
|
||||||
message: Yup.string().max(DATATYPES_LENGTH.TEXT).nullable(),
|
|
||||||
auto:Yup.boolean(),
|
|
||||||
switch:Yup.boolean(),
|
|
||||||
|
|
||||||
}),
|
|
||||||
),
|
|
||||||
})
|
|
||||||
export const CreateSMSMessageTemplateSchema = Schema;
|
|
||||||
@@ -1,23 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { FastField } from 'formik';
|
|
||||||
|
|
||||||
import SMSMessageTemplatesEntriesTable from './SMSMessageTemplatesEntriesTable';
|
|
||||||
|
|
||||||
export default function SMSMessageTemplateFormBody() {
|
|
||||||
return (
|
|
||||||
<FastField name={'entries'}>
|
|
||||||
{({
|
|
||||||
form: { values, setFieldValue },
|
|
||||||
field: { value },
|
|
||||||
meta: { error, touched },
|
|
||||||
}) => (
|
|
||||||
<SMSMessageTemplatesEntriesTable
|
|
||||||
entries={value}
|
|
||||||
onUpdateData={(newEntries) => {
|
|
||||||
setFieldValue('entries', newEntries);
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</FastField>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -1,16 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { Form } from 'formik';
|
|
||||||
import classNames from 'classnames';
|
|
||||||
import { CLASSES } from 'common/classes';
|
|
||||||
|
|
||||||
import SMSMessageTemplateFormBody from './SMSMessageTemplateFormBody';
|
|
||||||
import SMSMessageTemplateFloatingAction from './SMSMessageTemplateFloatingAction';
|
|
||||||
|
|
||||||
export default function SMSMessageTemplateFormContent() {
|
|
||||||
return (
|
|
||||||
<Form>
|
|
||||||
<SMSMessageTemplateFormBody />
|
|
||||||
<SMSMessageTemplateFloatingAction />
|
|
||||||
</Form>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -1,68 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import intl from 'react-intl-universal';
|
|
||||||
import {
|
|
||||||
InputGroupCell,
|
|
||||||
TextAreaCell,
|
|
||||||
SwitchFieldCell,
|
|
||||||
} from 'components/DataTableCells';
|
|
||||||
import { DataTableEditable } from 'components';
|
|
||||||
import { compose, updateTableCell } from 'utils';
|
|
||||||
|
|
||||||
export default function SMSMessageTemplatesEntriesTable({
|
|
||||||
onUpdateData,
|
|
||||||
entries,
|
|
||||||
}) {
|
|
||||||
const columns = React.useMemo(() => [
|
|
||||||
{
|
|
||||||
Header: intl.get('sms_message_template.label_Notification'),
|
|
||||||
accessor: 'notification',
|
|
||||||
Cell: InputGroupCell,
|
|
||||||
disableSortBy: true,
|
|
||||||
width: '150',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Header: intl.get('service'),
|
|
||||||
accessor: 'service',
|
|
||||||
Cell: InputGroupCell,
|
|
||||||
disableSortBy: true,
|
|
||||||
width: '150',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Header: intl.get('sms_message_template.label_mesage'),
|
|
||||||
accessor: 'message',
|
|
||||||
// Cell: TextAreaCell,
|
|
||||||
Cell: InputGroupCell,
|
|
||||||
disableSortBy: true,
|
|
||||||
width: '150',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Header: intl.get('sms_message_template.label_auto'),
|
|
||||||
accessor: 'auto',
|
|
||||||
Cell: SwitchFieldCell,
|
|
||||||
disableSortBy: true,
|
|
||||||
disableResizing: true,
|
|
||||||
width: '120',
|
|
||||||
},
|
|
||||||
]);
|
|
||||||
|
|
||||||
const handleUpdateData = React.useCallback(
|
|
||||||
(rowIndex, columnId, value) => {
|
|
||||||
const newRows = compose(updateTableCell(rowIndex, columnId, value))(
|
|
||||||
entries,
|
|
||||||
);
|
|
||||||
onUpdateData(newRows);
|
|
||||||
},
|
|
||||||
[onUpdateData, entries],
|
|
||||||
);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<DataTableEditable
|
|
||||||
columns={columns}
|
|
||||||
data={entries}
|
|
||||||
payload={{
|
|
||||||
errors: [],
|
|
||||||
updateData: handleUpdateData,
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -1,14 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { SMSMessageTemplateProvider } from './SMSMessageTemplateProvider';
|
|
||||||
import SMSMessageTemplateForm from './SMSMessageTemplateForm';
|
|
||||||
|
|
||||||
/**
|
|
||||||
* SMS message template.
|
|
||||||
*/
|
|
||||||
export default function SMSMessageTemplates() {
|
|
||||||
return (
|
|
||||||
<SMSMessageTemplateProvider>
|
|
||||||
<SMSMessageTemplateForm />
|
|
||||||
</SMSMessageTemplateProvider>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,54 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import intl from 'react-intl-universal';
|
||||||
|
import {
|
||||||
|
DataTableEditable,
|
||||||
|
DataTable,
|
||||||
|
DashboardContentTable,
|
||||||
|
} from 'components';
|
||||||
|
import TableSkeletonRows from 'components/Datatable/TableSkeletonRows';
|
||||||
|
|
||||||
|
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
|
||||||
|
|
||||||
|
import { useSMSMessagesTemplatesTableColumns } from './components';
|
||||||
|
|
||||||
|
import { compose } from 'utils';
|
||||||
|
|
||||||
|
function SMSMessagesTemplatesDataTable({
|
||||||
|
// #withDashboardActions
|
||||||
|
changePreferencesPageTitle,
|
||||||
|
}) {
|
||||||
|
// Table columns.
|
||||||
|
const columns = useSMSMessagesTemplatesTableColumns();
|
||||||
|
|
||||||
|
React.useEffect(() => {
|
||||||
|
changePreferencesPageTitle(
|
||||||
|
intl.get('sms_message_template.label.sms_messages_template'),
|
||||||
|
);
|
||||||
|
}, [changePreferencesPageTitle]);
|
||||||
|
|
||||||
|
const DATA = [
|
||||||
|
{
|
||||||
|
notification: 'notification',
|
||||||
|
service: 'service',
|
||||||
|
message: 'message',
|
||||||
|
auto: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
notification: 'notification',
|
||||||
|
service: 'service',
|
||||||
|
message: 'message',
|
||||||
|
auto: false,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
return (
|
||||||
|
<DataTableEditable
|
||||||
|
columns={columns}
|
||||||
|
data={[]}
|
||||||
|
// loading={}
|
||||||
|
// progressBarLoading={}
|
||||||
|
TableLoadingRenderer={TableSkeletonRows}
|
||||||
|
noInitialFetch={true}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
export default compose(withDashboardActions)(SMSMessagesTemplatesDataTable);
|
||||||
@@ -1,17 +1,14 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import { CLASSES } from 'common/classes';
|
import { CLASSES } from 'common/classes';
|
||||||
import { useSettings, useSaveSettings } from 'hooks/query';
|
import { useSettings } from 'hooks/query';
|
||||||
|
|
||||||
import PreferencesPageLoader from '../PreferencesPageLoader';
|
const SMSMessagesTemplatesContext = React.createContext();
|
||||||
|
|
||||||
const SMSMessageTemplateContext = React.createContext();
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* SMS message template provider.
|
* SMS message templates provider.
|
||||||
*/
|
*/
|
||||||
function SMSMessageTemplateProvider({ ...props }) {
|
function SMSMessagesTemplatesProvider({ ...props }) {
|
||||||
|
|
||||||
//Fetches Organization Settings.
|
//Fetches Organization Settings.
|
||||||
const { isLoading: isSettingsLoading } = useSettings();
|
const { isLoading: isSettingsLoading } = useSettings();
|
||||||
|
|
||||||
@@ -26,17 +23,13 @@ function SMSMessageTemplateProvider({ ...props }) {
|
|||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<div className={classNames(CLASSES.CARD)}>
|
<div className={classNames(CLASSES.CARD)}>
|
||||||
{isSettingsLoading ? (
|
<SMSMessagesTemplatesContext.Provider value={provider} {...props} />
|
||||||
<PreferencesPageLoader />
|
|
||||||
) : (
|
|
||||||
<SMSMessageTemplateContext.Provider value={provider} {...props} />
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
const useSMSMessageTemplateContext = () =>
|
const useSMSMessageTemplateContext = () =>
|
||||||
React.useContext(SMSMessageTemplateContext);
|
React.useContext(SMSMessagesTemplatesContext);
|
||||||
|
|
||||||
export { SMSMessageTemplateProvider, useSMSMessageTemplateContext };
|
export { SMSMessagesTemplatesProvider, useSMSMessageTemplateContext };
|
||||||
@@ -0,0 +1,40 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import intl from 'react-intl-universal';
|
||||||
|
|
||||||
|
import {
|
||||||
|
InputGroupCell,
|
||||||
|
TextAreaCell,
|
||||||
|
SwitchFieldCell,
|
||||||
|
} from 'components/DataTableCells';
|
||||||
|
|
||||||
|
export function useSMSMessagesTemplatesTableColumns() {
|
||||||
|
return React.useMemo(() => [
|
||||||
|
{
|
||||||
|
Header: intl.get('sms_message_template.label_Notification'),
|
||||||
|
accessor: 'notification',
|
||||||
|
className: 'notification',
|
||||||
|
width: '150',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
Header: intl.get('service'),
|
||||||
|
accessor: 'service',
|
||||||
|
className: 'service',
|
||||||
|
width: '100',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
Header: intl.get('sms_message_template.label_mesage'),
|
||||||
|
accessor: 'message',
|
||||||
|
className: 'message',
|
||||||
|
width: '180',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
Header: intl.get('sms_message_template.label_auto'),
|
||||||
|
accessor: 'auto',
|
||||||
|
Cell: SwitchFieldCell,
|
||||||
|
className: 'auto',
|
||||||
|
disableSortBy: true,
|
||||||
|
disableResizing: true,
|
||||||
|
width: '80',
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
}
|
||||||
15
src/containers/Preferences/SMSMessagesTemplates/index.js
Normal file
15
src/containers/Preferences/SMSMessagesTemplates/index.js
Normal file
@@ -0,0 +1,15 @@
|
|||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
import { SMSMessagesTemplatesProvider } from './SMSMessagesTemplatesProvider';
|
||||||
|
import SMSMessagesTemplatesDataTable from './SMSMessagesTemplatesDataTable';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* SMS messages templates.
|
||||||
|
*/
|
||||||
|
export default function SMSMessagesTemplates() {
|
||||||
|
return (
|
||||||
|
<SMSMessagesTemplatesProvider>
|
||||||
|
<SMSMessagesTemplatesDataTable />
|
||||||
|
</SMSMessagesTemplatesProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -4,7 +4,7 @@ import Accountant from 'containers/Preferences/Accountant/Accountant';
|
|||||||
// import Accounts from 'containers/Preferences/Accounts/Accounts';
|
// import Accounts from 'containers/Preferences/Accounts/Accounts';
|
||||||
import Currencies from 'containers/Preferences/Currencies/Currencies';
|
import Currencies from 'containers/Preferences/Currencies/Currencies';
|
||||||
import Item from 'containers/Preferences/Item';
|
import Item from 'containers/Preferences/Item';
|
||||||
import SMSMessageTemplates from '../containers/Preferences/SMSMessageTemplates';
|
import SMSMessagesTemplates from '../containers/Preferences/SMSMessagesTemplates';
|
||||||
import DefaultRoute from '../containers/Preferences/DefaultRoute';
|
import DefaultRoute from '../containers/Preferences/DefaultRoute';
|
||||||
|
|
||||||
const BASE_URL = '/preferences';
|
const BASE_URL = '/preferences';
|
||||||
@@ -37,7 +37,7 @@ export default [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: `${BASE_URL}/sms-message`,
|
path: `${BASE_URL}/sms-message`,
|
||||||
component: SMSMessageTemplates,
|
component: SMSMessagesTemplates,
|
||||||
exact: true,
|
exact: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|||||||
Reference in New Issue
Block a user