fix: version specific period types (#1820)

Show and hide the correct period types for different versions.

Fix github code quality issue.

Export new period types.

Author: janhenrikoverland

src/components/PeriodDimension/PeriodTransfer.js

@@ -1,7 +1,7 @@
 import { getNowInCalendar } from '@dhis2/multi-calendar-dates'
 import { IconInfo16, NoticeBox, TabBar, Tab, Transfer } from '@dhis2/ui'
 import PropTypes from 'prop-types'
-import React, { useRef, useState, useMemo } from 'react'
+import React, { useCallback, useRef, useState, useMemo } from 'react'
 import PeriodIcon from '../../assets/DimensionItemIcons/PeriodIcon.js' //TODO: Reimplement the icon.js
 import i18n from '../../locales/index.js'
 import {
@@ -20,7 +20,15 @@ import {
     filterEnabledRelativePeriodTypes,
 } from './utils/enabledPeriodTypes.js'
 import { getFixedPeriodsOptions } from './utils/fixedPeriods.js'
-import { MONTHLY, QUARTERLY, filterPeriodTypesById } from './utils/index.js'
+import {
+    FYFEB,
+    FYAUG,
+    FYSEP,
+    MONTHLY,
+    QUARTERLY,
+    WEEKLYFRI,
+    filterPeriodTypesById,
+} from './utils/index.js'
 import { getRelativePeriodsOptions } from './utils/relativePeriods.js'
 
 const RightHeader = ({ infoBoxMessage }) => (
@@ -91,15 +99,20 @@ const PeriodTransfer = ({
         } else {
             const allFixed = getFixedPeriodsOptions(periodsSettings)
             const allRelative = getRelativePeriodsOptions()
+            const v43PeriodTypes = [WEEKLYFRI, FYFEB, FYAUG, FYSEP]
+            const allExcludedPeriodTypes = [
+                ...excludedPeriodTypes,
+                ...v43PeriodTypes,
+            ]
 
             return {
                 filteredFixedOptions: filterPeriodTypesById(
                     allFixed,
-                    excludedPeriodTypes
+                    allExcludedPeriodTypes
                 ),
                 filteredRelativeOptions: filterPeriodTypesById(
                     allRelative,
-                    excludedPeriodTypes
+                    allExcludedPeriodTypes
                 ),
             }
         }
@@ -139,11 +152,14 @@ const PeriodTransfer = ({
     // there is still a pending decision in Temporal regarding which era to use by default: https://github.com/js-temporal/temporal-polyfill/blob/9350ee7dd0d29f329fc097debf923a517c32f813/lib/calendar.ts#L1964
     const defaultFixedPeriodYear = now.eraYear || now.year
 
-    const fixedPeriodConfig = (year) => ({
-        offset: year - defaultFixedPeriodYear,
-        filterFuturePeriods: false,
-        reversePeriods: false,
-    })
+    const fixedPeriodConfig = useCallback(
+        (year) => ({
+            offset: year - defaultFixedPeriodYear,
+            filterFuturePeriods: false,
+            reversePeriods: false,
+        }),
+        [defaultFixedPeriodYear]
+    )
 
     const [userPeriods, setUserPeriods] = useState(null)
     const [isRelative, setIsRelative] = useState(true)
@@ -215,6 +231,7 @@ const PeriodTransfer = ({
         filteredRelativeOptions,
         filteredFixedOptions,
         fixedFilter.year,
+        fixedPeriodConfig,
     ])
 
     const allPeriods = userPeriods ?? derivedPeriods

src/index.js

@@ -353,6 +353,7 @@ export {
     WEEKLY,
     WEEKLYWED,
     WEEKLYTHU,
+    WEEKLYFRI,
     WEEKLYSAT,
     WEEKLYSUN,
     WEEKS_THIS_YEAR,
@@ -364,10 +365,13 @@ export {
     SIXMONTHLYAPR,
     YEARLY,
     FINANCIAL,
-    FYNOV,
-    FYOCT,
-    FYJUL,
+    FYFEB,
     FYAPR,
+    FYJUL,
+    FYAUG,
+    FYSEP,
+    FYOCT,
+    FYNOV,
 } from './components/PeriodDimension/utils/index.js'
 export {
     getRelativePeriodsOptionsById,