From 147651b9d5b40d500b21dad0bc709d76830dc2d0 Mon Sep 17 00:00:00 2001
From: Kelly Phan <keelly.p@gmail.com>
Date: Thu, 9 Jan 2025 12:20:12 +0100
Subject: [PATCH] fix: product design review

---
 .../EditCustomerInvoiceCustomSectionsDialog.tsx | 17 ++++++++---------
 .../invoices/PreviewCustomSectionDrawer.tsx     |  6 ++++--
 .../settings/Invoices/CreateCustomSection.tsx   |  2 ++
 translations/base.json                          |  5 +++--
 4 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/src/components/customers/EditCustomerInvoiceCustomSectionsDialog.tsx b/src/components/customers/EditCustomerInvoiceCustomSectionsDialog.tsx
index 2cbcd6aa4..21576aba2 100644
--- a/src/components/customers/EditCustomerInvoiceCustomSectionsDialog.tsx
+++ b/src/components/customers/EditCustomerInvoiceCustomSectionsDialog.tsx
@@ -182,16 +182,15 @@ export const EditCustomerInvoiceCustomSectionsDialog = forwardRef<
         {formikProps.values.behavior === BehaviorType.CUSTOM_SECTIONS && (
           <MultipleComboBox
             hideTags={false}
+            forcePopupIcon
             name="applicableInvoiceCustomSectionIds"
             data={
-              data?.invoiceCustomSections?.collection
-                .filter(({ selected }) => !selected)
-                .map((section) => ({
-                  labelNode: section.name,
-                  label: section.name,
-                  description: section.code,
-                  value: section.id,
-                })) ?? []
+              data?.invoiceCustomSections?.collection.map((section) => ({
+                labelNode: section.name,
+                label: section.name,
+                description: section.code,
+                value: section.id,
+              })) ?? []
             }
             onChange={(section) =>
               formikProps.setFieldValue(
@@ -213,7 +212,7 @@ export const EditCustomerInvoiceCustomSectionsDialog = forwardRef<
             }
             placeholder={translate('text_1735223938916qvvv12r7je0')}
             PopperProps={{ displayInDialog: true }}
-            emptyText={translate('text_1735223938916tlygbi5v0nd')}
+            emptyText={translate('text_173642092241713ws50zg9v4')}
           />
         )}
         <RadioField
diff --git a/src/components/settings/invoices/PreviewCustomSectionDrawer.tsx b/src/components/settings/invoices/PreviewCustomSectionDrawer.tsx
index f419d60a7..47cbbf67b 100644
--- a/src/components/settings/invoices/PreviewCustomSectionDrawer.tsx
+++ b/src/components/settings/invoices/PreviewCustomSectionDrawer.tsx
@@ -63,7 +63,9 @@ export const PreviewCustomSectionDrawer = forwardRef<PreviewCustomSectionDrawerR
         withPadding={false}
         stickyBottomBar={({ closeDrawer }) => (
           <div className="flex justify-end">
-            <Button onClick={closeDrawer}>{translate('text_62f50d26c989ab03196884ae')}</Button>
+            <Button size="large" onClick={closeDrawer}>
+              {translate('text_62f50d26c989ab03196884ae')}
+            </Button>
           </div>
         )}
         title={
@@ -75,7 +77,7 @@ export const PreviewCustomSectionDrawer = forwardRef<PreviewCustomSectionDrawerR
         }
       >
         <div className="h-full bg-grey-100 pb-12 pl-12">
-          <div className="flex size-full flex-col justify-end bg-white px-12 py-8">
+          <div className="flex size-full flex-col justify-end bg-white p-12">
             {hasLocalData && (
               <div className="flex flex-col gap-1 pb-6 shadow-b">
                 {localData?.displayName && (
diff --git a/src/pages/settings/Invoices/CreateCustomSection.tsx b/src/pages/settings/Invoices/CreateCustomSection.tsx
index 315e40ed1..59764916d 100644
--- a/src/pages/settings/Invoices/CreateCustomSection.tsx
+++ b/src/pages/settings/Invoices/CreateCustomSection.tsx
@@ -131,6 +131,8 @@ const CreateInvoiceCustomSection = () => {
                   </div>
                   <div className="flex items-start gap-6 *:flex-1">
                     <TextInputField
+                      // eslint-disable-next-line jsx-a11y/no-autofocus
+                      autoFocus
                       name="name"
                       formikProps={formikProps}
                       label={translate('text_6419c64eace749372fc72b0f')}
diff --git a/translations/base.json b/translations/base.json
index 0051eac65..7904bce46 100644
--- a/translations/base.json
+++ b/translations/base.json
@@ -2770,5 +2770,6 @@
   "text_1735223938916dhd7cyzokib": "Do not display custom sections on customers’ invoices",
   "text_1735223938916q9pq0j0z0ju": "Edit behavior",
   "text_1735223938916qvvv12r7je0": "Search and select a custom section",
-  "text_17352280436833uy9uxzbqn7": "Invoice custom section behavior successfully applied"
-}
+  "text_17352280436833uy9uxzbqn7": "Invoice custom section behavior successfully applied",
+  "text_173642092241713ws50zg9v4": "No custom section available"
+}
\ No newline at end of file