9d769dfcdd
WhatsApp templates with variables in both a text header and body currently show inputs only for the body. Agents therefore cannot provide the header value in the template composer, even though the API and backend support the corresponding `processed_params.header` payload. The composer now displays text-header variables separately, previews their substituted values, and sends them alongside body parameters. Templates using media headers remain unchanged. Related: https://github.com/chatwoot/utils/pull/65 ### Things to know This PR consumes the released `@chatwoot/utils@0.0.57`, which adds text-header parameter construction and completeness validation. ### How to reproduce 1. Open a WhatsApp template containing text header `Welcome {{1}}` and body variables `{{1}}` and `{{2}}`. 2. Observe that the current composer displays only two body inputs and omits the header input. ### How to test 1. Open the same template in the conversation composer. 2. Confirm one header input and two body inputs are displayed. 3. Fill the values and confirm both the header and body previews update. 4. Send the template and confirm `processed_params` contains `header.1`, `body.1`, and `body.2`. --------- Co-authored-by: Muhsin <12408980+muhsin-k@users.noreply.github.com>
32 lines
1.0 KiB
JavaScript
32 lines
1.0 KiB
JavaScript
import { processVariable, buildWhatsAppProcessedParams } from '@chatwoot/utils';
|
|
|
|
// Constants and pure template helpers are shared with the mobile app via
|
|
// @chatwoot/utils so the logic lives in one place.
|
|
export {
|
|
MEDIA_FORMATS,
|
|
COMPONENT_TYPES,
|
|
findComponentByType,
|
|
processVariable,
|
|
renderTemplatePreview,
|
|
} from '@chatwoot/utils';
|
|
|
|
export const DEFAULT_LANGUAGE = 'en';
|
|
export const DEFAULT_CATEGORY = 'UTILITY';
|
|
|
|
export const allKeysRequired = value => {
|
|
const keys = Object.keys(value);
|
|
return keys.every(key => value[key]);
|
|
};
|
|
|
|
export const replaceTemplateVariables = (templateText, processedParams) => {
|
|
return templateText.replace(/{{([^}]+)}}/g, (match, variable) => {
|
|
const variableKey = processVariable(variable);
|
|
return processedParams.body?.[variableKey] || `{{${variable}}}`;
|
|
});
|
|
};
|
|
|
|
// The media-header flag is derived from the template inside the shared helper;
|
|
// the second argument is kept for backwards-compatible call sites.
|
|
export const buildTemplateParameters = template =>
|
|
buildWhatsAppProcessedParams(template);
|