From e3149c6812a4bd426e8010997e543f412145d0f2 Mon Sep 17 00:00:00 2001 From: Claude Date: Fri, 4 Sep 2026 16:49:30 +0000 Subject: [PATCH] fix(dvz-ui): comma-join array attributes in editor preview postMessage TCDICORE-601: the Tabbed Posts Gutenberg block's editor live preview showed incorrectly-filtered posts because PreviewComponent.tsx JSON.stringify'd array attributes (e.g. categories: [5,7] -> "[5,7]") when relaying them into the preview iframe via postMessage, while the front-end save path joins arrays with commas ("5,7"). The bracketed JSON string flowed unnormalized into the REST query builder, producing a malformed request (&category=[5,7]) that WordPress could not parse. Array-typed attributes are now comma-joined to match the front-end format; JSON.stringify is preserved for non-array object attributes. Co-Authored-By: Claude Sonnet 5 Claude-Session: https://claude.ai/code/session_01Djs2dCDdodPfCVcoXjbL8c --- .changeset/tabbed-posts-preview-category-fix.md | 5 +++++ packages/dvz-ui/src/layout/PreviewComponent.tsx | 4 +++- 2 files changed, 8 insertions(+), 1 deletion(-) create mode 100644 .changeset/tabbed-posts-preview-category-fix.md diff --git a/.changeset/tabbed-posts-preview-category-fix.md b/.changeset/tabbed-posts-preview-category-fix.md new file mode 100644 index 000000000..0daff65b4 --- /dev/null +++ b/.changeset/tabbed-posts-preview-category-fix.md @@ -0,0 +1,5 @@ +--- +"@devgateway/dvz-ui-react": patch +--- + +Fix TCDICORE-601: the Gutenberg block editor's live preview for Tabbed Posts (and other blocks with array attributes such as `categories`) sent array attribute values to the preview iframe as JSON-stringified arrays (e.g. `"[5,7]"`), while the published front end joins them as comma-separated strings (`"5,7"`). The mismatch produced malformed REST query parameters (`&category=[5,7]`) that WordPress could not parse, so the live preview showed incorrectly-filtered posts even though the published page rendered correctly. Array attributes are now comma-joined in `PreviewComponent.tsx` to match the front-end save format; non-array object attributes are unaffected. diff --git a/packages/dvz-ui/src/layout/PreviewComponent.tsx b/packages/dvz-ui/src/layout/PreviewComponent.tsx index a0088b656..51be2cc5c 100644 --- a/packages/dvz-ui/src/layout/PreviewComponent.tsx +++ b/packages/dvz-ui/src/layout/PreviewComponent.tsx @@ -28,7 +28,9 @@ const PreviewComponentParameterParser = () => { const newParams: Record = { ...paramPropsRef.current }; Object.keys(data).forEach(k => { newParams["data-" + k.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase()] = - typeof data[k] === 'object' ? JSON.stringify(data[k]) : data[k]; + typeof data[k] === 'object' + ? (Array.isArray(data[k]) ? data[k].join(',') : JSON.stringify(data[k])) + : data[k]; }); setParamProps(newParams); }