@pushwoosh/dumb-components 1.1.219 → 1.1.220

package/RichMessageEditor/slate/DynamicContentElement.js

@@ -3,6 +3,7 @@ import { Transforms } from 'slate';
 import { useSelected, useSlateStatic } from 'slate-react';
 import { findPath } from './helpers';
 import { Chip } from '../../Chip';
+import { isResolvableDc } from '../../shared/dynamicContent';
 const DynamicContentElementComponent = ({
   attributes,
   element,
@@ -14,11 +15,12 @@ const DynamicContentElementComponent = ({
   const {
     tagName
   } = element.dc;
+  const isResolvable = isResolvableDc(element.dc);
   return _jsxs(Chip, {
     ...attributes,
     as: "span",
     contentEditable: false,
-    "$variant": tagName ? 'primary' : 'danger',
+    "$variant": isResolvable ? 'primary' : 'danger',
     "$selected": selected,
     "$onClose": event => {
       event.preventDefault();

package/RichMessageEditor/slate/helpers.d.ts

@@ -41,7 +41,7 @@ export declare function string2content(value: string): SlateEditorContent;
  */
 export declare function content2string(state: SlateEditorContent): string;
 /**
- * Validates if the content has valid dynamic content elements
+ * Validates that every dynamic content element is one the sender can substitute
  * @param value - The Slate editor content to validate
  * @returns True if all dynamic content elements are valid, false otherwise
  */

package/RichMessageEditor/slate/helpers.js

@@ -1,4 +1,4 @@
-import { parseDc, splitDynamicContent, stringifyDc } from '../../shared/dynamicContent';
+import { isResolvableDc, parseDc, splitDynamicContent, stringifyDc } from '../../shared/dynamicContent';
 /**
  * Checks if a Slate node is a custom element
  * @param x - The node to check
@@ -127,14 +127,14 @@ export function content2string(state) {
   }).join('\n');
 }
 /**
- * Validates if the content has valid dynamic content elements
+ * Validates that every dynamic content element is one the sender can substitute
  * @param value - The Slate editor content to validate
  * @returns True if all dynamic content elements are valid, false otherwise
  */
 export function validateContent(value) {
   for (const el of value) {
     if (isElement(el)) {
-      if (el.type === 'dc' && !el.dc.tagName) {
+      if (el.type === 'dc' && !isResolvableDc(el.dc)) {
         return false;
       }
       if (!validateContent(el.children)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pushwoosh/dumb-components",
-  "version": "1.1.219",
+  "version": "1.1.220",
   "description": "React components to build Pushwoosh products",
   "main": "index.js",
   "module": "index.js",

package/shared/dynamicContent/__tests__/token.test.d.ts

@@ -0,0 +1 @@
+export {};

package/shared/dynamicContent/__tests__/token.test.js

@@ -0,0 +1,32 @@
+import { validateContentSting } from '../../../RichMessageEditor/slate/helpers';
+import { isResolvableDc, parseDc } from '../token';
+// The lists below mirror channels/publisher
+// internal/services/dynamiccontentreplacer/constants.go — keep them in sync.
+const caseInsensitiveModifiers = ['capitalizefirst', 'capitalizeallfirst', 'uppercase', 'lowercase', 'regular', 'base64', 'cent', 'dollar', 'comma', 'euro', 'jpy', 'lira'];
+const dateModifiers = ['M-d-y', 'm-d-y', 'M d y', 'M d Y', 'l', 'M d', 'H:i', 'm-d-y H:i'];
+describe('isResolvableDc', () => {
+  test.each(caseInsensitiveModifiers)('accepts %s', modifier => {
+    expect(isResolvableDc(parseDc(`{Name|${modifier}}`))).toBe(true);
+  });
+  test.each(caseInsensitiveModifiers)('accepts %s whatever the case', modifier => {
+    expect(isResolvableDc(parseDc(`{Name|${modifier.toUpperCase()}}`))).toBe(true);
+  });
+  test.each(dateModifiers)('accepts the date modifier %s', modifier => {
+    expect(isResolvableDc(parseDc(`{Name|${modifier}}`))).toBe(true);
+  });
+  test('rejects a date modifier in the wrong case, as the sender does', () => {
+    expect(isResolvableDc(parseDc('{Name|m d y}'))).toBe(false);
+  });
+  test.each([['{Name|}', 'no modifier at all'], ['{Name|nope}', 'a modifier outside the list'], ['{|regular}', 'no tag name']])('rejects %s (%s)', token => {
+    expect(isResolvableDc(parseDc(token))).toBe(false);
+  });
+  test('keeps a default value out of the verdict', () => {
+    expect(isResolvableDc(parseDc('{WalletPassLink|regular|no pass}'))).toBe(true);
+    expect(isResolvableDc(parseDc('{WalletPassLink||no pass}'))).toBe(false);
+  });
+});
+describe('validateContentSting', () => {
+  test.each([['Tap here!\n{WalletSerialNo|regular}', true], ['Tap here!\n{WalletSerialNo|}', false], ['{WalletSerialNo|regular}{WalletPassLink|}', false], ['Hi {{ user.name | upcase }}, plain liquid is not a token', true], ['no tokens at all', true], ['', true]])('%s -> %s', (content, expected) => {
+    expect(validateContentSting(content)).toBe(expected);
+  });
+});

package/shared/dynamicContent/index.d.ts

@@ -1,5 +1,5 @@
 export { DynamicContentChip, type DynamicContentChipProps } from './DynamicContentChip';
 export { DynamicContentText, type DynamicContentTextProps } from './DynamicContentText';
-export { parseDc, splitDynamicContent, stringifyDc } from './token';
+export { isResolvableDc, parseDc, splitDynamicContent, stringifyDc } from './token';
 export { Paragraph } from './styles';
 export type { DynamicContent, DynamicContentPart, DynamicContentTone } from './types';

package/shared/dynamicContent/index.js

@@ -1,4 +1,4 @@
 export { DynamicContentChip } from './DynamicContentChip';
 export { DynamicContentText } from './DynamicContentText';
-export { parseDc, splitDynamicContent, stringifyDc } from './token';
+export { isResolvableDc, parseDc, splitDynamicContent, stringifyDc } from './token';
 export { Paragraph } from './styles';

package/shared/dynamicContent/token.d.ts

@@ -18,3 +18,5 @@ export declare function splitDynamicContent(text: string): DynamicContentPart[];
 export declare function parseDc(value: string): DynamicContent;
 /** Serializes a token back to `{tagName|modifier|defaultValue}`. */
 export declare function stringifyDc(dc: DynamicContent): string;
+/** Whether the sender substitutes this token, or ships it verbatim (dates are case-sensitive, other modifiers are not). */
+export declare function isResolvableDc(dc: DynamicContent): boolean;

package/shared/dynamicContent/token.js

@@ -42,4 +42,14 @@ export function stringifyDc(dc) {
     defaultValue
   } = dc;
   return `{${tagName}|${modifier}${defaultValue ? `|${defaultValue}` : ''}}`;
+}
+const CASE_INSENSITIVE_MODIFIERS = ['capitalizefirst', 'capitalizeallfirst', 'uppercase', 'lowercase', 'regular', 'base64', 'cent', 'dollar', 'comma', 'euro', 'jpy', 'lira'];
+const DATE_MODIFIERS = ['M-d-y', 'm-d-y', 'M d y', 'M d Y', 'l', 'M d', 'H:i', 'm-d-y H:i'];
+/** Whether the sender substitutes this token, or ships it verbatim (dates are case-sensitive, other modifiers are not). */
+export function isResolvableDc(dc) {
+  const {
+    tagName,
+    modifier
+  } = dc;
+  return Boolean(tagName) && (CASE_INSENSITIVE_MODIFIERS.includes(modifier.toLowerCase()) || DATE_MODIFIERS.includes(modifier));
 }