fix: hidden widgets emoty text and styles

dhis2 · Jul 30, 2024 · ab0a6ba · ab0a6ba
1 parent 6a170a4
commit ab0a6ba
Show file tree

Hide file tree

Showing 5 changed files with 30 additions and 16 deletions.
diff --git a/i18n/en.pot b/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: 2024-07-18T08:06:52.377Z\n"
-"PO-Revision-Date: 2024-07-18T08:06:52.377Z\n"
+"POT-Creation-Date: 2024-07-30T08:56:19.469Z\n"
+"PO-Revision-Date: 2024-07-30T08:56:19.469Z\n"
 
 msgid "Choose one or more dates..."
 msgstr "Choose one or more dates..."
@@ -366,11 +366,11 @@ msgstr "Registered person"
 msgid "validation failed"
 msgstr "validation failed"
 
-msgid "No feedback"
-msgstr "No feedback"
+msgid "No feedback for this event yet"
+msgstr "No feedback for this event yet"
 
-msgid "No indicator output"
-msgstr "No indicator output"
+msgid "No indicator output for this event yet"
+msgstr "No indicator output for this event yet"
 
 msgid "Generate new event"
 msgstr "Generate new event"
@@ -783,12 +783,6 @@ msgstr "There was an error loading the page"
 msgid "Choose an organisation unit to start reporting"
 msgstr "Choose an organisation unit to start reporting"
 
-msgid "No feedback for this event yet"
-msgstr "No feedback for this event yet"
-
-msgid "No indicator output for this event yet"
-msgstr "No indicator output for this event yet"
-
 msgid "Program stage is invalid"
 msgstr "Program stage is invalid"
 

diff --git a/src/core_modules/capture-core/components/DataEntry/DataEntry.component.js b/src/core_modules/capture-core/components/DataEntry/DataEntry.component.js
@@ -62,10 +62,15 @@ const styles = theme => ({
         position: 'relative',
         flexGrow: 1,
         width: theme.typography.pxToRem(300),
-        margin: theme.typography.pxToRem(10),
+        '& > div > div > *:not(:first-child)': {
+            marginTop: '10px',
+        },
         marginRight: 0,
     },
     verticalOutputsContainer: {
+        '& > *': {
+            marginTop: '10px',
+        },
         marginBottom: theme.typography.pxToRem(10),
     },
     dataEntrySectionContainer: {

diff --git a/src/core_modules/capture-core/components/DataEntry/dataEntryOutput/withDataEntryOutput.js b/src/core_modules/capture-core/components/DataEntry/dataEntryOutput/withDataEntryOutput.js
@@ -21,7 +21,7 @@ const getDataEntryOutput = (InnerComponent: React.ComponentType<any>, Output: Re
             return dataEntryOutputs ? [...dataEntryOutputs, output] : [output];
         };
         getOutput = (key: any) => (
-            <div style={{ marginTop: 10 }} key={key}>
+            <div key={key}>
                 {/* $FlowFixMe[cannot-spread-inexact] automated comment */}
                 <Output
                     key={key}

diff --git a/src/core_modules/capture-core/components/DataEntry/dataEntryOutput/withFeedbackOutput.js b/src/core_modules/capture-core/components/DataEntry/dataEntryOutput/withFeedbackOutput.js
@@ -25,7 +25,14 @@ const getFeedbackOutput = () =>
 
         render = () => {
             const feedback = this.getItems();
-            return <WidgetFeedback feedback={feedback} emptyText={i18n.t('No feedback')} />;
+            const hasItems = feedback.length > 0;
+            return (
+                <div>
+                    {hasItems &&
+                        <WidgetFeedback feedback={feedback} emptyText={i18n.t('No feedback for this event yet')} />
+                    }
+                </div>
+            );
         }
     };
 

diff --git a/src/core_modules/capture-core/components/DataEntry/dataEntryOutput/withIndicatorOutput.js b/src/core_modules/capture-core/components/DataEntry/dataEntryOutput/withIndicatorOutput.js
@@ -25,7 +25,15 @@ const getIndicatorOutput = () =>
 
         render = () => {
             const indicators = this.getItems();
-            return <WidgetIndicator indicators={indicators} emptyText={i18n.t('No indicator output')} />;
+            const hasItems = indicators.length > 0;
+            return (
+                <div>
+                    {hasItems &&
+                        <WidgetIndicator indicators={indicators} emptyText={i18n.t('No indicator output for this event yet')} />
+                    }
+                </div>
+
+            );
         }
     };