CR changes

CartoDB · Jun 20, 2024 · d37377e · d37377e
1 parent eb1ddb3
commit d37377e
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 7 deletions.
diff --git a/packages/react-ui/src/components/molecules/Autocomplete.d.ts b/packages/react-ui/src/components/molecules/Autocomplete.d.ts
@@ -10,7 +10,7 @@ export type AutocompleteProps<
   ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent']
 > = MuiAutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent> & {
   creatable?: boolean;
-  newItemTitle?: string | (value: string) => (React.ReactNode | string);
+  newItemLabel?: string | ((value: string) => React.ReactNode | string);
   newItemIcon?: React.ReactNode;
 };
 

diff --git a/packages/react-ui/src/components/molecules/Autocomplete.js b/packages/react-ui/src/components/molecules/Autocomplete.js
@@ -19,7 +19,7 @@ const Autocomplete = forwardRef(
   (
     {
       creatable,
-      newItemTitle = 'c4r.form.add',
+      newItemLabel = 'c4r.form.add',
       newItemIcon,
       freeSolo,
       renderOption,
@@ -44,7 +44,10 @@ const Autocomplete = forwardRef(
       if (inputValue.length > 1 && inputValue !== '' && !isExisting) {
         filtered.push({
           inputValue,
-          title: typeof newItemTitle === 'function' ? newItemTitle(inputValue) : `${newItemTitle} "${inputValue}"`
+          title:
+            typeof newItemLabel === 'function'
+              ? newItemLabel(inputValue)
+              : `${intlConfig.formatMessage({ id: newItemLabel })} "${inputValue}"`
         });
       }
 
@@ -117,7 +120,11 @@ const Autocomplete = forwardRef(
 
 Autocomplete.propTypes = {
   creatable: PropTypes.bool,
-  newItemTitle: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+  newItemLabel: PropTypes.oneOfType([
+    PropTypes.func,
+    PropTypes.string,
+    PropTypes.element
+  ]),
   newItemIcon: PropTypes.element
 };
 

diff --git a/packages/react-ui/storybook/stories/molecules/Autocomplete.stories.js b/packages/react-ui/storybook/stories/molecules/Autocomplete.stories.js
@@ -103,7 +103,7 @@ const options = {
         type: 'text'
       }
     },
-    newItemTitle: {
+    newItemLabel: {
       control: {
         type: 'text'
       }
@@ -1078,7 +1078,7 @@ const CreatableWithPrefixAndSuffixTemplate = ({
     <IntlProvider locale='en'>
       <Autocomplete
         {...args}
-        open
+        //open
         creatable
         options={creatableTop100Films}
         onChange={(event, newValue) => {
@@ -1324,7 +1324,7 @@ Creatable.args = { ...commonArgs };
 export const CreatableCustomNewOption = CreatableTemplate.bind({});
 CreatableCustomNewOption.args = {
   ...commonArgs,
-  newItemTitle: 'c4r.widgets.category.apply',
+  newItemLabel: (value) => `Add this '${value}' new item`,
   newItemIcon: <NewReleasesOutlined />
 };