feat: wip default message to sales transactions.

packages/webapp/src/constants/preferencesMenu.tsx

@@ -12,10 +12,22 @@ export default [
     text: <T id={'users'} />,
     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: <T id={'currencies'} />,
     href: '/preferences/currencies',

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 (
     <PreferencesCreditNotesBoot>
-      <PreferencesInvoiceFormPage />
+      <PreferencesCreditNotesFormPage />
     </PreferencesCreditNotesBoot>
   );
 }

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;

packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesForm.tsx

@@ -27,7 +27,7 @@ export function PreferencesCreditNotesForm({ isSubmitting }) {
       {/* ---------- Terms & Conditions ----------  */}
       <FFormGroup
         name={'termsConditions'}
-        label={<T id={'pref.estimates.termsConditions.field'} />}
+        label={<T id={'pref.creditNotes.termsConditions.field'} />}
         labelInfo={<FieldRequiredHint />}
         fastField={true}
       >
@@ -42,7 +42,7 @@ export function PreferencesCreditNotesForm({ isSubmitting }) {
       {/* ---------- Customer Notes ----------  */}
       <FFormGroup
         name={'customerNotes'}
-        label={<T id={'pref.estimates.customerNotes.field'} />}
+        label={<T id={'pref.creditNotes.customerNotes.field'} />}
         fastField={true}
       >
         <FTextArea

packages/webapp/src/containers/Preferences/CreditNotes/PreferencesCreditNotesFormBoot.tsx

@@ -1,9 +1,11 @@
 // @ts-nocheck
 import React from 'react';
+import styled from 'styled-components';
 import classNames from 'classnames';
 import { CLASSES } from '@/constants/classes';
 import { useSettings } from '@/hooks/query';
 import PreferencesPageLoader from '../PreferencesPageLoader';
+import { Card } from '@/components';
 
 const PreferencesCreditNotesFormContext = React.createContext();
 
@@ -15,7 +17,6 @@ function PreferencesCreditNotesBoot({ ...props }) {
   const provider = {
     organization: {},
   };
-
   // Detarmines whether if any query is loading.
   const isLoading = isSettingsLoading;
 
@@ -26,15 +27,28 @@ function PreferencesCreditNotesBoot({ ...props }) {
         CLASSES.PREFERENCES_PAGE_INSIDE_CONTENT_ACCOUNTANT,
       )}
     >
-      {isLoading ? (
-        <PreferencesPageLoader />
-      ) : (
-        <PreferencesCreditNotesFormContext.Provider value={provider} {...props} />
-      )}
+      <PreferencesCreditNotesCard>
+        {isLoading ? (
+          <PreferencesPageLoader />
+        ) : (
+          <PreferencesCreditNotesFormContext.Provider
+            value={provider}
+            {...props}
+          />
+        )}
+      </PreferencesCreditNotesCard>
     </div>
   );
 }
 
+const PreferencesCreditNotesCard = styled(Card)`
+  padding: 25px;
+
+  .bp4-form-group {
+    max-width: 600px;
+  }
+`;
+
 const usePreferencesCreditNotesFormContext = () =>
   React.useContext(PreferencesCreditNotesFormContext);
 

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.

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 (
     <PreferencesEstimatesBoot>
-      <PreferencesInvoiceFormPage />
+      <PreferencesEstimatesFormPage />
     </PreferencesEstimatesBoot>
   );
 }

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'));

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 ? (
-        <PreferencesPageLoader />
-      ) : (
-        <PreferencesInvoiceFormContext.Provider value={provider} {...props} />
-      )}
+      <PreferencesInvoicesCard>
+        {isLoading ? (
+          <PreferencesPageLoader />
+        ) : (
+          <PreferencesInvoiceFormContext.Provider value={provider} {...props} />
+        )}
+      </PreferencesInvoicesCard>
     </div>
   );
 }
 
+const PreferencesInvoicesCard = styled(Card)`
+  padding: 25px;
+
+  .bp4-form-group{
+    max-width: 600px;
+  }
+`;
+
 const usePreferencesInvoiceFormContext = () =>
   React.useContext(PreferencesInvoiceFormContext);
 

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}
     />
   );
 }

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 }) {
       <FFormGroup
         name={'termsConditions'}
         label={<T id={'pref.invoices.termsConditions.field'} />}
-        labelInfo={<FieldRequiredHint />}
         fastField={true}
       >
         <FTextArea

packages/webapp/src/containers/Preferences/Receipts/PreferencesReceipts.tsx

@@ -0,0 +1,14 @@
+// @ts-nocheck
+import { PreferencesReceiptsBoot } from './PreferencesReceiptsFormBoot';
+import { PreferencesReceiptsFormPage } from './PreferencesReceiptsFormPage';
+
+/**
+ * Preferences - Receipts.
+ */
+export function PreferencesReceipts() {
+  return (
+    <PreferencesReceiptsBoot>
+      <PreferencesReceiptsFormPage />
+    </PreferencesReceiptsBoot>
+  );
+}

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;

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 (
+    <Form>
+      {/* ---------- Terms & Conditions ----------  */}
+      <FFormGroup
+        name={'termsConditions'}
+        label={<T id={'pref.receipts.termsConditions.field'} />}
+        fastField={true}
+      >
+        <FTextArea
+          medium={'true'}
+          name={'termsConditions'}
+          fastField={true}
+          fill={true}
+        />
+      </FFormGroup>
+
+      {/* ---------- Customer Notes ----------  */}
+      <FFormGroup
+        name={'customerNotes'}
+        label={<T id={'pref.receipts.customerNotes.field'} />}
+        fastField={true}
+      >
+        <FTextArea
+          medium={'true'}
+          name={'tax_number'}
+          fastField={true}
+          fill={true}
+        />
+      </FFormGroup>
+
+      <CardFooterActions>
+        <Button loading={isSubmitting} intent={Intent.PRIMARY} type="submit">
+          <T id={'save'} />
+        </Button>
+        <Button onClick={handleCloseClick}>
+          <T id={'close'} />
+        </Button>
+      </CardFooterActions>
+    </Form>
+  );
+}
+
+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;
+    }
+  }
+`;

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 (
+    <div
+      className={classNames(
+        CLASSES.PREFERENCES_PAGE_INSIDE_CONTENT,
+        CLASSES.PREFERENCES_PAGE_INSIDE_CONTENT_ACCOUNTANT,
+      )}
+    >
+      <PreferencesReceiptsCard>
+        {isLoading ? (
+          <PreferencesPageLoader />
+        ) : (
+          <PreferencesReceiptsFormContext.Provider
+            value={provider}
+            {...props}
+          />
+        )}
+      </PreferencesReceiptsCard>
+    </div>
+  );
+}
+
+const PreferencesReceiptsCard = styled(Card)`
+  padding: 25px;
+
+  .bp4-form-group {
+    max-width: 600px;
+  }
+`;
+
+const usePreferencesReceiptsFormContext = () =>
+  React.useContext(PreferencesReceiptsFormContext);
+
+export { PreferencesReceiptsBoot, usePreferencesReceiptsFormContext };

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 (
+    <Formik
+      initialValues={initialValues}
+      validationSchema={PreferencesReceiptsFormSchema}
+      onSubmit={handleFormSubmit}
+      component={PreferencesReceiptsForm}
+    />
+  );
+}
+
+export const PreferencesReceiptsFormPage = compose(withDashboardActions)(
+  PreferencesReceiptsFormPageRoot,
+);

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"
+}

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,
   },
   {