cap-creatives-ui 8.0.280 → 8.0.321

package/app/v2Containers/TemplatesV2/index.js

@@ -10,9 +10,8 @@ import { connect } from 'react-redux';
 import { injectIntl, intlShape, FormattedMessage } from 'react-intl';
 import { createStructuredSelector } from 'reselect';
 import { bindActionCreators, compose } from 'redux';
-import { CapTab, CapCustomCard, CapButton, CapHeader, CapSpin, CapIcon, CapTooltip } from '@capillarytech/cap-ui-library';
-import { find, get } from 'lodash';
-import isEmpty from 'lodash/isEmpty';
+import { CapTab, CapCustomCard, CapButton, CapHeader, CapIcon, CapSpin, CapTooltip } from '@capillarytech/cap-ui-library';
+import { find, get, pick } from 'lodash';
 import Helmet from 'react-helmet';
 
 import { UserIsAuthenticated } from '../../utils/authWrapper';
@@ -30,13 +29,21 @@ import FTP from '../FTP';
 import Gallery from '../Assets/Gallery';
 import withStyles from '../../hoc/withStyles';
 import styles, { CapTabStyle } from './TemplatesV2.style';
-import { CREATIVES_UI_VIEW, LOYALTY, WHATSAPP, RCS, LINE, EMAIL, ASSETS, JP_LOCALE_HIDE_FEATURE, ZALO, INAPP, WEBPUSH } from '../App/constants';
+import { CREATIVES_UI_VIEW, FTP as FTP_CHANNEL, LOYALTY, WHATSAPP, RCS, LINE, EMAIL, ASSETS, JP_LOCALE_HIDE_FEATURE, ZALO, INAPP, WEBPUSH } from '../App/constants';
 import AccessForbidden from '../../v2Components/AccessForbidden';
 import { getObjFromQueryParams } from '../../utils/v2common';
 import { makeSelectAuthenticated, selectCurrentOrgDetails } from "../../v2Containers/Cap/selectors";
-import { LOYALTY_SUPPORTED_ACTION, COMMON_CHANNELS } from "../CreativesContainer/constants";
+import {
+  CALL_TASK,
+  COMMON_CHANNELS,
+  LOCAL_TEMPLATE_CONFIG_KEYS_FOR_PICK,
+  LOYALTY_SUPPORTED_ACTION,
+  MOBILE_PUSH,
+  NORMALIZED_CHANNEL_ALIASES,
+  SMS,
+} from "../CreativesContainer/constants";
 
-const {CapCustomCardList} = CapCustomCard;
+const { CapCustomCardList } = CapCustomCard;
 
 const StyledCapTab = withStyles(CapTab, CapTabStyle);
 export class TemplatesV2 extends React.Component { // eslint-disable-line react/prefer-stateless-function
@@ -58,6 +65,7 @@ export class TemplatesV2 extends React.Component { // eslint-disable-line react/
       cap = {},
       loyaltyMetaData = {},
       isLoyaltyModule = false,
+      isAnonymousType = false,
     } = props;
 
     const defaultPanes = {
@@ -89,44 +97,62 @@ export class TemplatesV2 extends React.Component { // eslint-disable-line react/
         key: 'wechat',
       };
     }
-    let filteredPanes = Object.keys(defaultPanes)
-      .filter((key) => !channelsToHide.includes(key)).reduce((obj = [], key) => {
-        obj.push(defaultPanes[key]);
-        return obj;
-      }, []);
-
-      if (isFullMode ) {
-      filteredPanes.push({content: <div></div>, tab: intl.formatMessage(messages.gallery), key: 'assets'});
-    } else {
-      if (!channelsToHide.includes('callTask')) {
-        filteredPanes.push({content: <div></div>, tab: intl.formatMessage(messages.callTask), key: 'call_task'});
+    // Robust normalization function: converts camelCase, hyphens, spaces and mixed-case to snake_case lowercase
+    const normalizeChannel = (raw = '') => {
+      const str = (raw || '').toString();
+      return str.replace(/([a-z0-9])([A-Z])/g, '$1_$2').replace(/[^a-zA-Z0-9]+/g, '_').toLowerCase();
+    };
+
+    const buildChannelSet = (channelList) => {
+      const normalized = (channelList || []).map((c) => normalizeChannel(c));
+      const withAliases = normalized.flatMap((norm) => {
+        const canonical = NORMALIZED_CHANNEL_ALIASES[norm];
+        return canonical ? [norm, canonical] : [norm];
+      });
+      return new Set(withAliases);
+    };
+    const normalizedChannelsToHideSet = buildChannelSet(channelsToHide);
+    const normalizedChannelsToDisableSet = buildChannelSet(channelsToDisable);
+
+    // Build filtered panes by examining each pane's `key` and checking against normalized hide set
+    let filteredPanes = Object.keys(defaultPanes).map((k) => defaultPanes[k]).filter((pane) => {
+      const paneKey = normalizeChannel(pane.key);
+      return !normalizedChannelsToHideSet.has(paneKey);
+    });
+
+    if (isFullMode && !normalizedChannelsToHideSet.has(normalizeChannel(ASSETS))) {
+      filteredPanes.push({ content: <div></div>, tab: intl.formatMessage(messages.gallery), key: ASSETS });
+    } else if (!isFullMode) {
+      // Add special-mode panes only when not hidden (use normalized checks)
+      if (!normalizedChannelsToHideSet.has(CALL_TASK.toLowerCase())) {
+        filteredPanes.push({ content: <div></div>, tab: intl.formatMessage(messages.callTask), key: CALL_TASK.toLowerCase() });
       }
-      if (!channelsToHide.includes('FTP')) {
-        filteredPanes.push({content: <></>, tab: intl.formatMessage(messages.FTP), key: 'ftp'});
-        defaultChannel = 'FTP';
+      if (!normalizedChannelsToHideSet.has(FTP_CHANNEL.toLowerCase())) {
+        filteredPanes.push({ content: <></>, tab: intl.formatMessage(messages.FTP), key: FTP_CHANNEL.toLowerCase() });
+        defaultChannel = FTP_CHANNEL;
       }
 
       // Create a local copy of COMMON_CHANNELS to avoid mutating the imported array
       const channels = [...COMMON_CHANNELS];
-      const { actionName = ''} = loyaltyMetaData;
+      const { actionName = '' } = loyaltyMetaData;
       if (isLoyaltyModule && actionName === LOYALTY_SUPPORTED_ACTION) {
         channels.push(WHATSAPP, ZALO);
       }
 
-      // we only show channels which other than COMMON_CHANNELS
-      // if it is coming in enableNewChannels array
+      // we only show channels other than COMMON_CHANNELS if they are present in enableNewChannels
       filteredPanes = filteredPanes.filter((item) => {
-        const channel = item.key;
-        if (!channels.includes(channel)) {
-          return enableNewChannels.includes(channel.toUpperCase());
+        const channelKey = normalizeChannel(item.key);
+        if (!channels.includes(channelKey)) {
+          return enableNewChannels.includes(channelKey.toUpperCase());
         }
         return true;
       });
     }
 
 
-    filteredPanes = filteredPanes.map( (pane) => {
-      if (channelsToDisable.includes(pane.key)) {
+    filteredPanes = filteredPanes.map((pane) => {
+      const paneKeyNorm = normalizeChannel(pane.key);
+      if (normalizedChannelsToDisableSet.has(paneKeyNorm)) {
         // eslint-disable-next-line no-param-reassign
         pane.disabled = true;
         if (pane.key === 'facebook' && showDisabledFBInfo) {
@@ -151,10 +177,18 @@ export class TemplatesV2 extends React.Component { // eslint-disable-line react/
     filteredPanes = hideEngagementChannel ? filteredPanes?.filter((pane) => [EMAIL, LINE, ASSETS].includes(pane?.key) && pane) : filteredPanes;
     defaultChannel = hideEngagementChannel ? EMAIL : defaultChannel;
 
-    const channel = ['sms', 'email', 'mobilepush', 'line', 'call_task'];
-    if (!isEmpty(channelsToDisable)) {
-      channel.some((ch) => {
-        if (!channelsToDisable.includes(ch)) {
+    // If audience is anonymous, prefer mobilepush as default (if not hidden)
+    if (isAnonymousType) {
+      const mobilePushNorm = normalizeChannel(MOBILE_PUSH.toLowerCase());
+      if (!normalizedChannelsToHideSet.has(mobilePushNorm)) {
+        defaultChannel = MOBILE_PUSH.toLowerCase();
+      }
+    }
+
+    const defaultChannelOrder = [SMS.toLowerCase(), EMAIL, MOBILE_PUSH.toLowerCase(), LINE, CALL_TASK.toLowerCase()];
+    if (normalizedChannelsToDisableSet.size > 0) {
+      defaultChannelOrder.some((ch) => {
+        if (!normalizedChannelsToDisableSet.has(ch)) {
           defaultChannel = ch;
           return true;
         }
@@ -189,7 +223,8 @@ export class TemplatesV2 extends React.Component { // eslint-disable-line react/
       this.setState({selectedChannel: nextProps.channel, panes });
     }
   }
-  getTemplateDataForGrid = ({templates, handlers, filterContent, channel, isLoading, loadingTip}) => {
+
+  getTemplateDataForGrid = ({ templates, handlers, filterContent, channel, isLoading, loadingTip }) => {
     const currentChannel = channel.toUpperCase();
     const cardDataList = templates.map((template) => {
       const templateData =
@@ -215,7 +250,8 @@ export class TemplatesV2 extends React.Component { // eslint-disable-line react/
       </CapSpin>
 
     </div>);
-  }
+  };
+
   getGalleryComponent = (location) => <Gallery location={location} isFullMode={this.props.isFullMode}/>
   getCallTaskComponent = () => (
     <CallTask
@@ -279,6 +315,29 @@ export class TemplatesV2 extends React.Component { // eslint-disable-line react/
     if (messageStrategy !== "X_ENGAGE" && channel === 'facebook' && !isFullMode) {
       return this.getFacebookComponent();
     }
+    const localConfig = this.props.localTemplatesConfig || pick(this.props, LOCAL_TEMPLATE_CONFIG_KEYS_FOR_PICK);
+    const useLocalTemplates = localConfig.useLocalTemplates;
+    if (useLocalTemplates && channel === (this.props.channel || 'sms')) {
+      // Reuse full Templates component (same UI as Redux flow) with local data only
+      const location = { pathname: `/${channel}`, search: '', query: !this.props.isFullMode ? { type: 'embedded', module: 'library' } : {} };
+      return (
+        <Templates
+          key={`${channel}-local`}
+          location={location}
+          route={{ name: channel }}
+          router={this.props.router}
+          isFullMode={this.props.isFullMode}
+          createNew={this.props.createNew}
+          onSelectTemplate={this.props.onSelectTemplate}
+          handlePeviewTemplate={this.props.handlePeviewTemplate}
+          messageStrategy={this.props.messageStrategy}
+          smsRegister={this.props.smsRegister}
+          hideTestAndPreviewBtn={this.props.hideTestAndPreviewBtn}
+          localTemplatesConfig={localConfig}
+        />
+      );
+    }
+
     const location = {pathname: `/${channel}`, search: '', query};
     switch (channel) {
       case 'call_task':
@@ -328,29 +387,55 @@ export class TemplatesV2 extends React.Component { // eslint-disable-line react/
   }
   render() {
     const { isFullMode, className, cap = {}, Global = {}} = this.props;
+    const useLocalTemplates = get(this.props, 'localTemplatesConfig.useLocalTemplates', false);
     const { accessiblePermissions = []} = cap.user || Global.user || {};
     let isCreativeAccessible = true;
     if (!accessiblePermissions.includes(CREATIVES_UI_VIEW)) {
       isCreativeAccessible = false;
     }
+    // Recompute active pane content every render so local-list mode updates
+    // (templates/loading/search UI) are not stuck with the initial cached pane.
+    const panes = this.setChannelContent(this.state.selectedChannel, this.state.panes);
+    const hideChannelTabsForLocalSms = useLocalTemplates && panes.length === 1;
+    const activeLocalPane = hideChannelTabsForLocalSms
+      ? (panes.find(
+        (p) => String(p.key).toLowerCase() === String(this.state.selectedChannel).toLowerCase(),
+      ) || panes[0])
+      : null;
     return (
       !isCreativeAccessible ? <AccessForbidden /> : (
-        <div className={`${className} creatives-templates-container ${isFullMode ? 'fullmode' : 'library-mode'}`} data-testid="cap-wrapper">
-          {isFullMode && <Helmet
-            title={this.props.intl.formatMessage(messages.creatives)}
-            meta={[
-              { name: 'description', content: this.props.intl.formatMessage(messages.creativesDesc) },
-            ]}
-          />}
-          <div className="component-wrapper">
-            {isFullMode && <CapHeader title={<FormattedMessage {...messages.creatives}/>} description={<FormattedMessage {...messages.creativesDesc}/>}/>}
-            <StyledCapTab
-              panes={this.state.panes}
-              onChange={this.channelChange}
-              activeKey={this.state.selectedChannel}
-              defaultActiveKey={this.state.selectedChannel}
-              isFullMode={isFullMode}
+        <div
+          className={`${className} creatives-templates-container ${isFullMode ? 'fullmode' : 'library-mode'}${useLocalTemplates ? ' creatives-templates-container--local-sms' : ''}`}
+          data-testid="cap-wrapper"
+        >
+          {isFullMode && !useLocalTemplates && (
+            <Helmet
+              title={this.props.intl.formatMessage(messages.creatives)}
+              meta={[
+                { name: 'description', content: this.props.intl.formatMessage(messages.creativesDesc) },
+              ]}
             />
+          )}
+          <div className="component-wrapper">
+            {isFullMode && (
+              <CapHeader
+                title={<FormattedMessage {...messages.creatives} />}
+                {...(!useLocalTemplates && {
+                  description: <FormattedMessage {...messages.creativesDesc} />,
+                })}
+              />
+            )}
+            {hideChannelTabsForLocalSms ? (
+              <div className="templates-v2-local-sms-pane">{activeLocalPane?.content}</div>
+            ) : (
+              <StyledCapTab
+                panes={panes}
+                onChange={this.channelChange}
+                activeKey={this.state.selectedChannel}
+                defaultActiveKey={this.state.selectedChannel}
+                isFullMode={isFullMode}
+              />
+            )}
           </div>
         </div>
       )
@@ -380,6 +465,19 @@ TemplatesV2.propTypes = {
   FTPMode: PropTypes.string,
   messageStrategy: PropTypes.string,
   currentOrgDetails: PropTypes.object,
+  restrictPersonalization: PropTypes.bool,
+  isAnonymousType: PropTypes.bool,
+  // Optional: reuse grid UI with local template list (e.g. SMS fallback). Pass object or same keys as individual props.
+  localTemplatesConfig: PropTypes.shape({
+    useLocalTemplates: PropTypes.bool,
+    localTemplates: PropTypes.arrayOf(PropTypes.object),
+    localTemplatesLoading: PropTypes.bool,
+    localTemplatesLoadingTip: PropTypes.string,
+    localTemplatesFilterContent: PropTypes.node,
+    localTemplatesFooterContent: PropTypes.node,
+    localTemplatesOnPageChange: PropTypes.func,
+    localTemplatesUseSkeleton: PropTypes.bool,
+  }),
 };
 
 TemplatesV2.defaultProps = {

package/app/v2Containers/TemplatesV2/tests/TemplatesV2.localTemplates.test.js

@@ -0,0 +1,131 @@
+/**
+ * Embedded SMS template list: localTemplatesConfig + SMS-only channel visibility (RCS SMS fallback).
+ */
+import React from 'react';
+import { injectIntl } from 'react-intl';
+import '@testing-library/jest-dom';
+import cloneDeep from 'lodash/cloneDeep';
+import { Provider } from 'react-redux';
+import { configureStore } from '@capillarytech/vulcan-react-sdk/utils';
+import history from '../../../utils/history';
+import { initialReducer } from '../../../initialReducer';
+import { render, screen } from '../../../utils/test-utils';
+import { TemplatesV2 } from '../index';
+import { Templates, authData, currentOrgDetails as currentOrgDetailsMock } from './mockData';
+import { CHANNELS_TO_HIDE_FOR_SMS_ONLY } from '../../../v2Components/SmsFallback/constants';
+
+const mockTemplates = jest.fn(() => <div data-testid="templates-mock">Templates</div>);
+jest.mock('v2Containers/Templates', () => ({
+  __esModule: true,
+  default: (props) => mockTemplates(props),
+}));
+
+jest.mock('../../../utils/authWrapper', () => ({
+  UserIsAuthenticated: jest.fn((config) => config),
+}));
+
+const ComponentToRender = injectIntl(TemplatesV2);
+const renderComponent = (p) => {
+  const store = configureStore({}, initialReducer, history);
+  return render(
+    <Provider store={store}>
+      <ComponentToRender {...p} />
+    </Provider>,
+  );
+};
+
+describe('TemplatesV2 local SMS templates (embedded)', () => {
+  const templateActions = {
+    templateActions: jest.fn(),
+    deleteTemplate: jest.fn(),
+    getAccountsSettings: jest.fn(),
+    getAllTemplates: jest.fn(),
+    getCdnTransformationConfig: jest.fn(),
+    getDefaultBeeTemplates: jest.fn(),
+    getSenderDetails: jest.fn(),
+    getTemplateDetails: jest.fn(),
+    getUserList: jest.fn(),
+    getWeCrmAccounts: jest.fn(),
+    handleHtmlUpload: jest.fn(),
+    handleZipUpload: jest.fn(),
+    resetAccount: jest.fn(),
+    resetTemplate: jest.fn(),
+    resetTemplateData: jest.fn(),
+    resetTemplateStoreData: jest.fn(),
+    resetUploadData: jest.fn(),
+    setBEETemplate: jest.fn(),
+    setChannelAccount: jest.fn(),
+    setEdmTemplate: jest.fn(),
+    setFacebookAccount: jest.fn(),
+    setViberAccount: jest.fn(),
+    setWeChatAccount: jest.fn(),
+  };
+
+  const baseProps = {
+    cap: {
+      user: { accessiblePermissions: ['CREATIVES_UI_VIEW'] },
+    },
+    actions: { defaultAction: jest.fn(), getTemplates: jest.fn() },
+    Templates,
+    TemplatesList: Templates?.templates,
+    authData,
+    templateActions,
+    isFullMode: false,
+    className: 'embed-test',
+    channel: 'sms',
+    channelsToHide: CHANNELS_TO_HIDE_FOR_SMS_ONLY,
+    channelsToDisable: [],
+    onChannelChange: jest.fn(),
+    enableNewChannels: [],
+    /** Without JP_LOCALE_HIDE_FEATURE so SMS panes are not stripped to Email/Line/Gallery only */
+    currentOrgDetails: {
+      ...currentOrgDetailsMock,
+      accessibleFeatures: (currentOrgDetailsMock.accessibleFeatures || []).filter(
+        (f) => f !== 'JP_LOCALE_HIDE_FEATURE',
+      ),
+    },
+    location: {
+      pathname: 'v2',
+      basename: '/creatives/ui/',
+      query: {},
+    },
+    router: { push: jest.fn() },
+  };
+
+  beforeEach(() => {
+    mockTemplates.mockClear();
+  });
+
+  it('adds local-sms container class and single-pane layout when only SMS is visible', () => {
+    const p = cloneDeep(baseProps);
+    p.localTemplatesConfig = {
+      useLocalTemplates: true,
+      localTemplates: [],
+      localTemplatesLoading: false,
+    };
+    renderComponent(p);
+
+    const wrapper = screen.getByTestId('cap-wrapper');
+    expect(wrapper).toHaveClass('creatives-templates-container--local-sms');
+    expect(document.querySelector('.templates-v2-local-sms-pane')).toBeTruthy();
+    expect(mockTemplates).toHaveBeenCalled();
+  });
+
+  it('passes localTemplatesConfig into Templates for the SMS pane', () => {
+    const localConfig = {
+      useLocalTemplates: true,
+      localTemplates: [{ _id: '1', name: 'A' }],
+      localTemplatesLoading: false,
+    };
+    const p = cloneDeep(baseProps);
+    p.localTemplatesConfig = localConfig;
+    renderComponent(p);
+
+    expect(mockTemplates).toHaveBeenCalled();
+    const passed = mockTemplates.mock.calls.find(
+      (call) => call[0] && call[0].localTemplatesConfig && call[0].localTemplatesConfig.useLocalTemplates,
+    );
+    expect(passed).toBeTruthy();
+    expect(passed[0].localTemplatesConfig).toMatchObject(localConfig);
+  });
+});

package/app/v2Containers/Viber/index.js

@@ -30,7 +30,7 @@ import messages from './messages';
 import creativesMessages from '../CreativesContainer/messages';
 import TagList from '../TagList';
 import CapTagListWithInput from '../../v2Components/CapTagListWithInput';
-import { makeSelectMetaEntities, setInjectedTags, selectCurrentOrgDetails } from '../Cap/selectors';
+import { makeSelectMetaEntities, setInjectedTags } from '../Cap/selectors';
 import {
   ALLOWED_IMAGE_EXTENSIONS_REGEX_VIBER,
   ALLOWED_EXTENSIONS_VIDEO_REGEX_VIBER,
@@ -44,7 +44,6 @@ import {
   NONE,
   mediaRadioOptions,
   buttonRadioOptions,
-  AI_CONTENT_BOT_DISABLED,
 } from './constants';
 import withCreatives from '../../hoc/withCreatives';
 import {
@@ -53,6 +52,7 @@ import {
 import { gtmPush } from '../../utils/gtmTrackers';
 import { VIBER } from '../CreativesContainer/constants';
 import { getCdnUrl } from '../../utils/cdnTransformation';
+import { isAiContentBotDisabled } from '../../utils/common';
 import globalMessages from '../Cap/messages';
 import CapImageUpload from '../../v2Components/CapImageUpload';
 import CapVideoUpload from '../../v2Components/CapVideoUpload';
@@ -81,8 +81,8 @@ export const Viber = (props) => {
     getFormSubscriptionData,
     viberData = {},
     selectedOfferDetails = [],
-    currentOrgDetails,
     eventContextTags,
+    waitEventContextTags,
     // TestAndPreviewSlidebox props
     showTestAndPreviewSlidebox: propsShowTestAndPreviewSlidebox,
     handleTestAndPreview: propsHandleTestAndPreview,
@@ -115,10 +115,7 @@ export const Viber = (props) => {
   const [buttonType, setButtonType] = useState(NONE);
   const [ctaData, setCtadata] = useState({});
   const [isCtaSaved, setIsCtaSaved] = useState(false);
-  const { accessibleFeatures = [] } = currentOrgDetails || {};
-  const isAiContentBotDisabled = accessibleFeatures?.includes(
-    AI_CONTENT_BOT_DISABLED
-  );
+  const aiContentBotDisabled = isAiContentBotDisabled();
 
   const updateImageSrc = React.useCallback((url) => {
     const newUrl = getCdnUrl({url, channelName: 'VIBER'});
@@ -234,9 +231,10 @@ export const Viber = (props) => {
     const { valid, isBraceError } = validateTags({
       content: value,
       tagsParam: tags,
-      injectedTagsParams: injectedTags,
       location,
       tagModule: 'outbound',
+      eventContextTags,
+      waitEventContextTags,
       isFullMode,
     }) || {};
     if (value.trim() === '') {
@@ -292,6 +290,7 @@ export const Viber = (props) => {
           userLocale={localStorage.getItem("jlocale") || "en"}
           selectedOfferDetails={selectedOfferDetails}
           eventContextTags={eventContextTags}
+          waitEventContextTags={waitEventContextTags}
         />
       </CapColumn>
       <div className="viber-textarea-wrapper">
@@ -307,7 +306,7 @@ export const Viber = (props) => {
           cols={2}
           placeholder={formatMessage(messages.enterMessage)}
         />
-        {!isAiContentBotDisabled && (
+        {!aiContentBotDisabled && (
           <CapAskAira.ContentGenerationBot
             text={messageContent || ""}
             setText={(text) => {
@@ -597,6 +596,7 @@ export const Viber = (props) => {
         userLocale={localStorage.getItem("jlocale") || "en"}
         selectedOfferDetails={selectedOfferDetails}
         eventContextTags={eventContextTags}
+        waitEventContextTags={waitEventContextTags}
       />
       <CapColumn className="cta-actions">
         <CapButton
@@ -888,7 +888,6 @@ const mapStateToProps = createStructuredSelector({
   injectedTags: setInjectedTags(),
   viberData: makeSelectViber(),
   viber: makeSelectCreateViber(),
-  currentOrgDetails: selectCurrentOrgDetails(),
 });
 
 const mapDispatchToProps = (dispatch) => ({

package/app/v2Containers/Viber/index.scss

@@ -121,5 +121,5 @@
   margin-top: $CAP_SPACE_08;
 }
 .test-and-preview-button {
-  margin-left: 120px;
+  margin-left: 6.25rem;
 }