From 9cef52f9e91659c65da1e5b09a57473b535bb322 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bj=C3=B8rn=20Sandvik?= <bjorn@mastermaps.com>
Date: Wed, 2 Aug 2023 09:36:59 +0200
Subject: [PATCH 1/2] chore: PeriodTypeSelect as functional component

---
 src/components/periods/PeriodTypeSelect.js | 51 +++++++++++++++++++++-
 1 file changed, 50 insertions(+), 1 deletion(-)

diff --git a/src/components/periods/PeriodTypeSelect.js b/src/components/periods/PeriodTypeSelect.js
index 98917ca65..55729122f 100644
--- a/src/components/periods/PeriodTypeSelect.js
+++ b/src/components/periods/PeriodTypeSelect.js
@@ -1,10 +1,58 @@
 import i18n from '@dhis2/d2-i18n'
 import PropTypes from 'prop-types'
-import React, { Component } from 'react'
+import React, { useEffect } from 'react'
 import { RELATIVE_PERIODS } from '../../constants/periods.js'
 import { getPeriodTypes, getRelativePeriods } from '../../util/periods.js'
 import { SelectField } from '../core/index.js'
 
+const PeriodTypeSelect = ({
+    onChange,
+    className,
+    errorText,
+    hiddenPeriods,
+    period,
+    value,
+}) => {
+    useEffect(() => {
+        const relativePeriodType = {
+            id: RELATIVE_PERIODS,
+            name: i18n.t('Relative'),
+        }
+
+        if (!value && period) {
+            if (getRelativePeriods().find((p) => p.id === period.id)) {
+                // false will not clear the period dropdown
+                onChange(relativePeriodType, false)
+            }
+        } else if (!value) {
+            // set relativePeriods as default
+            onChange(relativePeriodType)
+        }
+    }, [value, period, onChange])
+
+    return (
+        <SelectField
+            label={i18n.t('Period type')}
+            items={getPeriodTypes(hiddenPeriods)}
+            value={value}
+            onChange={onChange}
+            className={className}
+            errorText={!value && errorText ? errorText : null}
+            dataTest="periodtypeselect"
+        />
+    )
+}
+
+PeriodTypeSelect.propTypes = {
+    onChange: PropTypes.func.isRequired,
+    className: PropTypes.string,
+    errorText: PropTypes.string,
+    hiddenPeriods: PropTypes.array,
+    period: PropTypes.object,
+    value: PropTypes.string,
+}
+
+/*
 class PeriodTypeSelect extends Component {
     static propTypes = {
         onChange: PropTypes.func.isRequired,
@@ -50,5 +98,6 @@ class PeriodTypeSelect extends Component {
         )
     }
 }
+*/
 
 export default PeriodTypeSelect

From 2c42821916ad77814dbf9f11e6996f41408fdb82 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bj=C3=B8rn=20Sandvik?= <bjorn@mastermaps.com>
Date: Tue, 8 Aug 2023 14:46:07 +0200
Subject: [PATCH 2/2] chore: remove old code

---
 src/components/periods/PeriodTypeSelect.js | 48 ----------------------
 1 file changed, 48 deletions(-)

diff --git a/src/components/periods/PeriodTypeSelect.js b/src/components/periods/PeriodTypeSelect.js
index 55729122f..3c04c6e98 100644
--- a/src/components/periods/PeriodTypeSelect.js
+++ b/src/components/periods/PeriodTypeSelect.js
@@ -52,52 +52,4 @@ PeriodTypeSelect.propTypes = {
     value: PropTypes.string,
 }
 
-/*
-class PeriodTypeSelect extends Component {
-    static propTypes = {
-        onChange: PropTypes.func.isRequired,
-        className: PropTypes.string,
-        errorText: PropTypes.string,
-        hiddenPeriods: PropTypes.array,
-        period: PropTypes.object,
-        value: PropTypes.string,
-    }
-
-    componentDidMount() {
-        const { value, period, onChange } = this.props
-        const relativePeriodType = {
-            id: RELATIVE_PERIODS,
-            name: i18n.t('Relative'),
-        }
-
-        if (!value && period) {
-            if (getRelativePeriods().find((p) => p.id === period.id)) {
-                // false will not clear the period dropdown
-                onChange(relativePeriodType, false)
-            }
-        } else if (!value) {
-            // set relativePeriods as default
-            onChange(relativePeriodType)
-        }
-    }
-
-    render() {
-        const { value, hiddenPeriods, onChange, className, errorText } =
-            this.props
-
-        return (
-            <SelectField
-                label={i18n.t('Period type')}
-                items={getPeriodTypes(hiddenPeriods)}
-                value={value}
-                onChange={onChange}
-                className={className}
-                errorText={!value && errorText ? errorText : null}
-                dataTest="periodtypeselect"
-            />
-        )
-    }
-}
-*/
-
 export default PeriodTypeSelect