feat: optimize branding templates customiing

packages/webapp/src/containers/Sales/Estimates/EstimateCustomize/EstimateCustomizeContent.tsx

@@ -1,6 +1,4 @@
-import { Classes } from '@blueprintjs/core';
 import { useFormikContext } from 'formik';
-import { Box } from '@/components';
 import { ElementCustomize } from '../../../ElementCustomize/ElementCustomize';
 import { EstimateCustomizeGeneralField } from './EstimateCustomizeFieldsGeneral';
 import { EstimateCustomizeContentFields } from './EstimateCustomizeFieldsContent';
@@ -14,7 +12,6 @@ import { BrandingTemplateForm } from '@/containers/BrandingTemplates/BrandingTem
 export function EstimateCustomizeContent() {
   const { payload, name } = useDrawerContext();
   const { closeDrawer } = useDrawerActions();
-
   const templateId = payload?.templateId || null;
 
   const handleSuccess = () => {

packages/webapp/src/containers/Sales/Estimates/EstimateCustomize/EstimatePaperTemplate.tsx

@@ -58,6 +58,7 @@ export function EstimatePaperTemplate({
   secondaryColor,
   showCompanyLogo = true,
   companyLogo,
+  companyName,
 
   billedToAddress = [
     'Bigcapital Technology, Inc.',
@@ -74,6 +75,9 @@ export function EstimatePaperTemplate({
     '+1 762-339-5634',
     'ahmed@bigcapital.app',
   ],
+  showBilledFromAddress = true,
+  showBilledToAddress = true,
+
   total = '$1000.00',
   totalLabel = 'Total',
   showTotal = true,
@@ -141,8 +145,14 @@ export function EstimatePaperTemplate({
         </PaperTemplate.TermsList>
 
         <Group spacing={10}>
-          <PaperTemplate.Address items={billedToAddress} />
-          <PaperTemplate.Address items={billedFromAddress} />
+          {showBilledFromAddress && (
+            <PaperTemplate.Address
+              items={[<strong>{companyName}</strong>, ...billedFromAddress]}
+            />
+          )}
+          {showBilledToAddress && (
+            <PaperTemplate.Address items={billedToAddress} />
+          )}
         </Group>
 
         <Stack spacing={0}>
@@ -150,8 +160,8 @@ export function EstimatePaperTemplate({
             columns={[
               { label: 'Item', accessor: 'item' },
               { label: 'Description', accessor: 'item' },
-              { label: 'Rate', accessor: 'rate' },
-              { label: 'Total', accessor: 'total' },
+              { label: 'Rate', accessor: 'rate', align: 'right' },
+              { label: 'Total', accessor: 'total', align: 'right' },
             ]}
             data={lines}
           />

packages/webapp/src/containers/Sales/Estimates/EstimateCustomize/constants.ts

@@ -25,7 +25,7 @@ export const initialValues = {
 
   // Addresses
   showBilledFromAddress: true,
-  showBillingToAddress: true,
+  showBilledToAddress: true,
   billedToLabel: 'Billed To',
 
   // Entries
@@ -55,7 +55,7 @@ export const fieldsGroups = [
     fields: [
       {
         labelKey: 'estimateNumberLabel',
-        enableKey: 'showEstimateeNumber',
+        enableKey: 'showEstimateNumber',
         label: 'Estimate No.',
       },
       {
@@ -65,11 +65,11 @@ export const fieldsGroups = [
       },
       {
         labelKey: 'expirationDateLabel',
-        enableKey: 'expirationDueDate',
+        enableKey: 'showExpirationDate',
         label: 'Expiration Date',
       },
       {
-        enableKey: 'showBillingToAddress',
+        enableKey: 'showBilledToAddress',
         labelKey: 'billedToLabel',
         label: 'Bill To',
       },