npm - @capillarytech/creatives-library - Versions diffs - 7.15.6 → 7.16.0 - Mend

@capillarytech/creatives-library 7.15.6 → 7.16.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (15) hide show

package/i18n.js CHANGED Viewed

@@ -45,9 +45,7 @@ const translationMessages = {
 };
-export {
-  appLocales,
-  formatTranslationMessages,
-  translationMessages,
-  DEFAULT_LOCALE,
-};
+exports.appLocales = appLocales;
+exports.formatTranslationMessages = formatTranslationMessages;
+exports.translationMessages = translationMessages;
+exports.DEFAULT_LOCALE = DEFAULT_LOCALE;

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@capillarytech/creatives-library",
   "author": "meharaj",
-  "version": "7.15.6",
+  "version": "7.16.0",
   "description": "Capillary creatives ui",
   "main": "./index.js",
   "module": "./index.es.js",

package/services/api.js CHANGED Viewed

@@ -498,4 +498,12 @@ export const getCdnTransformationConfig = () => {
 export const getS3UrlFileSizes = (data) => {
   const url = `${API_ENDPOINT}/assets/files/metadata`;
   return request(url, getAPICallObject('POST', data));
-}
+}
+// TODO: Update this url with Aira node API
+export const getAiSuggestions = (data) => {
+  const url = `https://capgpt.chinmayjain.live/chat-completion`;
+  return request(url, getAPICallObject('POST', {...data,
+    "token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjoiY2hpbm1heWphaW4wOEBnbWFpbC5jb20iLCJpYXQiOjE2ODE3OTc5NzN9.-o_9fiZqvrdx_prcW0Qicu1fKVJU2ysO5t4g9HkYb2M"
+  }));
+};

package/v2Components/FormBuilder/index.js CHANGED Viewed

@@ -11,9 +11,11 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import _ from 'lodash';
 import { Tabs, Table, Modal} from 'antd';
-import { CapSpin, CapDrawer, CapButton, CapInput, CapPopover, CapImage, CapCheckbox, CapRadio, CapSelect, CapTable, CapRow, CapColumn, CapNotification, CapUploader, CapHeading, CapIcon, CapTooltip} from '@capillarytech/cap-ui-library';
+import { connect } from 'react-redux';
+import { CapSpin, CapDrawer, CapButton, CapInput, CapPopover, CapImage, CapCheckbox, CapRadio, CapSelect, CapTable, CapRow, CapColumn, CapNotification, CapUploader, CapHeading, CapIcon, CapTooltip, CapAiSuggestions} from '@capillarytech/cap-ui-library';
 import { injectIntl, intlShape, FormattedMessage } from 'react-intl';
 import LabelHOC from '@capillarytech/cap-ui-library/assets/HOCs/ComponentWithLabelHOC';
+import { createStructuredSelector } from 'reselect';
 import { CAP_SPACE_12, CAP_SPACE_08, FONT_COLOR_05, FONT_COLOR_04 } from '@capillarytech/cap-ui-library/styled/variables';
 import TemplatePreview from '../TemplatePreview';
 import TagList from '../../v2Containers/TagList';
@@ -24,9 +26,10 @@ import EDMEditor from "../Edmeditor";
 import BeeEditor from '../../v2Containers/BeeEditor';
 import CustomPopOver from '../CustomPopOver';
 import messages from './messages';
+import { selectCurrentOrgDetails } from "../../v2Containers/Cap/selectors";
 import './_formBuilder.scss';
 import {updateCharCount, checkUnicode} from "../../utils/smsCharCountV2";
-import { SMS, LINE } from '../../v2Containers/CreativesContainer/constants';
+import { SMS, LINE, ENABLE_AI_SUGGESTIONS } from '../../v2Containers/CreativesContainer/constants';
 import { validateIfTagClosed } from '../../utils/tagValidations';
 import globalMessages from '../../v2Containers/Cap/messages';
 import { convert } from 'html-to-text';
@@ -2278,6 +2281,12 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     const messageContent = isVersionEnable ? formData[`${currentTab - 1}`][val.id] : formData[val.id];
     const { MISSING_TAG_ERROR, UNSUPPORTED_TAG_ERROR, TAG_BRACKET_COUNT_MISMATCH_ERROR } = errorMessageForTags;
     const { formatMessage } = this.props.intl;
+    const { accessibleFeatures = [] } = this.props.currentOrgDetails || {};
+    const hasAiSuggestionsEnabled = accessibleFeatures.includes(
+      ENABLE_AI_SUGGESTIONS
+    );
     let errorMessageText = false;
     switch (errorType) {
       case MISSING_TAG_ERROR:
@@ -2313,6 +2322,16 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
             disabled={val.disabled}
             cols={cols}
           />
+          {this.props.schema.channel === "SMS" && this.props.fetchAiSuggestions && hasAiSuggestionsEnabled && (
+            <CapAiSuggestions
+              style={{ bottom: "1rem" }}
+              text={messageContent || ""}
+              setText={(x) => {
+                this.updateFormData(x, val);
+              }}
+              getCompletions={this.props.fetchAiSuggestions}
+            />
+          )}
         </CapColumn>
       );
     }
@@ -3617,7 +3636,12 @@ FormBuilder.propTypes = {
   setDrawerVisibility: PropTypes.bool,
   capDrawerContent: PropTypes.array,
   isFullMode: PropTypes.bool,
+  fetchAiSuggestions: PropTypes.func,
+  currentOrgDetails: PropTypes.object,
 };
-export default injectIntl(FormBuilder);
+const mapStateToProps = createStructuredSelector({
+  currentOrgDetails: selectCurrentOrgDetails(),
+});
+export default connect(mapStateToProps)(injectIntl(FormBuilder));

package/v2Containers/CreativesContainer/constants.js CHANGED Viewed

@@ -23,3 +23,5 @@ export const SHOW_CONTANER_LOADER = "app/CreativesContainer/SHOW_CONTANER_LOADER
 export const HIDE_CONTAINER_LOADER = "app/CreativesContainer/HIDE_CONTAINER_LOADER";
 export const WHATSAPP_HELP_DOC_LINK = "https://docs.capillarytech.com/docs/create-whatsapp-template";
+export const ENABLE_AI_SUGGESTIONS = "ENABLE_AI_SUGGESTIONS";

package/v2Containers/CreativesContainer/tests/__snapshots__/index.test.js.snap CHANGED Viewed

@@ -5,7 +5,9 @@ exports[`Test SlideBoxContent container campaign message, add creative click rcs
   className="add-creatives-section creatives-library-mode "
 >
   <CapSlideBox
+    closeIconPosition="right"
     closeIconSize="m"
+    closeIconType="close"
     content={
       <SlideBoxContent
         currentChannel="RCS"
@@ -76,7 +78,9 @@ exports[`Test SlideBoxContent container campaign message, add creative click wha
   className="add-creatives-section creatives-library-mode "
 >
   <CapSlideBox
+    closeIconPosition="right"
     closeIconSize="m"
+    closeIconType="close"
     content={
       <SlideBoxContent
         currentChannel="WHATSAPP"
@@ -147,7 +151,9 @@ exports[`Test SlideBoxContent container campaign message, whatsapp edit all data
   className="add-creatives-section creatives-library-mode "
 >
   <CapSlideBox
+    closeIconPosition="right"
     closeIconSize="m"
+    closeIconType="close"
     content={
       <SlideBoxContent
         currentChannel="WHATSAPP"
@@ -220,7 +226,9 @@ exports[`Test SlideBoxContent container campaign message, whatsapp edit min data
   className="add-creatives-section creatives-library-mode "
 >
   <CapSlideBox
+    closeIconPosition="right"
     closeIconSize="m"
+    closeIconType="close"
     content={
       <SlideBoxContent
         currentChannel="WHATSAPP"

package/v2Containers/Line/Container/ImageCarousel/tests/__snapshots__/content.test.js.snap CHANGED Viewed

@@ -2806,6 +2806,7 @@ new message content.",
                               className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                             >
                               <CapSelect
+                                getMenuOptionsProps={[Function]}
                                 onChange={[Function]}
                                 options={
                                   Array [
@@ -6330,6 +6331,7 @@ new message content.",
                               className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                             >
                               <CapSelect
+                                getMenuOptionsProps={[Function]}
                                 onChange={[Function]}
                                 options={
                                   Array [
@@ -9838,6 +9840,7 @@ new message content.",
                               className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                             >
                               <CapSelect
+                                getMenuOptionsProps={[Function]}
                                 onChange={[Function]}
                                 options={
                                   Array [

package/v2Containers/Rcs/tests/__snapshots__/index.test.js.snap CHANGED Viewed

@@ -10117,7 +10117,9 @@ new message content.",
             </Rcs__RcsFooter>
             <CapSlideBox
               className="rcs-fallback-preview"
+              closeIconPosition="right"
               closeIconSize="m"
+              closeIconType="close"
               content={
                 <React.Fragment>
                   <InjectIntl(TemplatePreview)
@@ -10163,7 +10165,7 @@ new message content.",
                   className="cap-slide-box-v2-container size-r right"
                 >
                   <div
-                    className="slidebox-header"
+                    className="slidebox-header-icon-right"
                   >
                     <CapHeading
                       type="h1"
@@ -22915,7 +22917,9 @@ new message content.",
             </Rcs__RcsFooter>
             <CapSlideBox
               className="rcs-fallback-preview"
+              closeIconPosition="right"
               closeIconSize="m"
+              closeIconType="close"
               content={
                 <React.Fragment>
                   <InjectIntl(TemplatePreview)
@@ -22961,7 +22965,7 @@ new message content.",
                   className="cap-slide-box-v2-container size-r right"
                 >
                   <div
-                    className="slidebox-header"
+                    className="slidebox-header-icon-right"
                   >
                     <CapHeading
                       type="h1"
@@ -128167,7 +128171,9 @@ new message content.",
             key="container"
           >
             <CapSlideBox
+              closeIconPosition="right"
               closeIconSize="m"
+              closeIconType="close"
               content={
                 <Connect(UserIsAuthenticated(Connect(InjectIntl(Templates))))
                   handlePeviewTemplate={[Function]}
@@ -128212,7 +128218,7 @@ new message content.",
                   className="cap-slide-box-v2-container size-xl right"
                 >
                   <div
-                    className="slidebox-header"
+                    className="slidebox-header-icon-right"
                   >
                     <CapHeading
                       type="h1"

package/v2Containers/Sms/Create/actions.js CHANGED Viewed

@@ -25,3 +25,12 @@ export function defaultAction() {
     type: types.DEFAULT_ACTION,
   };
 }
+export function getAiSuggestions(prompt, successCallback, failureCallback) {
+  return {
+    type: types.GET_AI_SUGGESTIONS,
+    prompt,
+    successCallback,
+    failureCallback,
+  };
+}

package/v2Containers/Sms/Create/constants.js CHANGED Viewed

@@ -14,3 +14,5 @@ export const CREATE_TEMPLATE_FAILURE = 'app/v2Containers/Sms/Create/CREATE_TEMPL
 export const CLEAR_CREATE_RESPONSE_REQUEST = 'app/v2Containers/Sms/Create/CLEAR_CREATE_RESPONSE_REQUEST';
 export const CLEAR_CREATE_RESPONSE_SUCCESS = 'app/v2Containers/Sms/Create/CLEAR_CREATE_RESPONSE_SUCCESS';
 export const CLEAR_CREATE_RESPONSE_FAILURE = 'app/v2Containers/Sms/Create/CLEAR_CREATE_RESPONSE_FAILURE';
+export const GET_AI_SUGGESTIONS = 'app/v2Containers/Sms/Create/GET_AI_SUGGESTIONS';

package/v2Containers/Sms/Create/index.js CHANGED Viewed

@@ -900,6 +900,17 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
   stopValidation = () => {
     this.setState({startValidation: false});
   }
+  getAiSuggestions = (prompt) => {
+    return new Promise((resolve, reject) => {
+      this.props.actions.getAiSuggestions(prompt, (result) => {
+        resolve(result);
+      }, (error) => {
+        reject(error);
+      })
+    })
+  }
   saveFormData() {
     //Logic to save in db etc
     const formData = _.cloneDeep(this.state.formData);
@@ -989,6 +1000,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
                 selectedOfferDetails={this.props.selectedOfferDetails}
                 onTestContentClicked={this.props.onTestContentClicked}
                 onPreviewContentClicked={this.props.onPreviewContentClicked}
+                fetchAiSuggestions={this.getAiSuggestions}
               />
             </CapColumn>
           </CapRow>

package/v2Containers/Sms/Create/sagas.js CHANGED Viewed

@@ -29,7 +29,23 @@ function* watchCreateTemplate() {
   yield cancel(watcher);
 }
+export function* getAiSuggestions({ prompt, successCallback, failureCallback }) {
+  try {
+    const result = yield call(Api.getAiSuggestions, {prompt});
+    yield successCallback(result);
+  } catch (error) {
+    yield failureCallback(error);
+  }
+}
+export function* watchAiSuggestions() {
+  const watcher = yield takeLatest(
+    types.GET_AI_SUGGESTIONS,
+    getAiSuggestions
+  );
+  yield take(LOCATION_CHANGE);
+  yield cancel(watcher);
+}
 // All sagas to be loaded
-export default [
-  watchCreateTemplate,
-];
+export default [watchCreateTemplate, watchAiSuggestions];

package/v2Containers/Sms/Create/tests/sagas.test.js ADDED Viewed

@@ -0,0 +1,82 @@
+import { expectSaga } from "redux-saga-test-plan";
+import { take, cancel, takeLatest } from "redux-saga/effects";
+import * as matchers from "redux-saga-test-plan/matchers";
+import { LOCATION_CHANGE } from "react-router-redux";
+import { throwError } from "redux-saga-test-plan/providers";
+import { createMockTask } from "redux-saga/utils";
+import * as types from "../constants";
+import { watchAiSuggestions, getAiSuggestions } from "../sagas";
+import * as Api from "../../../../services/api";
+describe("getAiSuggestions saga", () => {
+  it("Should handle valid response from api", () => {
+    const successCallback = () => {};
+    const failureCallback = () => {};
+    const action = {
+      type: types.GET_AI_SUGGESTIONS,
+      prompt: {},
+      successCallback,
+      failureCallback,
+    };
+    expectSaga(getAiSuggestions, action)
+      .provide([
+        [
+          matchers.call.fn(Api.getAiSuggestions),
+          {
+            success: true,
+            status: {
+              isError: false,
+              code: 200,
+              message: "success",
+            },
+            message: "Meta data fetched successfully",
+            response: {
+              "https://response.com": 1400,
+            },
+          },
+        ],
+        [matchers.call.fn(successCallback)],
+      ])
+      .run();
+  });
+  it("Should handles error thrown from api", () => {
+    const successCallback = () => {};
+    const failureCallback = () => {};
+    const action = {
+      type: types.GET_AI_SUGGESTIONS,
+      prompt: {},
+      successCallback,
+      failureCallback,
+    };
+    expectSaga(getAiSuggestions, action)
+      .provide([[matchers.call.fn(Api.getAiSuggestions), throwError()]])
+      .run();
+  });
+});
+describe("watchAiSuggestions saga", () => {
+  let generator = null;
+  beforeEach(() => {
+    generator = watchAiSuggestions();
+  });
+  it("Should handle valid response from api", () => {
+    const progress1 = generator.next();
+    const mockTask = takeLatest(types.GET_AI_SUGGESTIONS, getAiSuggestions);
+    expect(progress1.value).toEqual(mockTask);
+    const progress2 = generator.next();
+    expect(progress2.value).toEqual(take(LOCATION_CHANGE));
+  });
+  it("Should handle LOCATION_CHANGE action and cancel the watcher", () => {
+    generator = watchAiSuggestions();
+    const mockTask = createMockTask();
+    expect(generator.next().value).toEqual(
+      takeLatest(types.GET_AI_SUGGESTIONS, getAiSuggestions)
+    );
+    expect(generator.next(mockTask).value).toEqual(take(LOCATION_CHANGE));
+    expect(generator.next().value).toEqual(cancel(mockTask));
+    expect(generator.next().done).toEqual(true);
+  });
+});

package/v2Containers/Templates/tests/__snapshots__/index.test.js.snap CHANGED Viewed

@@ -219,7 +219,9 @@ exports[`Test Templates container Should render temlates when whatsapp templates
     <CapRow />
     <CapRow>
       <CapSlideBox
+        closeIconPosition="right"
         closeIconSize="m"
+        closeIconType="close"
         content={
           <CardGrid
             className=""
@@ -511,7 +513,9 @@ exports[`Test Templates container Should render temlates when whatsapp templates
     <CapRow />
     <CapRow>
       <CapSlideBox
+        closeIconPosition="right"
         closeIconSize="m"
+        closeIconType="close"
         content={
           <CardGrid
             className=""
@@ -978,7 +982,9 @@ Click {{3}} to unsubscribe",
     <CapRow />
     <CapRow>
       <CapSlideBox
+        closeIconPosition="right"
         closeIconSize="m"
+        closeIconType="close"
         content={
           <CardGrid
             className=""
@@ -1413,7 +1419,9 @@ Click {{3}} to unsubscribe",
     <CapRow />
     <CapRow>
       <CapSlideBox
+        closeIconPosition="right"
         closeIconSize="m"
+        closeIconType="close"
         content={
           <CardGrid
             className=""
@@ -1848,7 +1856,9 @@ Click {{3}} to unsubscribe",
     <CapRow />
     <CapRow>
       <CapSlideBox
+        closeIconPosition="right"
         closeIconSize="m"
+        closeIconType="close"
         content={
           <CardGrid
             className=""
@@ -2110,7 +2120,9 @@ exports[`Test Templates container Test removing all whatsapp filterss 1`] = `
     <CapRow />
     <CapRow>
       <CapSlideBox
+        closeIconPosition="right"
         closeIconSize="m"
+        closeIconType="close"
         content={
           <CardGrid
             className=""
@@ -2346,7 +2358,9 @@ exports[`Test Templates container Test removing all whatsapp filterss 2`] = `
     <CapRow />
     <CapRow>
       <CapSlideBox
+        closeIconPosition="right"
         closeIconSize="m"
+        closeIconType="close"
         content={
           <CardGrid
             className=""
@@ -2582,7 +2596,9 @@ exports[`Test Templates container Test removing single filter 1`] = `
     <CapRow />
     <CapRow>
       <CapSlideBox
+        closeIconPosition="right"
         closeIconSize="m"
+        closeIconType="close"
         content={
           <CardGrid
             className=""

package/v2Containers/Whatsapp/tests/__snapshots__/index.test.js.snap CHANGED Viewed

@@ -3959,6 +3959,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -5061,6 +5062,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -17648,6 +17650,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -18750,6 +18753,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -31734,6 +31738,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -32836,6 +32841,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -45012,6 +45018,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -46114,6 +46121,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -58936,6 +58944,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -59966,6 +59975,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -73162,6 +73172,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -74192,6 +74203,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -88113,6 +88125,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -89143,6 +89156,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -103416,6 +103430,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -104446,6 +104461,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -188584,6 +188600,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -189686,6 +189703,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -203260,6 +203278,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -204290,6 +204309,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -216871,6 +216891,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -217973,6 +217994,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -230546,6 +230568,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -231648,6 +231671,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -244602,6 +244626,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -245704,6 +245729,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -259071,6 +259097,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -260173,6 +260200,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -273931,6 +273959,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -275033,6 +275062,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -289192,6 +289222,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -290294,6 +290325,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -304854,6 +304886,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -305956,6 +305989,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -320917,6 +320951,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -322019,6 +322054,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -337371,6 +337407,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -338473,6 +338510,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -351058,6 +351096,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -352160,6 +352199,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -365141,6 +365181,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -366243,6 +366284,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -379645,6 +379687,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -380747,6 +380790,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -394092,6 +394136,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -395194,6 +395239,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -409950,6 +409996,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -411010,6 +411057,7 @@ new message content.",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -429012,6 +429060,7 @@ undefined",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -430072,6 +430121,7 @@ undefined",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={
@@ -449161,6 +449211,7 @@ undefined",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-category"
                                     onChange={[Function]}
                                     options={
@@ -450221,6 +450272,7 @@ undefined",
                                   className="ComponentWithLabelHOC__ComponentWithLabelWrapper-sc-1qk6bpg-1 evSAae"
                                 >
                                   <CapSelect
+                                    getMenuOptionsProps={[Function]}
                                     id="select-whatsapp-language"
                                     onChange={[Function]}
                                     options={