@capillarytech/creatives-library 8.0.345-alpha.12 → 8.0.345-alpha.13

package/v2Containers/SmsTrai/Edit/index.scss

@@ -1,121 +0,0 @@
-@import '~@capillarytech/cap-ui-library/styles/_variables';
-
-.sms-trai-segmented-editor {
-  .ant-input {
-    margin-bottom: 0.125rem;
-  }
-}
-
-/*
- * DLT SMS fallback edit only: mirror RCS rich-card message box (`.cap-rcs-creatives` + default
- * VarSegment `rcs-edit-template-message-input` / `rcs-edit-template-message-split`).
- */
-.sms-trai-edit-rcs-fallback {
-  width: 100%;
-
-  .rcs_text_area_wrapper {
-    position: relative;
-    width: 100%;
-  }
-
-  .rcs_text_area_wrapper .rcs-edit-template-message-input {
-    background-color: $CAP_G10;
-    padding: $CAP_SPACE_12 $CAP_SPACE_16;
-  }
-
-  .rcs_text_area_wrapper .rcs-edit-template-message-split {
-    margin-bottom: $CAP_SPACE_08;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    color: $FONT_COLOR_03;
-    font-weight: 500;
-  }
-
-  .rcs_text_area_wrapper .rcs-edit-template-message-input .ant-input,
-  .rcs_text_area_wrapper .rcs-edit-template-message-input textarea.ant-input {
-    width: 100%;
-    box-sizing: border-box;
-    min-height: 2.5rem;
-    padding-top: $CAP_SPACE_08;
-    padding-bottom: $CAP_SPACE_08;
-    border-color: $CAP_G07;
-    box-shadow: none;
-    overflow: hidden;
-  }
-
-  .rcs_text_area_wrapper .rcs-edit-template-message-input .ant-input:focus,
-  .rcs_text_area_wrapper .rcs-edit-template-message-input .ant-input:active,
-  .rcs_text_area_wrapper .rcs-edit-template-message-input textarea.ant-input:focus,
-  .rcs_text_area_wrapper .rcs-edit-template-message-input textarea.ant-input:active {
-    border-color: $CAP_G07;
-    box-shadow: none;
-    outline: none;
-  }
-
-  /*
-   * DLT per-slot hint: long selector (under CapSpin + message row) for specificity without !important.
-   */
-  .rcs_text_area_wrapper .rcs-edit-template-message-input .var-segment-message-editor__var-slot {
-    display: flex;
-    flex-direction: column;
-    align-items: stretch;
-  }
-
-  .rcs_text_area_wrapper
-    .rcs-edit-template-message-input
-    .var-segment-message-editor__var-slot
-    span.sms-trai-rcs-fallback-var-hint {
-    display: block;
-    box-sizing: border-box;
-    flex-shrink: 0;
-    margin-top: $CAP_SPACE_04;
-    margin-left: auto;
-    margin-right: 0;
-    width: fit-content;
-    max-width: 100%;
-    text-align: right;
-    color: $FONT_COLOR_02;
-    font-weight: 400;
-    font-size: 0.75rem;
-    line-height: 1rem;
-    opacity: 0.92;
-  }
-
-  /* Footer “1 SMS (n characters)” — match RCS message typography, not muted gray */
-  .rcs-character-count,
-  .rcs-character-count--compact {
-    color: $FONT_COLOR_03;
-    font-weight: 500;
-  }
-}
-
-.rcs-character-count {
-  display: block;
-  margin-top: $CAP_SPACE_16;
-  margin-bottom: $CAP_SPACE_04;
-  text-align: right;
-  color: $FONT_COLOR_02;
-  width: 100%;
-}
-
-.rcs-character-count--compact {
-  font-size: 0.75rem;
-  line-height: 1rem;
-  font-weight: 400;
-}
-
-/* Non–RCS fallback: segmented editor shell + character count row (was inline styles on CapRow) */
-.sms-trai-editor-segment-row {
-  background-color: $CAP_G10;
-  padding: $CAP_SPACE_16;
-}
-
-.sms-trai-length-row {
-  display: flex;
-  justify-content: flex-end;
-  margin-top: $CAP_SPACE_04;
-}
-
-.sms-trai-edit-bottom-spacer {
-  margin-bottom: 6.25rem;
-}

package/v2Containers/Templates/TemplatesActionBar.js

@@ -1,101 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import CapInput from '@capillarytech/cap-ui-library/CapInput';
-import CapButton from '@capillarytech/cap-ui-library/CapButton';
-
-/**
- * Reusable action bar for template pickers.
- * Layout and spacing live in `_templates.scss` (`.action-container`, `.action-container__toolbar-row`).
- * Default search field width: `.action-container__toolbar-row .search-text` (13.125rem).
- * Pass `searchInputClassName` / `searchInputStyle` to override (defaults match Templates list: 210px per master).
- */
-const TemplatesActionBar = ({
-  searchValue,
-  onSearchChange,
-  onSearch,
-  onClear,
-  searchPlaceholder,
-  searchInputClassName,
-  searchInputStyle,
-  ctaLabel,
-  onCtaClick,
-  ctaDisabled,
-  ctaClassName,
-  ctaNode,
-  children,
-  showCta = true,
-}) => (
-  <div className="action-container">
-    <div className="action-container__toolbar-row">
-      {searchPlaceholder && (
-        <CapInput.Search
-          className={['search-text', searchInputClassName].filter(Boolean).join(' ')}
-          placeholder={searchPlaceholder}
-          value={searchValue}
-          onChange={onSearchChange}
-          /* antd `Input` (used by CapInput.Search) has no `onSearch`; only `Input.Search` does. */
-          onPressEnter={(e) => {
-            if (onSearch) {
-              const v = e?.target && 'value' in e.target ? e.target.value : searchValue;
-              onSearch(v);
-            }
-          }}
-          onSearch={onSearch}
-          onClear={onClear}
-          onScroll={(e) => e.stopPropagation()}
-        />
-      )}
-      {children}
-    </div>
-    {showCta && (
-      <div>
-        {ctaNode || (
-          <CapButton
-            className={ctaClassName}
-            type="primary"
-            disabled={ctaDisabled}
-            onClick={onCtaClick}
-          >
-            {ctaLabel}
-          </CapButton>
-        )}
-      </div>
-    )}
-  </div>
-);
-
-TemplatesActionBar.propTypes = {
-  searchValue: PropTypes.string,
-  onSearchChange: PropTypes.func,
-  onSearch: PropTypes.func,
-  onClear: PropTypes.func,
-  searchPlaceholder: PropTypes.string,
-  searchInputClassName: PropTypes.string,
-  searchInputStyle: PropTypes.object,
-  ctaLabel: PropTypes.node,
-  onCtaClick: PropTypes.func,
-  ctaDisabled: PropTypes.bool,
-  ctaClassName: PropTypes.string,
-  ctaNode: PropTypes.node,
-  children: PropTypes.node,
-  showCta: PropTypes.bool,
-};
-
-TemplatesActionBar.defaultProps = {
-  searchValue: '',
-  onSearchChange: () => {},
-  onSearch: () => {},
-  onClear: () => {},
-  searchPlaceholder: '',
-  searchInputClassName: '',
-  searchInputStyle: { width: '210px' },
-  ctaLabel: null,
-  onCtaClick: () => {},
-  ctaDisabled: false,
-  ctaClassName: '',
-  ctaNode: null,
-  children: null,
-};
-
-export default TemplatesActionBar;
-

package/v2Containers/Templates/tests/TemplatesActionBar.test.js

@@ -1,120 +0,0 @@
-/**
- * @jest-environment jsdom
- */
-import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react';
-import '@testing-library/jest-dom';
-import TemplatesActionBar from '../TemplatesActionBar';
-
-jest.mock('@capillarytech/cap-ui-library/CapInput', () => {
-  const React = require('react');
-  function Search(props) {
-    return React.createElement('input', {
-      'data-testid': 'cap-input-search',
-      value: props?.value,
-      placeholder: props?.placeholder,
-      onChange: props?.onChange,
-      onKeyDown: (e) => {
-        if (e.key === 'Enter' && props.onPressEnter) {
-          props.onPressEnter(e);
-        }
-      },
-    });
-  }
-  function CapInput() {
-    return null;
-  }
-  CapInput.Search = Search;
-  return { __esModule: true, default: CapInput };
-});
-
-jest.mock('@capillarytech/cap-ui-library/CapButton', () => {
-  const React = require('react');
-  return function CapButton(props) {
-    return React.createElement('button', {
-      type: 'button',
-      'data-testid': 'cta',
-      onClick: props?.onClick,
-      disabled: props?.disabled,
-    }, props?.children);
-  };
-});
-
-describe('TemplatesActionBar', () => {
-  it('renders search when searchPlaceholder is set', () => {
-    render(
-      <TemplatesActionBar
-        searchPlaceholder="Find templates"
-        searchValue="hi"
-        ctaLabel="Create"
-      />,
-    );
-    expect(screen.getByTestId('cap-input-search')).toHaveAttribute('placeholder', 'Find templates');
-  });
-
-  it('omits search when searchPlaceholder is empty', () => {
-    const { container } = render(
-      <TemplatesActionBar searchPlaceholder="" ctaLabel="Go" />,
-    );
-    expect(container.querySelector('[data-testid="cap-input-search"]')).toBeNull();
-  });
-
-  it('fires onSearchChange and onCtaClick', () => {
-    const onSearchChange = jest.fn();
-    const onCtaClick = jest.fn();
-    render(
-      <TemplatesActionBar
-        searchPlaceholder="S"
-        onSearchChange={onSearchChange}
-        ctaLabel="New"
-        onCtaClick={onCtaClick}
-      />,
-    );
-    fireEvent.change(screen.getByTestId('cap-input-search'), { target: { value: 'x' } });
-    fireEvent.click(screen.getByTestId('cta'));
-    expect(onSearchChange).toHaveBeenCalled();
-    expect(onCtaClick).toHaveBeenCalled();
-  });
-
-  it('fires onSearch when Enter is pressed (antd Input has no native onSearch)', () => {
-    const onSearch = jest.fn();
-    render(
-      <TemplatesActionBar
-        searchPlaceholder="S"
-        searchValue="query"
-        onSearch={onSearch}
-        ctaLabel="New"
-      />,
-    );
-    const input = screen.getByTestId('cap-input-search');
-    fireEvent.keyDown(input, { key: 'Enter', code: 'Enter' });
-    expect(onSearch).toHaveBeenCalledWith('query');
-  });
-
-  it('renders ctaNode instead of default button when provided', () => {
-    render(
-      <TemplatesActionBar
-        searchPlaceholder="S"
-        ctaNode={<span data-testid="custom-cta">Custom</span>}
-      />,
-    );
-    expect(screen.getByTestId('custom-cta')).toBeInTheDocument();
-    expect(screen.queryByTestId('cta')).toBeNull();
-  });
-
-  it('hides CTA area when showCta is false', () => {
-    const { container } = render(
-      <TemplatesActionBar searchPlaceholder="S" showCta={false} ctaLabel="X" />,
-    );
-    expect(container.querySelector('[data-testid="cta"]')).toBeNull();
-  });
-
-  it('renders children in toolbar row', () => {
-    render(
-      <TemplatesActionBar searchPlaceholder="S" ctaLabel="C">
-        <span data-testid="child">extra</span>
-      </TemplatesActionBar>,
-    );
-    expect(screen.getByTestId('child')).toBeInTheDocument();
-  });
-});

package/v2Containers/Templates/tests/smsTemplatesListApi.test.js

@@ -1,180 +0,0 @@
-import * as Api from '../../../services/api';
-import { isTraiDLTEnable } from '../../../utils/common';
-
-jest.mock('../../../services/api', () => ({
-  getAllTemplates: jest.fn(),
-}));
-
-jest.mock('../../../utils/common', () => ({
-  isTraiDLTEnable: jest.fn(),
-}));
-
-import {
-  buildSmsTemplatesListQueryParams,
-  fetchSmsTemplatesFromQuery,
-  fetchSmsTemplatesListPage,
-  SMS_TEMPLATES_LIST_SORT_MOST_RECENT,
-} from '../utils/smsTemplatesListApi';
-
-describe('smsTemplatesListApi', () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  describe('buildSmsTemplatesListQueryParams', () => {
-    it('includes traiEnable when TRAI DLT is enabled', () => {
-      isTraiDLTEnable.mockReturnValue(true);
-      const q = buildSmsTemplatesListQueryParams({
-        page: 1,
-        perPage: 25,
-        name: 'x',
-        sortBy: SMS_TEMPLATES_LIST_SORT_MOST_RECENT,
-        isFullMode: true,
-        smsRegister: {},
-      });
-      expect(q).toEqual({
-        page: 1,
-        perPage: 25,
-        sortBy: SMS_TEMPLATES_LIST_SORT_MOST_RECENT,
-        name: 'x',
-        traiEnable: true,
-      });
-    });
-
-    it('omits traiEnable when TRAI DLT is disabled', () => {
-      isTraiDLTEnable.mockReturnValue(false);
-      const q = buildSmsTemplatesListQueryParams({
-        page: 2,
-        perPage: 10,
-        isFullMode: false,
-        smsRegister: null,
-      });
-      expect(q.traiEnable).toBeUndefined();
-      expect(q.name).toBe('');
-      expect(q.sortBy).toBe(SMS_TEMPLATES_LIST_SORT_MOST_RECENT);
-    });
-  });
-
-  describe('fetchSmsTemplatesFromQuery', () => {
-    it('returns channelTemplates, weCRMTemplate, and raw; maps intl copy on names', async () => {
-      Api.getAllTemplates.mockResolvedValue({
-        response: {
-          templates: [{ name: 'Copy of A', _id: '1' }],
-          unMapped: { u: 1 },
-          totalCount: 5,
-        },
-      });
-
-      const out = await fetchSmsTemplatesFromQuery(
-        { page: 1, perPage: 25 },
-        'Kopie',
-      );
-
-      expect(Api.getAllTemplates).toHaveBeenCalledWith({
-        channel: 'Sms',
-        queryParams: { page: 1, perPage: 25 },
-      });
-      expect(out.weCRMTemplate).toEqual({ u: 1 });
-      expect(out.raw.response.templates[0].name).toBe('Copy of A');
-      expect(out.channelTemplates.templates[0].name).toBe('Kopie A');
-      expect(out.channelTemplates.totalCount).toBe(5);
-    });
-
-    it('skips name mapping when intlCopyOf is empty', async () => {
-      Api.getAllTemplates.mockResolvedValue({
-        response: {
-          templates: [{ name: 'Copy of A' }],
-        },
-      });
-      const out = await fetchSmsTemplatesFromQuery({ page: 1 }, '');
-      expect(out.channelTemplates.templates[0].name).toBe('Copy of A');
-    });
-
-    it('handles missing response.templates', async () => {
-      Api.getAllTemplates.mockResolvedValue({ response: {} });
-      const out = await fetchSmsTemplatesFromQuery({}, '');
-      expect(out.channelTemplates.templates).toEqual([]);
-    });
-
-    it('uses empty response when raw.response is missing', async () => {
-      Api.getAllTemplates.mockResolvedValue({});
-      const out = await fetchSmsTemplatesFromQuery({}, '');
-      expect(out.channelTemplates.templates).toEqual([]);
-      expect(out.weCRMTemplate).toBeUndefined();
-    });
-
-    it('does not map names when intlCopyOf is set but templates list is empty', async () => {
-      Api.getAllTemplates.mockResolvedValue({
-        response: { templates: [] },
-      });
-      const out = await fetchSmsTemplatesFromQuery({ page: 1 }, 'X');
-      expect(out.channelTemplates.templates).toEqual([]);
-    });
-
-    it('uses empty string when template name is missing during intl mapping', async () => {
-      Api.getAllTemplates.mockResolvedValue({
-        response: {
-          templates: [{ _id: 'n', name: undefined }],
-        },
-      });
-      const out = await fetchSmsTemplatesFromQuery({ page: 1 }, 'Lbl');
-      expect(out.channelTemplates.templates[0].name).toBe('');
-    });
-  });
-
-  describe('fetchSmsTemplatesListPage', () => {
-    it('falls back to total when totalCount is absent', async () => {
-      isTraiDLTEnable.mockReturnValue(false);
-      Api.getAllTemplates.mockResolvedValue({
-        response: {
-          templates: [{ _id: 'a' }],
-          total: 7,
-        },
-      });
-
-      const page = await fetchSmsTemplatesListPage({
-        page: 1,
-        perPage: 25,
-        name: '',
-        sortBy: SMS_TEMPLATES_LIST_SORT_MOST_RECENT,
-        isFullMode: true,
-        smsRegister: {},
-        intlCopyOf: '',
-      });
-
-      expect(page.templates).toEqual([{ _id: 'a' }]);
-      expect(page.totalCount).toBe(7);
-    });
-
-    it('uses totalCount when set', async () => {
-      isTraiDLTEnable.mockReturnValue(false);
-      Api.getAllTemplates.mockResolvedValue({
-        response: {
-          templates: [],
-          totalCount: 12,
-        },
-      });
-      const page = await fetchSmsTemplatesListPage({
-        page: 1,
-        perPage: 25,
-        isFullMode: false,
-        smsRegister: {},
-      });
-      expect(page.totalCount).toBe(12);
-    });
-
-    it('normalizes total to 0 when missing counts', async () => {
-      isTraiDLTEnable.mockReturnValue(false);
-      Api.getAllTemplates.mockResolvedValue({
-        response: { templates: [] },
-      });
-      const page = await fetchSmsTemplatesListPage({
-        page: 1,
-        perPage: 25,
-        isFullMode: false,
-        smsRegister: {},
-      });
-      expect(page.totalCount).toBe(0);
-    });
-  });
-});

package/v2Containers/Templates/utils/smsTemplatesListApi.js

@@ -1,79 +0,0 @@
-import get from 'lodash/get';
-import * as Api from '../../../services/api';
-import { COPY_OF } from '../../../constants/unified';
-import { isTraiDLTEnable } from '../../../utils/common';
-
-/** Matches Templates `getAllTemplates` default for SMS. */
-export const SMS_TEMPLATES_LIST_SORT_MOST_RECENT = 'Most Recent';
-
-/**
- * Same query shape as Redux `GET_ALL_TEMPLATES` for channel Sms (DLT vs non-DLT via traiEnable).
- */
-export function buildSmsTemplatesListQueryParams({
-  page,
-  perPage,
-  name = '',
-  sortBy = SMS_TEMPLATES_LIST_SORT_MOST_RECENT,
-  isFullMode,
-  smsRegister,
-}) {
-  const traiDlt = isTraiDLTEnable(isFullMode, smsRegister);
-  return {
-    page,
-    perPage,
-    sortBy,
-    name: name || '',
-    ...(traiDlt ? { traiEnable: true } : {}),
-  };
-}
-
-/**
- * SMS list for Redux saga: uses queryParams already built by Templates (incl. traiEnable).
- * Applies the same "Copy of" → intl label as the former inline saga logic.
- */
-export async function fetchSmsTemplatesFromQuery(queryParams, intlCopyOf = '') {
-  const raw = await Api.getAllTemplates({ channel: 'Sms', queryParams });
-  const response = raw.response || {};
-  let templates = get(response, 'templates', []) || [];
-  if (intlCopyOf && templates.length) {
-    templates = templates.map((template) => ({
-      ...template,
-      name: (template.name || '').replace(new RegExp(COPY_OF, 'g'), intlCopyOf),
-    }));
-  }
-  const channelTemplates = { ...response, templates };
-  return {
-    channelTemplates,
-    weCRMTemplate: response.unMapped,
-    raw,
-  };
-}
-
-/**
- * SMS list for the RCS SMS fallback picker only.
- * Called from `useLocalTemplateList` in SmsFallback — keeps data in component state and pairs with
- * `localTemplatesConfig` / `useLocalTemplates` in TemplatesV2. Does **not** use GET_ALL_TEMPLATES saga.
- * Same HTTP call shape as `fetchSmsTemplatesFromQuery` (used by the main SMS GET_ALL_TEMPLATES saga).
- */
-export async function fetchSmsTemplatesListPage({
-  page,
-  perPage,
-  name,
-  sortBy,
-  isFullMode,
-  smsRegister,
-  intlCopyOf = '',
-}) {
-  const queryParams = buildSmsTemplatesListQueryParams({
-    page,
-    perPage,
-    name,
-    sortBy,
-    isFullMode,
-    smsRegister,
-  });
-  const { channelTemplates } = await fetchSmsTemplatesFromQuery(queryParams, intlCopyOf);
-  const templates = channelTemplates.templates || [];
-  const totalCount = get(channelTemplates, 'totalCount', get(channelTemplates, 'total', 0)) || 0;
-  return { templates, totalCount };
-}