feat(metadata): invoice value an be 255 length

getlago · Mar 10, 2023 · 1db2fce · 1db2fce
1 parent 96e14bb
commit 1db2fce
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 9 deletions.
diff --git a/ditto/base.json b/ditto/base.json
@@ -180,7 +180,7 @@
   "id_6405e8dd5593b00054e31b9c": "Key must be a string under 20 characters",
   "id_6405e8dd5593b00054e31b9d": "Keys should be unique; please differentiate them to move forward.",
   "id_6405e8dd5593b00054e31b9e": "Remove metadata",
-  "id_6405e8dd5593b00054e31b9f": "Value must be a string under 40 characters",
+  "id_6405e8dd5593b00054e31b9f": "Value must be a string of {{max}} characters maximum",
   "id_6405e8dd5593b00054e31bff": "Customer metadata",
   "id_6405e8dd5593b00054e31c17": "Add metadata",
   "id_6405e8dd5593b00054e31c54": "Add metadata",

diff --git a/src/components/customers/AddCustomerDrawer.tsx b/src/components/customers/AddCustomerDrawer.tsx
@@ -34,7 +34,11 @@ import { getTimezoneConfig } from '~/core/timezone'
 import { useOrganizationInfos } from '~/hooks/useOrganizationInfos'
 import { useCurrentUser } from '~/hooks/useCurrentUser'
 import { countryDataForCombobox } from '~/core/countryCodes'
-import { MetadataErrorsEnum, metadataSchema } from '~/formValidationSchemas/metadataSchema'
+import {
+  MetadataErrorsEnum,
+  metadataSchema,
+  METADATA_VALUE_MAX_LENGTH_DEFAULT,
+} from '~/formValidationSchemas/metadataSchema'
 
 const MAX_METADATA_COUNT = 5
 
@@ -444,7 +448,9 @@ export const AddCustomerDrawer = forwardRef<DrawerRef, AddCustomerDrawerProps>(
                             placement="top-end"
                             title={
                               metadataItemValueError === MetadataErrorsEnum.maxLength
-                                ? translate('id_6405e8dd5593b00054e31b9f')
+                                ? translate('id_6405e8dd5593b00054e31b9f', {
+                                    max: METADATA_VALUE_MAX_LENGTH_DEFAULT,
+                                  })
                                 : undefined
                             }
                             disableHoverListener={!hasCustomValueError}

diff --git a/src/components/invoices/AddMetadataDrawer.tsx b/src/components/invoices/AddMetadataDrawer.tsx
@@ -19,6 +19,7 @@ import {
 import { MetadataErrorsEnum, metadataSchema } from '~/formValidationSchemas/metadataSchema'
 
 const MAX_METADATA_COUNT = 5
+const METADATA_VALUE_MAX_LENGTH = 255
 
 gql`
   fragment InvoiceMetadatasForMetadataDrawer on Invoice {
@@ -65,7 +66,7 @@ export const AddMetadataDrawer = forwardRef<DrawerRef, AddMetadataDrawerProps>(
         metadata: invoice?.metadata ?? undefined,
       },
       validationSchema: object().shape({
-        metadata: metadataSchema(),
+        metadata: metadataSchema({ valueMaxLength: METADATA_VALUE_MAX_LENGTH }),
       }),
       validateOnMount: true,
       enableReinitialize: true,
@@ -154,7 +155,9 @@ export const AddMetadataDrawer = forwardRef<DrawerRef, AddMetadataDrawerProps>(
                           placement="top-end"
                           title={
                             metadataItemValueError === MetadataErrorsEnum.maxLength
-                              ? translate('id_6405e8dd5593b00054e31b9f')
+                              ? translate('id_6405e8dd5593b00054e31b9f', {
+                                  max: METADATA_VALUE_MAX_LENGTH,
+                                })
                               : undefined
                           }
                           disableHoverListener={!hasCustomValueError}

diff --git a/src/components/invoices/Metadatas.tsx b/src/components/invoices/Metadatas.tsx
@@ -121,15 +121,17 @@ const StyledSectionHeader = styled(SectionHeader)`
 
 const InfoLine = styled.div`
   display: flex;
-  align-items: center;
+  align-items: flex-start;
   margin-bottom: ${theme.spacing(3)};
 
   > div:first-child {
     min-width: 232px;
     margin-right: ${theme.spacing(3)};
+    line-height: 28px;
   }
 
   > div:last-child {
     width: 100%;
+    line-break: anywhere;
   }
 `
diff --git a/src/formValidationSchemas/metadataSchema.ts b/src/formValidationSchemas/metadataSchema.ts
@@ -1,14 +1,14 @@
 import { object, array, string } from 'yup'
 
+export const METADATA_VALUE_MAX_LENGTH_DEFAULT = 40
 const KEY_MAX_LENGTH = 20
-const VALUE_MAX_LENGTH = 40
 
 export enum MetadataErrorsEnum {
   uniqueness = 'uniqueness',
   maxLength = 'maxLength',
 }
 
-export const metadataSchema = () =>
+export const metadataSchema = ({ valueMaxLength = METADATA_VALUE_MAX_LENGTH_DEFAULT } = {}) =>
   array().of(
     object().shape({
       key: string().test({
@@ -44,7 +44,7 @@ export const metadataSchema = () =>
       value: string().test({
         test: (value, { createError, path }) => {
           if (!value) return false
-          if (value.length > VALUE_MAX_LENGTH) {
+          if (value.length > valueMaxLength) {
             return createError({
               path,
               message: MetadataErrorsEnum.maxLength,