fix: render both label and value for DISPLAYTEXT feedback

apps/playground/d2.config.js

@@ -1,7 +1,7 @@
 /** @type {import('@dhis2/cli-app-scripts').D2Config} */
 const config = {
     type: 'app',
-    title: 'Program Rule Playground',
+    title: 'Program Rules Playground',
     entryPoints: {
         app: './src/AppWrapper.tsx',
     },

apps/playground/i18n/en.pot

@@ -5,8 +5,8 @@ msgstr ""
 "Content-Type: text/plain; charset=utf-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1)\n"
-"POT-Creation-Date: 2026-08-01T09:46:39.955Z\n"
-"PO-Revision-Date: 2026-08-01T09:46:39.955Z\n"
+"POT-Creation-Date: 2026-08-02T13:21:32.021Z\n"
+"PO-Revision-Date: 2026-08-02T13:21:32.021Z\n"
 
 msgid "Enrollment"
 msgstr "Enrollment"
@@ -51,9 +51,6 @@ msgstr "Event"
 msgid "Search by name, code, or ID"
 msgstr "Search by name, code, or ID"
 
-msgid "None"
-msgstr "None"
-
 msgid "Program"
 msgstr "Program"
 
@@ -63,9 +60,6 @@ msgstr "Type"
 msgid "Stages"
 msgstr "Stages"
 
-msgid "Rules"
-msgstr "Rules"
-
 msgid "Last updated"
 msgstr "Last updated"
 
@@ -178,12 +172,8 @@ msgstr "{{sourceLabel}} · {{ruleName}}"
 msgid "Program indicators"
 msgstr "Program indicators"
 
-msgid ""
-"Pick a program to open its forms and watch its rules evaluate. Nothing is "
-"saved unless you ask for it."
-msgstr ""
-"Pick a program to open its forms and watch its rules evaluate. Nothing is "
-"saved unless you ask for it."
+msgid "Pick a program to open its forms and watch its rules evaluate."
+msgstr "Pick a program to open its forms and watch its rules evaluate."
 
 msgid "Error loading programs"
 msgstr "Error loading programs"

apps/playground/package.json

@@ -1,5 +1,5 @@
 {
-    "name": "playground",
+    "name": "program-rules-playground",
     "version": "0.0.0",
     "description": "",
     "license": "BSD-3-Clause",

apps/playground/src/components/rules/RuleFeedbackList.tsx

@@ -38,18 +38,8 @@ function FeedbackRow({
             </span>
             <div className="flex min-w-0 flex-col gap-0.5">
                 <span className="text-sm leading-snug text-dhis2-grey-900">
-                    {item.type === 'text' ? (
-                        <strong className="font-semibold">
-                            {item.content}
-                        </strong>
-                    ) : (
-                        <>
-                            <strong className="font-semibold">
-                                {item.content}:{' '}
-                            </strong>
-                            {item.value}
-                        </>
-                    )}
+                    <strong className="font-semibold">{item.content}</strong>
+                    {item.value ? <>: {item.value}</> : null}
                 </span>
                 <span className="text-xs text-dhis2-grey-600">
                     {ruleName

components/dhis2-ui/src/components/FormFeedback.tsx

@@ -13,12 +13,12 @@ function FeedbackPanel({ title, items }: { title: string; items: FeedbackItem[]
             <h3 style={{ margin: '0 0 var(--spacers-dp8)' }}>{title}</h3>
             {items.map((item) => (
                 <NoticeBox key={`${item.location}:${item.content}`} title={item.content}>
-                    {item.type === 'keyValuePair' ? (
+                    {item.value ? (
                         <>
                             <strong>{item.content}</strong>: {item.value}
                         </>
                     ) : (
-                        item.value
+                        item.content
                     )}
                 </NoticeBox>
             ))}

components/mantine/src/components/FormFeedback.tsx

@@ -13,16 +13,18 @@ function FeedbackPanel({ title, items }: { title: string; items: FeedbackItem[]
             <Title order={5}>{title}</Title>
             {items.map((item) => (
                 <Alert key={`${item.location}:${item.content}`} title={item.content} color="blue">
-                    {item.type === 'keyValuePair' ? (
-                        <Text>
-                            <Text span fw={600}>
-                                {item.content}
-                            </Text>
-                            : {item.value}
-                        </Text>
-                    ) : (
-                        <Text>{item.value}</Text>
-                    )}
+                    <Text>
+                        {item.value ? (
+                            <>
+                                <Text span fw={600}>
+                                    {item.content}
+                                </Text>
+                                : {item.value}
+                            </>
+                        ) : (
+                            item.content
+                        )}
+                    </Text>
                 </Alert>
             ))}
         </Stack>

components/mui/src/components/FormFeedback.tsx

@@ -16,12 +16,12 @@ function FeedbackPanel({ title, items }: { title: string; items: FeedbackItem[]
             <Stack spacing={1}>
                 {items.map((item) => (
                     <Alert key={`${item.location}:${item.content}`} severity="info">
-                        {item.type === 'keyValuePair' ? (
+                        {item.value ? (
                             <>
                                 <strong>{item.content}</strong>: {item.value}
                             </>
                         ) : (
-                            item.value
+                            item.content
                         )}
                     </Alert>
                 ))}