diff --git a/packages/webapp/src/constants/preferencesMenu.tsx b/packages/webapp/src/constants/preferencesMenu.tsx index 562cce1b1..2a7377bf0 100644 --- a/packages/webapp/src/constants/preferencesMenu.tsx +++ b/packages/webapp/src/constants/preferencesMenu.tsx @@ -12,10 +12,22 @@ export default [ text: , href: '/preferences/users', }, + { + text: 'Estimates', + href: '/preferences/estimates', + }, { text: 'Invoices', href: '/preferences/invoices', }, + { + text: 'Receipts', + href: '/preferences/receipts', + }, + { + text: 'Credit Notes', + href: '/preferences/credit-notes', + }, { text: , href: '/preferences/currencies', diff --git a/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotes.tsx b/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotes.tsx index ee1753398..d5d43c86a 100644 --- a/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotes.tsx +++ b/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotes.tsx @@ -1,14 +1,14 @@ // @ts-nocheck import { PreferencesCreditNotesBoot } from './PreferencesCreditNotesFormBoot'; -import PreferencesInvoiceFormPage from './PreferencesCreditNotesFormPage'; +import { PreferencesCreditNotesFormPage } from './PreferencesCreditNotesFormPage'; /** * items preferences. */ -export default function PreferencesCreditNotes() { +export function PreferencesCreditNotes() { return ( - + ); } diff --git a/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesForm.schema.ts b/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesForm.schema.ts index b6cf3eab6..0e3901591 100644 --- a/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesForm.schema.ts +++ b/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesForm.schema.ts @@ -6,4 +6,4 @@ const Schema = Yup.object().shape({ customerNotes: Yup.string().optional(), }); -export const PreferencesEstimatesFormSchema = Schema; +export const PreferencesCreditNotesFormSchema = Schema; diff --git a/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesForm.tsx b/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesForm.tsx index 17fc18c0d..2796a04a0 100644 --- a/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesForm.tsx +++ b/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesForm.tsx @@ -27,7 +27,7 @@ export function PreferencesCreditNotesForm({ isSubmitting }) { {/* ---------- Terms & Conditions ---------- */} } + label={} labelInfo={} fastField={true} > @@ -42,7 +42,7 @@ export function PreferencesCreditNotesForm({ isSubmitting }) { {/* ---------- Customer Notes ---------- */} } + label={} fastField={true} > - {isLoading ? ( - - ) : ( - - )} + + {isLoading ? ( + + ) : ( + + )} + ); } +const PreferencesCreditNotesCard = styled(Card)` + padding: 25px; + + .bp4-form-group { + max-width: 600px; + } +`; + const usePreferencesCreditNotesFormContext = () => React.useContext(PreferencesCreditNotesFormContext); diff --git a/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesFormPage.tsx b/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesFormPage.tsx index 045ffbbc5..4121c7d98 100644 --- a/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesFormPage.tsx +++ b/packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesFormPage.tsx @@ -6,7 +6,7 @@ import { Intent } from '@blueprintjs/core'; import { AppToaster } from '@/components'; import { PreferencesCreditNotesFormSchema } from './PreferencesCreditNotesForm.schema'; -import { usePreferencesInvoiceFormContext } from './PreferencesCreditNotesFormBoot'; +import { usePreferencesCreditNotesFormContext } from './PreferencesCreditNotesFormBoot'; import { PreferencesCreditNotesForm } from './PreferencesCreditNotesForm'; import withDashboardActions from '@/containers/Dashboard/withDashboardActions'; @@ -18,16 +18,16 @@ const defaultValues = { }; /** - * Preferences - . + * Preferences - Credit Notes. */ function PreferencesCreditNotesFormPageRoot({ // #withDashboardActions changePreferencesPageTitle, }) { - const { organization } = usePreferencesInvoiceFormContext(); + const { organization } = usePreferencesCreditNotesFormContext(); useEffect(() => { - changePreferencesPageTitle(intl.get('preferences.estimates')); + changePreferencesPageTitle(intl.get('preferences.creditNotes')); }, [changePreferencesPageTitle]); // Initial values. diff --git a/packages/webapp/src/containers/Preferences/Estimates/PreferencesEstimates.tsx b/packages/webapp/src/containers/Preferences/Estimates/PreferencesEstimates.tsx index 2b5af6bdf..d7a8b484d 100644 --- a/packages/webapp/src/containers/Preferences/Estimates/PreferencesEstimates.tsx +++ b/packages/webapp/src/containers/Preferences/Estimates/PreferencesEstimates.tsx @@ -1,14 +1,14 @@ // @ts-nocheck import { PreferencesEstimatesBoot } from './PreferencesEstimatesFormBoot'; -import PreferencesInvoiceFormPage from './PreferencesEstimatesFormPage'; +import { PreferencesEstimatesFormPage } from './PreferencesEstimatesFormPage'; /** - * items preferences. + * Estimates preferences. */ -export default function PreferencesEstimates() { +export function PreferencesEstimates() { return ( - + ); } diff --git a/packages/webapp/src/containers/Preferences/Estimates/PreferencesEstimatesFormPage.tsx b/packages/webapp/src/containers/Preferences/Estimates/PreferencesEstimatesFormPage.tsx index b74279741..6dedd912b 100644 --- a/packages/webapp/src/containers/Preferences/Estimates/PreferencesEstimatesFormPage.tsx +++ b/packages/webapp/src/containers/Preferences/Estimates/PreferencesEstimatesFormPage.tsx @@ -6,7 +6,7 @@ import { Intent } from '@blueprintjs/core'; import { AppToaster } from '@/components'; import { PreferencesEstimatesFormSchema } from './PreferencesEstimatesForm.schema'; -import { usePreferencesInvoiceFormContext } from './PreferencesEstimatesFormBoot'; +import { usePreferencesEstimatesFormContext } from './PreferencesEstimatesFormBoot'; import { PreferencesEstimatesForm } from './PreferencesEstimatesForm'; import withDashboardActions from '@/containers/Dashboard/withDashboardActions'; @@ -24,7 +24,7 @@ function PreferencesEstimatesFormPageRoot({ // #withDashboardActions changePreferencesPageTitle, }) { - const { organization } = usePreferencesInvoiceFormContext(); + const { organization } = usePreferencesEstimatesFormContext(); useEffect(() => { changePreferencesPageTitle(intl.get('preferences.estimates')); diff --git a/packages/webapp/src/containers/Preferences/Invoices/PreferencesInvoiceFormBoot.tsx b/packages/webapp/src/containers/Preferences/Invoices/PreferencesInvoiceFormBoot.tsx index b4983531a..03d9a31a4 100644 --- a/packages/webapp/src/containers/Preferences/Invoices/PreferencesInvoiceFormBoot.tsx +++ b/packages/webapp/src/containers/Preferences/Invoices/PreferencesInvoiceFormBoot.tsx @@ -1,9 +1,11 @@ // @ts-nocheck import React from 'react'; import classNames from 'classnames'; +import styled from 'styled-components'; import { CLASSES } from '@/constants/classes'; import { useSettings } from '@/hooks/query'; import PreferencesPageLoader from '../PreferencesPageLoader'; +import { Card } from '@/components'; const PreferencesInvoiceFormContext = React.createContext(); @@ -26,15 +28,25 @@ function PreferencesInvoicesBoot({ ...props }) { CLASSES.PREFERENCES_PAGE_INSIDE_CONTENT_ACCOUNTANT, )} > - {isLoading ? ( - - ) : ( - - )} + + {isLoading ? ( + + ) : ( + + )} + ); } +const PreferencesInvoicesCard = styled(Card)` + padding: 25px; + + .bp4-form-group{ + max-width: 600px; + } +`; + const usePreferencesInvoiceFormContext = () => React.useContext(PreferencesInvoiceFormContext); diff --git a/packages/webapp/src/containers/Preferences/Invoices/PreferencesInvoiceFormPage.tsx b/packages/webapp/src/containers/Preferences/Invoices/PreferencesInvoiceFormPage.tsx index ddf74b02f..6c364cb7e 100644 --- a/packages/webapp/src/containers/Preferences/Invoices/PreferencesInvoiceFormPage.tsx +++ b/packages/webapp/src/containers/Preferences/Invoices/PreferencesInvoiceFormPage.tsx @@ -7,7 +7,7 @@ import { Intent } from '@blueprintjs/core'; import { AppToaster } from '@/components'; import { PreferencesInvoiceFormSchema } from './PreferencesInvoiceForm.schema'; import { usePreferencesInvoiceFormContext } from './PreferencesInvoiceFormBoot'; -import { PreferencesGeneralForm } from './PreferencesInvoicesForm'; +import { PreferencesInvoicesForm } from './PreferencesInvoicesForm'; import withDashboardActions from '@/containers/Dashboard/withDashboardActions'; import { compose, transformToForm } from '@/utils'; @@ -59,7 +59,7 @@ function PreferencesInvoiceFormPage({ initialValues={initialValues} validationSchema={PreferencesInvoiceFormSchema} onSubmit={handleFormSubmit} - component={PreferencesGeneralForm} + component={PreferencesInvoicesForm} /> ); } diff --git a/packages/webapp/src/containers/Preferences/Invoices/PreferencesInvoicesForm.tsx b/packages/webapp/src/containers/Preferences/Invoices/PreferencesInvoicesForm.tsx index 0e2b44f51..5beec5e0c 100644 --- a/packages/webapp/src/containers/Preferences/Invoices/PreferencesInvoicesForm.tsx +++ b/packages/webapp/src/containers/Preferences/Invoices/PreferencesInvoicesForm.tsx @@ -5,17 +5,15 @@ import { Button, Intent } from '@blueprintjs/core'; import { useHistory } from 'react-router-dom'; import { - FieldRequiredHint, FormattedMessage as T, FFormGroup, - FInputGroup, FTextArea, } from '@/components'; /** * Preferences general form. */ -export function PreferencesGeneralForm({ isSubmitting }) { +export function PreferencesInvoicesForm({ isSubmitting }) { const history = useHistory(); // Handle close click. @@ -29,7 +27,6 @@ export function PreferencesGeneralForm({ isSubmitting }) { } - labelInfo={} fastField={true} > + + + ); +} diff --git a/packages/webapp/src/containers/Preferences/Receipts/PreferencesReceiptsForm.schema.ts b/packages/webapp/src/containers/Preferences/Receipts/PreferencesReceiptsForm.schema.ts new file mode 100644 index 000000000..f28cc9407 --- /dev/null +++ b/packages/webapp/src/containers/Preferences/Receipts/PreferencesReceiptsForm.schema.ts @@ -0,0 +1,9 @@ +// @ts-nocheck +import * as Yup from 'yup'; + +const Schema = Yup.object().shape({ + termsConditions: Yup.string().optional(), + customerNotes: Yup.string().optional(), +}); + +export const PreferencesReceiptsFormSchema = Schema; diff --git a/packages/webapp/src/containers/Preferences/Receipts/PreferencesReceiptsForm.tsx b/packages/webapp/src/containers/Preferences/Receipts/PreferencesReceiptsForm.tsx new file mode 100644 index 000000000..05004c3c5 --- /dev/null +++ b/packages/webapp/src/containers/Preferences/Receipts/PreferencesReceiptsForm.tsx @@ -0,0 +1,78 @@ +// @ts-nocheck +import styled from 'styled-components'; +import { Form } from 'formik'; +import { Button, Intent } from '@blueprintjs/core'; +import { useHistory } from 'react-router-dom'; + +import { + FormattedMessage as T, + FFormGroup, + FTextArea, +} from '@/components'; + +/** + * Preferences general form. + */ +export function PreferencesReceiptsForm({ isSubmitting }) { + const history = useHistory(); + + // Handle close click. + const handleCloseClick = () => { + history.go(-1); + }; + + return ( +
+ {/* ---------- Terms & Conditions ---------- */} + } + fastField={true} + > + + + + {/* ---------- Customer Notes ---------- */} + } + fastField={true} + > + + + + + + + +
+ ); +} + +const CardFooterActions = styled.div` + padding-top: 16px; + border-top: 1px solid #e0e7ea; + margin-top: 30px; + + .bp4-button { + min-width: 70px; + + + .bp4-button { + margin-left: 10px; + } + } +`; diff --git a/packages/webapp/src/containers/Preferences/Receipts/PreferencesReceiptsFormBoot.tsx b/packages/webapp/src/containers/Preferences/Receipts/PreferencesReceiptsFormBoot.tsx new file mode 100644 index 000000000..1c2244eda --- /dev/null +++ b/packages/webapp/src/containers/Preferences/Receipts/PreferencesReceiptsFormBoot.tsx @@ -0,0 +1,56 @@ +// @ts-nocheck +import React from 'react'; +import classNames from 'classnames'; +import styled from 'styled-components'; +import { CLASSES } from '@/constants/classes'; +import { useSettings } from '@/hooks/query'; +import PreferencesPageLoader from '../PreferencesPageLoader'; +import { Card } from '@/components'; + +const PreferencesReceiptsFormContext = React.createContext(); + +function PreferencesReceiptsBoot({ ...props }) { + // Fetches organization settings. + const { isLoading: isSettingsLoading } = useSettings(); + + // Provider state. + const provider = { + organization: {}, + }; + + // Detarmines whether if any query is loading. + const isLoading = isSettingsLoading; + + return ( +
+ + {isLoading ? ( + + ) : ( + + )} + +
+ ); +} + +const PreferencesReceiptsCard = styled(Card)` + padding: 25px; + + .bp4-form-group { + max-width: 600px; + } +`; + +const usePreferencesReceiptsFormContext = () => + React.useContext(PreferencesReceiptsFormContext); + +export { PreferencesReceiptsBoot, usePreferencesReceiptsFormContext }; diff --git a/packages/webapp/src/containers/Preferences/Receipts/PreferencesReceiptsFormPage.tsx b/packages/webapp/src/containers/Preferences/Receipts/PreferencesReceiptsFormPage.tsx new file mode 100644 index 000000000..0033f1187 --- /dev/null +++ b/packages/webapp/src/containers/Preferences/Receipts/PreferencesReceiptsFormPage.tsx @@ -0,0 +1,69 @@ +// @ts-nocheck +import React, { useEffect } from 'react'; +import intl from 'react-intl-universal'; +import { Formik } from 'formik'; +import { Intent } from '@blueprintjs/core'; + +import { AppToaster } from '@/components'; +import { PreferencesReceiptsFormSchema } from './PreferencesReceiptsForm.schema'; +import { usePreferencesReceiptsFormContext } from './PreferencesReceiptsFormBoot'; +import { PreferencesReceiptsForm } from './PreferencesReceiptsForm'; +import withDashboardActions from '@/containers/Dashboard/withDashboardActions'; + +import { compose, transformToForm } from '@/utils'; + +const defaultValues = { + termsConditions: '', + customerNotes: '', +}; + +/** + * Preferences - Receipts. + */ +function PreferencesReceiptsFormPageRoot({ + // #withDashboardActions + changePreferencesPageTitle, +}) { + const { organization } = usePreferencesReceiptsFormContext(); + + useEffect(() => { + changePreferencesPageTitle(intl.get('preferences.receipts')); + }, [changePreferencesPageTitle]); + + // Initial values. + const initialValues = { + ...defaultValues, + ...transformToForm(organization.metadata, defaultValues), + }; + // Handle the form submit. + const handleFormSubmit = (values, { setSubmitting }) => { + // Handle request success. + const onSuccess = (response) => { + AppToaster.show({ + message: intl.get('preferences.receipts.success_message'), + intent: Intent.SUCCESS, + }); + setSubmitting(false); + }; + // Handle request error. + const onError = () => { + setSubmitting(false); + }; + // updateOrganization({ ...values }) + // .then(onSuccess) + // .catch(onError); + }; + + return ( + + ); +} + +export const PreferencesReceiptsFormPage = compose(withDashboardActions)( + PreferencesReceiptsFormPageRoot, +); diff --git a/packages/webapp/src/lang/en/index.json b/packages/webapp/src/lang/en/index.json index f67a6f478..1832b3a5f 100644 --- a/packages/webapp/src/lang/en/index.json +++ b/packages/webapp/src/lang/en/index.json @@ -2070,7 +2070,7 @@ "project_task.dialog.edit_success_message": "The task has been edited successfully.", "project_task.action.edit_task": "Edit Task", "project_task.action.delete_task": "Delete Task", -"project_task.rate": "{rate} / hour", + "project_task.rate": "{rate} / hour", "project_task.fixed_price": "Fixed price", "project_task.non_chargable": "Non-chargeable", "project_task.estimate_hours": "• {estimate_hours}h 0m estimated", @@ -2293,5 +2293,19 @@ "global_error.too_many_requests": "Too many requests", "pref.invoices.termsConditions.field": "Terms & Conditions", - "pref.invoices.customerNotes.field": "Customer Notes" -} + "pref.invoices.customerNotes.field": "Customer Notes", + + "pref.creditNotes.termsConditions.field": "Terms & Conditions", + "pref.creditNotes.customerNotes.field": "Customer Notes", + + "pref.estimates.termsConditions.field": "Terms & Conditions", + "pref.estimates.customerNotes.field": "Customer Notes", + + "pref.receipts.termsConditions.field": "Terms & Conditions", + "pref.receipts.customerNotes.field": "Customer Notes", + + "preferences.invoices": "Invoices", + "preferences.estimates": "Estimates", + "preferences.creditNotes": "Credit Notes", + "preferences.receipts": "Receipts" +} \ No newline at end of file diff --git a/packages/webapp/src/routes/preferences.tsx b/packages/webapp/src/routes/preferences.tsx index 5fdcb13e6..8031230ed 100644 --- a/packages/webapp/src/routes/preferences.tsx +++ b/packages/webapp/src/routes/preferences.tsx @@ -10,7 +10,9 @@ import DefaultRoute from '../containers/Preferences/DefaultRoute'; import Warehouses from '../containers/Preferences/Warehouses'; import Branches from '../containers/Preferences/Branches'; import Invoices from '../containers/Preferences/Invoices/PreferencesInvoices'; - +import { PreferencesCreditNotes } from '../containers/Preferences/CreditNotes/PreferencesCreditNotes'; +import { PreferencesEstimates } from '@/containers/Preferences/Estimates/PreferencesEstimates'; +import{ PreferencesReceipts } from '@/containers/Preferences/Receipts/PreferencesReceipts' const BASE_URL = '/preferences'; @@ -32,7 +34,17 @@ export default [ }, { path: `${BASE_URL}/credit-notes`, - component: CreditNotes, + component: PreferencesCreditNotes, + exact: true, + }, + { + path: `${BASE_URL}/estimates`, + component: PreferencesEstimates, + exact: true, + }, + { + path: `${BASE_URL}/receipts`, + component: PreferencesReceipts, exact: true, }, {