From 1f4c41ddf132914a617d086a6d5e97962648f70e Mon Sep 17 00:00:00 2001
From: Flaminia Cavallo <flaminia@dhis2.org>
Date: Wed, 16 Oct 2024 14:11:13 +0200
Subject: [PATCH] fix: small fixes

---
 src/config/field-overrides/dataSet.js | 34 ++++++++++-----------------
 1 file changed, 12 insertions(+), 22 deletions(-)

diff --git a/src/config/field-overrides/dataSet.js b/src/config/field-overrides/dataSet.js
index 2a29fcff4..e8c8fb676 100644
--- a/src/config/field-overrides/dataSet.js
+++ b/src/config/field-overrides/dataSet.js
@@ -65,7 +65,7 @@ class RenderAsTabsSettings extends React.Component {
         const addCustomText = event.target.value
         const customText =
             addCustomText
-                ? {header: undefined, subheader: undefined, alignemt: 'center'}
+                ? {header: undefined, subheader: undefined, align: 'center'}
                 : undefined
 
         const newDisplayOptions = {
@@ -75,9 +75,9 @@ class RenderAsTabsSettings extends React.Component {
         this.updateDisplayOption(newDisplayOptions)
     }
 
-    onCustomTextAlignmentChanged = (event) =>  {
+    onCustomTextChanged = (event, field) =>  {
         const customText =
-            {...this.state.displayOptions.customText,  align: event.target.value}
+            {...this.state.displayOptions.customText,  [field]: event.target.value}
 
         const newDisplayOptions = {
             ...this.state.displayOptions,
@@ -86,27 +86,17 @@ class RenderAsTabsSettings extends React.Component {
         this.updateDisplayOption(newDisplayOptions)
     }
 
+    onCustomTextAlignmentChanged = (event) =>  {
+        this.onCustomTextChanged(event, 'align')
+    }
 
-    onCustomTextHeaderChanged = (event) =>  {
-        const customText =
-            {...this.state.displayOptions.customText, header: event.target.value}
 
-        const newDisplayOptions = {
-            ...this.state.displayOptions,
-            customText
-        }
-        this.updateDisplayOption(newDisplayOptions)
+    onCustomTextHeaderChanged = (event) =>  {
+        this.onCustomTextChanged(event, 'header')
     }
 
     onCustomTextSubheaderChanged = (event) =>  {
-        const customText =
-            {...this.state.displayOptions.customText,  subheader: event.target.value}
-
-        const newDisplayOptions = {
-            ...this.state.displayOptions,
-            customText
-        }
-        this.updateDisplayOption(newDisplayOptions)
+        this.onCustomTextChanged(event, 'subheader')
     }
 
     render() {
@@ -157,7 +147,7 @@ class RenderAsTabsSettings extends React.Component {
                     onChange={this.onCustomTextAlignmentChanged}
                     name="customTextAlignment"
                     defaultSelected={
-                        (state.displayOptions && state.displayOptions.customText && state.displayOptions.customText.align) || 'left'}
+                        (state.displayOptions && state.displayOptions.customText && state.displayOptions.customText.align) || 'center'}
                 >
                     <RadioButton
                         key='left'
@@ -182,14 +172,14 @@ class RenderAsTabsSettings extends React.Component {
                 {state.displayOptions && state.displayOptions.customText &&
                 <div style={customTextCssStyles}>
                     <TextField
-                    value={(this.state.displayOptions && state.displayOptions.customText &&
+                    value={(state.displayOptions && state.displayOptions.customText &&
                         state.displayOptions.customText.header) || ""}
                     fullWidth={false}
                     onChange={this.onCustomTextHeaderChanged}
                     floatingLabelText={this.translate('data_set_title')}
                     />
                     <TextField
-                        value={(this.state.displayOptions && state.displayOptions.customText &&
+                        value={(state.displayOptions && state.displayOptions.customText &&
                             state.displayOptions.customText.subheader) || ""}
                         fullWidth={false}
                         onChange={this.onCustomTextSubheaderChanged}