From d9883b1435d01f74755cef0c31900f5c87d15c10 Mon Sep 17 00:00:00 2001
From: Thomas Zemp <tzemp@baosystems.com>
Date: Tue, 9 Feb 2021 20:17:28 +0100
Subject: [PATCH 1/5] feat: handle dashboard views with system settings
 [DHIS2-7630]

conditions ItemHeaderButtons display based on system settings
---
 src/api/settings.js                           | 12 +++-
 .../VisualizationItem/ItemHeaderButtons.js    | 66 +++++++++++++------
 .../__tests__/ItemHeaderButtons.spec.js       | 13 ++++
 3 files changed, 69 insertions(+), 22 deletions(-)

diff --git a/src/api/settings.js b/src/api/settings.js
index 6ed0672cd..7de570d90 100644
--- a/src/api/settings.js
+++ b/src/api/settings.js
@@ -1,9 +1,19 @@
 export const DEFAULT_SETTINGS = {
     displayNameProperty: 'displayName',
+    keyDashboardContextMenuItemOpenInRelevantApp: true,
+    keyDashboardContextMenuItemShowInterpretationsAndDetails: true,
+    keyDashboardContextMenuItemSwitchViewType: true,
+    keyDashboardContextMenuItemViewFullscreen: true,
     keyGatherAnalyticalObjectStatisticsInDashboardViews: false,
 }
 
-const SYSTEM_SETTINGS = ['keyGatherAnalyticalObjectStatisticsInDashboardViews']
+const SYSTEM_SETTINGS = [
+    'keyDashboardContextMenuItemOpenInRelevantApp',
+    'keyDashboardContextMenuItemShowInterpretationsAndDetails',
+    'keyDashboardContextMenuItemSwitchViewType',
+    'keyDashboardContextMenuItemViewFullscreen',
+    'keyGatherAnalyticalObjectStatisticsInDashboardViews',
+]
 
 const query = {
     resource: 'systemSettings',
diff --git a/src/components/Item/VisualizationItem/ItemHeaderButtons.js b/src/components/Item/VisualizationItem/ItemHeaderButtons.js
index cb5f8576d..c35bdb8a0 100644
--- a/src/components/Item/VisualizationItem/ItemHeaderButtons.js
+++ b/src/components/Item/VisualizationItem/ItemHeaderButtons.js
@@ -31,6 +31,7 @@ import {
     hasMapView,
     getAppName,
 } from '../../../modules/itemTypes'
+import { useSystemSettings } from '../../SystemSettingsProvider'
 
 const iconFill = { fill: colors.grey600 }
 
@@ -41,6 +42,8 @@ const ItemHeaderButtons = props => {
 
     const { item, visualization, onSelectActiveType, activeType } = props
 
+    const { settings } = useSystemSettings()
+
     const isTrackerType = isTrackerDomainType(item.type)
 
     const onViewTable = () => {
@@ -117,6 +120,18 @@ const ItemHeaderButtons = props => {
 
     const buttonRef = createRef()
 
+    const fullscreenAllowed =
+        props.fullscreenSupported &&
+        settings.keyDashboardContextMenuItemViewFullscreen
+
+    if (
+        !settings.keyDashboardContextMenuItemOpenInRelevantApp &&
+        !settings.keyDashboardContextMenuItemShowInterpretationsAndDetails &&
+        !settings.keyDashboardContextMenuItemSwitchViewType &&
+        !fullscreenAllowed
+    ) {
+        return null
+    }
     return props.isFullscreen ? (
         <Button small secondary onClick={props.onToggleFullscreen}>
             <ExitFullscreen />
@@ -141,28 +156,37 @@ const ItemHeaderButtons = props => {
                     onClickOutside={closeMenu}
                 >
                     <Menu>
-                        {canViewAs && (
-                            <>
-                                <ViewAsMenuItems />
-                                <Divider />
-                            </>
+                        {canViewAs &&
+                            settings.keyDashboardContextMenuItemSwitchViewType && (
+                                <>
+                                    <ViewAsMenuItems />
+                                    {(settings.keyDashboardContextMenuItemShowInterpretationsAndDetails ||
+                                        settings.keyDashboardContextMenuItemOpenInRelevantApp ||
+                                        fullscreenAllowed) && <Divider />}
+                                </>
+                            )}
+                        {settings.keyDashboardContextMenuItemOpenInRelevantApp && (
+                            <MenuItem
+                                dense
+                                icon={
+                                    <LaunchIcon style={{ fill: '#6e7a8a' }} />
+                                }
+                                label={i18n.t('Open in {{appName}} app', {
+                                    appName: getAppName(item.type),
+                                })}
+                                href={getLink(item, baseUrl)}
+                                target="_blank"
+                            />
+                        )}
+                        {settings.keyDashboardContextMenuItemShowInterpretationsAndDetails && (
+                            <MenuItem
+                                dense
+                                icon={<SpeechBubble />}
+                                label={interpretationMenuLabel}
+                                onClick={handleInterpretationClick}
+                            />
                         )}
-                        <MenuItem
-                            dense
-                            icon={<LaunchIcon style={{ fill: '#6e7a8a' }} />}
-                            label={i18n.t('Open in {{appName}} app', {
-                                appName: getAppName(item.type),
-                            })}
-                            href={getLink(item, baseUrl)}
-                            target="_blank"
-                        />
-                        <MenuItem
-                            dense
-                            icon={<SpeechBubble />}
-                            label={interpretationMenuLabel}
-                            onClick={handleInterpretationClick}
-                        />
-                        {props.fullscreenSupported && (
+                        {fullscreenAllowed && (
                             <MenuItem
                                 dense
                                 icon={<Fullscreen />}
diff --git a/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js b/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js
index 5b3d3b359..840180908 100644
--- a/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js
+++ b/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js
@@ -8,6 +8,19 @@ jest.mock('../Visualization/plugin', () => ({
     pluginIsAvailable: () => true,
 }))
 
+jest.mock('../../../SystemSettingsProvider', () => ({
+    useSystemSettings: () => {
+        return {
+            settings: {
+                keyDashboardContextMenuItemOpenInRelevantApp: true,
+                keyDashboardContextMenuItemShowInterpretationsAndDetails: true,
+                keyDashboardContextMenuItemSwitchViewType: true,
+                keyDashboardContextMenuItemViewFullscreen: true,
+            },
+        }
+    },
+}))
+
 it('renders correctly when not fullscreen', () => {
     const buttons = shallow(
         <ItemHeaderButtons

From cf2ffb7590e0197b3efb80bc24cfa3feb8b11341 Mon Sep 17 00:00:00 2001
From: Thomas Zemp <tzemp@baosystems.com>
Date: Wed, 10 Feb 2021 11:47:03 +0100
Subject: [PATCH 2/5] fix: use aliases for relevant settings [DHIS2-7630]

---
 .../VisualizationItem/ItemHeaderButtons.js    | 37 +++++++++++--------
 1 file changed, 21 insertions(+), 16 deletions(-)

diff --git a/src/components/Item/VisualizationItem/ItemHeaderButtons.js b/src/components/Item/VisualizationItem/ItemHeaderButtons.js
index c35bdb8a0..806e40a77 100644
--- a/src/components/Item/VisualizationItem/ItemHeaderButtons.js
+++ b/src/components/Item/VisualizationItem/ItemHeaderButtons.js
@@ -43,6 +43,12 @@ const ItemHeaderButtons = props => {
     const { item, visualization, onSelectActiveType, activeType } = props
 
     const { settings } = useSystemSettings()
+    const {
+        keyDashboardContextMenuItemOpenInRelevantApp: openInRelevantApp,
+        keyDashboardContextMenuItemShowInterpretationsAndDetails: showInterpretationsAndDetails,
+        keyDashboardContextMenuItemSwitchViewType: switchViewType,
+        keyDashboardContextMenuItemViewFullscreen: fullscreenAllowedInSettings,
+    } = settings
 
     const isTrackerType = isTrackerDomainType(item.type)
 
@@ -80,6 +86,7 @@ const ItemHeaderButtons = props => {
 
     const type = visualization.type || item.type
     const canViewAs =
+        switchViewType &&
         !isSingleValue(type) &&
         !isYearOverYear(type) &&
         type !== VIS_TYPE_GAUGE &&
@@ -121,13 +128,12 @@ const ItemHeaderButtons = props => {
     const buttonRef = createRef()
 
     const fullscreenAllowed =
-        props.fullscreenSupported &&
-        settings.keyDashboardContextMenuItemViewFullscreen
+        props.fullscreenSupported && fullscreenAllowedInSettings
 
     if (
-        !settings.keyDashboardContextMenuItemOpenInRelevantApp &&
-        !settings.keyDashboardContextMenuItemShowInterpretationsAndDetails &&
-        !settings.keyDashboardContextMenuItemSwitchViewType &&
+        !openInRelevantApp &&
+        !showInterpretationsAndDetails &&
+        !switchViewType &&
         !fullscreenAllowed
     ) {
         return null
@@ -156,16 +162,15 @@ const ItemHeaderButtons = props => {
                     onClickOutside={closeMenu}
                 >
                     <Menu>
-                        {canViewAs &&
-                            settings.keyDashboardContextMenuItemSwitchViewType && (
-                                <>
-                                    <ViewAsMenuItems />
-                                    {(settings.keyDashboardContextMenuItemShowInterpretationsAndDetails ||
-                                        settings.keyDashboardContextMenuItemOpenInRelevantApp ||
-                                        fullscreenAllowed) && <Divider />}
-                                </>
-                            )}
-                        {settings.keyDashboardContextMenuItemOpenInRelevantApp && (
+                        {canViewAs && (
+                            <>
+                                <ViewAsMenuItems />
+                                {(showInterpretationsAndDetails ||
+                                    openInRelevantApp ||
+                                    fullscreenAllowed) && <Divider />}
+                            </>
+                        )}
+                        {openInRelevantApp && (
                             <MenuItem
                                 dense
                                 icon={
@@ -178,7 +183,7 @@ const ItemHeaderButtons = props => {
                                 target="_blank"
                             />
                         )}
-                        {settings.keyDashboardContextMenuItemShowInterpretationsAndDetails && (
+                        {showInterpretationsAndDetails && (
                             <MenuItem
                                 dense
                                 icon={<SpeechBubble />}

From b440c724ccdc25244a189cfa2f58bfb13fe6a5c1 Mon Sep 17 00:00:00 2001
From: Thomas Zemp <tzemp@baosystems.com>
Date: Wed, 10 Feb 2021 11:49:19 +0100
Subject: [PATCH 3/5] fix: add additional unit tests for [DHIS2-7630]

---
 .../VisualizationItem/ItemHeaderButtons.js    |   3 +-
 .../__tests__/ItemHeaderButtons.spec.js       | 209 +++++++++++++++++-
 .../ItemHeaderButtons.spec.js.snap            |  69 ++++++
 3 files changed, 270 insertions(+), 11 deletions(-)

diff --git a/src/components/Item/VisualizationItem/ItemHeaderButtons.js b/src/components/Item/VisualizationItem/ItemHeaderButtons.js
index 806e40a77..5350a2359 100644
--- a/src/components/Item/VisualizationItem/ItemHeaderButtons.js
+++ b/src/components/Item/VisualizationItem/ItemHeaderButtons.js
@@ -36,7 +36,7 @@ import { useSystemSettings } from '../../SystemSettingsProvider'
 const iconFill = { fill: colors.grey600 }
 
 const ItemHeaderButtons = props => {
-    const [menuIsOpen, setMenuIsOpen] = useState(null)
+    const [menuIsOpen, setMenuIsOpen] = useState(props.isOpen)
 
     const { baseUrl } = useConfig()
 
@@ -211,6 +211,7 @@ ItemHeaderButtons.propTypes = {
     activeType: PropTypes.string,
     fullscreenSupported: PropTypes.bool,
     isFullscreen: PropTypes.bool,
+    isOpen: PropTypes.bool,
     item: PropTypes.object,
     visualization: PropTypes.object,
     onSelectActiveType: PropTypes.func,
diff --git a/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js b/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js
index 840180908..479e39d60 100644
--- a/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js
+++ b/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js
@@ -2,26 +2,37 @@ import React from 'react'
 import { shallow } from 'enzyme'
 import toJson from 'enzyme-to-json'
 import ItemHeaderButtons from '../ItemHeaderButtons'
+import { useSystemSettings } from '../../../SystemSettingsProvider'
 
 jest.mock('../Visualization/plugin', () => ({
     getLink: () => 'http://rainbowdash',
     pluginIsAvailable: () => true,
 }))
 
-jest.mock('../../../SystemSettingsProvider', () => ({
-    useSystemSettings: () => {
-        return {
-            settings: {
-                keyDashboardContextMenuItemOpenInRelevantApp: true,
-                keyDashboardContextMenuItemShowInterpretationsAndDetails: true,
-                keyDashboardContextMenuItemSwitchViewType: true,
-                keyDashboardContextMenuItemViewFullscreen: true,
-            },
-        }
+jest.mock('@dhis2/analytics', () => ({
+    isSingleValue: () => {
+        return false
+    },
+    isYearOverYear: () => {
+        return false
     },
 }))
 
+jest.mock('../../../SystemSettingsProvider', () => ({
+    useSystemSettings: jest.fn(),
+}))
+
+const mockSystemSettingsDefault = {
+    settings: {
+        keyDashboardContextMenuItemOpenInRelevantApp: true,
+        keyDashboardContextMenuItemShowInterpretationsAndDetails: true,
+        keyDashboardContextMenuItemSwitchViewType: true,
+        keyDashboardContextMenuItemViewFullscreen: true,
+    },
+}
+
 it('renders correctly when not fullscreen', () => {
+    useSystemSettings.mockImplementationOnce(() => mockSystemSettingsDefault)
     const buttons = shallow(
         <ItemHeaderButtons
             item={{
@@ -42,6 +53,7 @@ it('renders correctly when not fullscreen', () => {
 })
 
 it('renders correctly when fullscreen', () => {
+    useSystemSettings.mockImplementationOnce(() => mockSystemSettingsDefault)
     const buttons = shallow(
         <ItemHeaderButtons
             item={{
@@ -61,3 +73,180 @@ it('renders correctly when fullscreen', () => {
     )
     expect(toJson(buttons)).toMatchSnapshot()
 })
+
+it('renders Menu Items when open', () => {
+    useSystemSettings.mockImplementationOnce(() => mockSystemSettingsDefault)
+    const container = shallow(
+        <ItemHeaderButtons
+            item={{
+                type: 'CHART',
+                chart: { type: 'NOT_YOY', domainType: 'AGGREGATE' },
+            }}
+            visualization={{
+                type: 'SINGLE_VALUE',
+            }}
+            onSelectActiveType={Function.prototype}
+            activeFooter={false}
+            activeType={'CHART'}
+            d2={{}}
+            onToggleFooter={Function.prototype}
+            isFullscreen={false}
+            fullscreenSupported={true}
+            isOpen={true}
+        />
+    )
+
+    expect(toJson(container)).toMatchSnapshot()
+})
+
+it('does not render ViewAsMenuItems Items if settings do not allow', () => {
+    const mockSystemSettings = { settings: {} }
+    mockSystemSettings.settings = Object.assign(
+        {},
+        mockSystemSettingsDefault.settings,
+        {
+            keyDashboardContextMenuItemSwitchViewType: false,
+        }
+    )
+    useSystemSettings.mockImplementationOnce(() => mockSystemSettings)
+    const container = shallow(
+        <ItemHeaderButtons
+            item={{
+                type: 'CHART',
+                chart: { type: 'NOT_YOY', domainType: 'AGGREGATE' },
+            }}
+            visualization={{
+                type: 'SINGLE_VALUE',
+            }}
+            onSelectActiveType={Function.prototype}
+            activeFooter={false}
+            activeType={'CHART'}
+            d2={{}}
+            onToggleFooter={Function.prototype}
+            isFullscreen={false}
+            fullscreenSupported={true}
+            isOpen={true}
+        />
+    )
+    expect(container.find('ViewAsMenuItems').exists()).toBeFalsy()
+})
+
+it('does not let you open in relevant app if settings do not allow', () => {
+    const mockSystemSettings = { settings: {} }
+    mockSystemSettings.settings = Object.assign(
+        {},
+        mockSystemSettingsDefault.settings,
+        {
+            keyDashboardContextMenuItemOpenInRelevantApp: false,
+        }
+    )
+    useSystemSettings.mockImplementationOnce(() => mockSystemSettings)
+    const container = shallow(
+        <ItemHeaderButtons
+            item={{
+                type: 'CHART',
+                chart: { type: 'NOT_YOY', domainType: 'AGGREGATE' },
+            }}
+            visualization={{
+                type: 'SINGLE_VALUE',
+            }}
+            onSelectActiveType={Function.prototype}
+            activeFooter={false}
+            activeType={'CHART'}
+            d2={{}}
+            onToggleFooter={Function.prototype}
+            isFullscreen={false}
+            fullscreenSupported={true}
+            isOpen={true}
+        />
+    )
+    expect(
+        container
+            .findWhere(
+                n =>
+                    n.name() === 'MenuItem' &&
+                    n.prop('label') === 'Open in Data Visualizer app'
+            )
+            .exists()
+    ).toBeFalsy()
+})
+
+it('does not let you open in fullscreen if settings do not allow', () => {
+    const mockSystemSettings = { settings: {} }
+    mockSystemSettings.settings = Object.assign(
+        {},
+        mockSystemSettingsDefault.settings,
+        {
+            keyDashboardContextMenuItemViewFullscreen: false,
+        }
+    )
+    useSystemSettings.mockImplementationOnce(() => mockSystemSettings)
+    const container = shallow(
+        <ItemHeaderButtons
+            item={{
+                type: 'CHART',
+                chart: { type: 'NOT_YOY', domainType: 'AGGREGATE' },
+            }}
+            visualization={{
+                type: 'SINGLE_VALUE',
+            }}
+            onSelectActiveType={Function.prototype}
+            activeFooter={false}
+            activeType={'CHART'}
+            d2={{}}
+            onToggleFooter={Function.prototype}
+            isFullscreen={false}
+            fullscreenSupported={true}
+            isOpen={true}
+        />
+    )
+    expect(
+        container
+            .findWhere(
+                n =>
+                    n.name() === 'MenuItem' &&
+                    n.prop('label') === 'View fullscreen'
+            )
+            .exists()
+    ).toBeFalsy()
+})
+
+it('does not let you open interpretations and details if settings do not allow', () => {
+    const mockSystemSettings = { settings: {} }
+    mockSystemSettings.settings = Object.assign(
+        {},
+        mockSystemSettingsDefault.settings,
+        {
+            keyDashboardContextMenuItemShowInterpretationsAndDetails: false,
+        }
+    )
+    useSystemSettings.mockImplementationOnce(() => mockSystemSettings)
+    const container = shallow(
+        <ItemHeaderButtons
+            item={{
+                type: 'CHART',
+                chart: { type: 'NOT_YOY', domainType: 'AGGREGATE' },
+            }}
+            visualization={{
+                type: 'SINGLE_VALUE',
+            }}
+            onSelectActiveType={Function.prototype}
+            activeFooter={false}
+            activeType={'CHART'}
+            d2={{}}
+            onToggleFooter={Function.prototype}
+            isFullscreen={false}
+            fullscreenSupported={true}
+            isOpen={true}
+        />
+    )
+    expect(
+        container
+            .findWhere(
+                n =>
+                    n.name() === 'MenuItem' &&
+                    n.prop('label') === 'Show interpretations and details'
+            )
+            .exists()
+    ).toBeFalsy()
+})
diff --git a/src/components/Item/VisualizationItem/__tests__/__snapshots__/ItemHeaderButtons.spec.js.snap b/src/components/Item/VisualizationItem/__tests__/__snapshots__/ItemHeaderButtons.spec.js.snap
index e8bd42db8..35816b482 100644
--- a/src/components/Item/VisualizationItem/__tests__/__snapshots__/ItemHeaderButtons.spec.js.snap
+++ b/src/components/Item/VisualizationItem/__tests__/__snapshots__/ItemHeaderButtons.spec.js.snap
@@ -1,5 +1,74 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`renders Menu Items when open 1`] = `
+<Fragment>
+  <div>
+    <Button
+      dataTest="dashboarditem-menu-button"
+      onClick={[Function]}
+      secondary={true}
+      small={true}
+      type="button"
+    >
+      <ThreeDots />
+    </Button>
+  </div>
+  <Popover
+    arrow={false}
+    dataTest="dhis2-uicore-popover"
+    elevation="0 0 1px 0 rgba(64,75,90,0.29), 0 3px 8px -2px rgba(64,75,90,0.30)"
+    maxWidth={360}
+    onClickOutside={[Function]}
+    placement="auto-start"
+    reference={
+      Object {
+        "current": null,
+      }
+    }
+  >
+    <Menu
+      dataTest="dhis2-uicore-menulist"
+    >
+      <ViewAsMenuItems />
+      <Divider
+        dataTest="dhis2-uicore-divider"
+        margin="8px 0"
+      />
+      <MenuItem
+        dataTest="dhis2-uicore-menuitem"
+        dense={true}
+        href="http://rainbowdash"
+        icon={
+          <UNDEFINED
+            style={
+              Object {
+                "fill": "#6e7a8a",
+              }
+            }
+          />
+        }
+        label="Open in Data Visualizer app"
+        target="_blank"
+      />
+      <MenuItem
+        dataTest="dhis2-uicore-menuitem"
+        dense={true}
+        icon={<SpeechBubble />}
+        label="Show interpretations and details"
+        onClick={[Function]}
+      />
+      <MenuItem
+        dataTest="dhis2-uicore-menuitem"
+        dense={true}
+        icon={<Fullscreen />}
+        label="View fullscreen"
+        onClick={[Function]}
+      />
+    </Menu>
+  </Popover>
+</Fragment>
+`;
+
 exports[`renders correctly when fullscreen 1`] = `
 <Button
   dataTest="dhis2-uicore-button"

From bf0421708c6b930b558f79497859f19af9053741 Mon Sep 17 00:00:00 2001
From: Thomas Zemp <tzemp@baosystems.com>
Date: Thu, 11 Feb 2021 18:26:43 +0100
Subject: [PATCH 4/5] fix: rename system settings in initial set

---
 src/api/settings.js                              | 15 +++++++++++++++
 .../Item/VisualizationItem/ItemHeaderButtons.js  | 11 +++++------
 .../__tests__/ItemHeaderButtons.spec.js          | 16 ++++++++--------
 src/components/SystemSettingsProvider.js         | 13 +++++++++++--
 4 files changed, 39 insertions(+), 16 deletions(-)

diff --git a/src/api/settings.js b/src/api/settings.js
index 7de570d90..ab26947b5 100644
--- a/src/api/settings.js
+++ b/src/api/settings.js
@@ -15,6 +15,21 @@ const SYSTEM_SETTINGS = [
     'keyGatherAnalyticalObjectStatisticsInDashboardViews',
 ]
 
+const SYSTEM_SETTINGS_REMAPPINGS = {
+    keyDashboardContextMenuItemOpenInRelevantApp: 'openInRelevantApp',
+    keyDashboardContextMenuItemShowInterpretationsAndDetails:
+        'showInterpretationsAndDetails',
+    keyDashboardContextMenuItemSwitchViewType: 'switchViewType',
+    keyDashboardContextMenuItemViewFullscreen: 'fullscreenAllowedInSettings',
+}
+
+export const renameSystemSettings = settings => {
+    return Object.keys(settings).reduce((mapped, key) => {
+        mapped[SYSTEM_SETTINGS_REMAPPINGS[key] || key] = settings[key]
+        return mapped
+    }, {})
+}
+
 const query = {
     resource: 'systemSettings',
     params: { key: SYSTEM_SETTINGS },
diff --git a/src/components/Item/VisualizationItem/ItemHeaderButtons.js b/src/components/Item/VisualizationItem/ItemHeaderButtons.js
index 5350a2359..db58dd272 100644
--- a/src/components/Item/VisualizationItem/ItemHeaderButtons.js
+++ b/src/components/Item/VisualizationItem/ItemHeaderButtons.js
@@ -42,13 +42,12 @@ const ItemHeaderButtons = props => {
 
     const { item, visualization, onSelectActiveType, activeType } = props
 
-    const { settings } = useSystemSettings()
     const {
-        keyDashboardContextMenuItemOpenInRelevantApp: openInRelevantApp,
-        keyDashboardContextMenuItemShowInterpretationsAndDetails: showInterpretationsAndDetails,
-        keyDashboardContextMenuItemSwitchViewType: switchViewType,
-        keyDashboardContextMenuItemViewFullscreen: fullscreenAllowedInSettings,
-    } = settings
+        openInRelevantApp,
+        showInterpretationsAndDetails,
+        switchViewType,
+        fullscreenAllowedInSettings,
+    } = useSystemSettings().settings
 
     const isTrackerType = isTrackerDomainType(item.type)
 
diff --git a/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js b/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js
index 479e39d60..4a8bf8b72 100644
--- a/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js
+++ b/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js
@@ -24,10 +24,10 @@ jest.mock('../../../SystemSettingsProvider', () => ({
 
 const mockSystemSettingsDefault = {
     settings: {
-        keyDashboardContextMenuItemOpenInRelevantApp: true,
-        keyDashboardContextMenuItemShowInterpretationsAndDetails: true,
-        keyDashboardContextMenuItemSwitchViewType: true,
-        keyDashboardContextMenuItemViewFullscreen: true,
+        openInRelevantApp: true,
+        showInterpretationsAndDetails: true,
+        switchViewType: true,
+        fullscreenAllowedInSettings: true,
     },
 }
 
@@ -105,7 +105,7 @@ it('does not render ViewAsMenuItems Items if settings do not allow', () => {
         {},
         mockSystemSettingsDefault.settings,
         {
-            keyDashboardContextMenuItemSwitchViewType: false,
+            switchViewType: false,
         }
     )
     useSystemSettings.mockImplementationOnce(() => mockSystemSettings)
@@ -137,7 +137,7 @@ it('does not let you open in relevant app if settings do not allow', () => {
         {},
         mockSystemSettingsDefault.settings,
         {
-            keyDashboardContextMenuItemOpenInRelevantApp: false,
+            openInRelevantApp: false,
         }
     )
     useSystemSettings.mockImplementationOnce(() => mockSystemSettings)
@@ -177,7 +177,7 @@ it('does not let you open in fullscreen if settings do not allow', () => {
         {},
         mockSystemSettingsDefault.settings,
         {
-            keyDashboardContextMenuItemViewFullscreen: false,
+            fullscreenAllowedInSettings: false,
         }
     )
     useSystemSettings.mockImplementationOnce(() => mockSystemSettings)
@@ -217,7 +217,7 @@ it('does not let you open interpretations and details if settings do not allow',
         {},
         mockSystemSettingsDefault.settings,
         {
-            keyDashboardContextMenuItemShowInterpretationsAndDetails: false,
+            showInterpretationsAndDetails: false,
         }
     )
     useSystemSettings.mockImplementationOnce(() => mockSystemSettings)
diff --git a/src/components/SystemSettingsProvider.js b/src/components/SystemSettingsProvider.js
index 29b966d78..86de25789 100644
--- a/src/components/SystemSettingsProvider.js
+++ b/src/components/SystemSettingsProvider.js
@@ -1,7 +1,10 @@
 import React, { useContext, useState, useEffect, createContext } from 'react'
 import PropTypes from 'prop-types'
 import { useDataEngine } from '@dhis2/app-runtime'
-import settingsQuery, { DEFAULT_SETTINGS } from '../api/settings'
+import settingsQuery, {
+    renameSystemSettings,
+    DEFAULT_SETTINGS,
+} from '../api/settings'
 
 export const SystemSettingsCtx = createContext({})
 
@@ -15,7 +18,13 @@ const SystemSettingsProvider = ({ children }) => {
                 systemSettings: settingsQuery,
             })
 
-            setSettings(Object.assign({}, DEFAULT_SETTINGS, systemSettings))
+            setSettings(
+                Object.assign(
+                    {},
+                    renameSystemSettings(DEFAULT_SETTINGS),
+                    renameSystemSettings(systemSettings)
+                )
+            )
         }
         fetchData()
     }, [])

From 9acc3162e2fc338de4eea30e8a60cebc869d02c0 Mon Sep 17 00:00:00 2001
From: Thomas Zemp <tzemp@baosystems.com>
Date: Thu, 11 Feb 2021 18:43:00 +0100
Subject: [PATCH 5/5] fix: add unit test for ItemHeaderButtons to be null when
 appropriate

---
 .../__tests__/ItemHeaderButtons.spec.js       | 33 +++++++++++++++++++
 1 file changed, 33 insertions(+)

diff --git a/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js b/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js
index 4a8bf8b72..d7f464a09 100644
--- a/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js
+++ b/src/components/Item/VisualizationItem/__tests__/ItemHeaderButtons.spec.js
@@ -250,3 +250,36 @@ it('does not let you open interpretations and details if settings do not allow',
             .exists()
     ).toBeFalsy()
 })
+
+it('does not render buttons if all relevant settings are false', () => {
+    const mockSystemSettings = {
+        settings: {
+            openInRelevantApp: false,
+            showInterpretationsAndDetails: false,
+            switchViewType: false,
+            fullscreenAllowedInSettings: false,
+        },
+    }
+
+    useSystemSettings.mockImplementationOnce(() => mockSystemSettings)
+    const buttons = shallow(
+        <ItemHeaderButtons
+            item={{
+                type: 'CHART',
+                chart: { type: 'NOT_YOY', domainType: 'AGGREGATE' },
+            }}
+            visualization={{
+                type: 'SINGLE_VALUE',
+            }}
+            onSelectActiveType={Function.prototype}
+            activeFooter={false}
+            activeType={'CHART'}
+            d2={{}}
+            onToggleFooter={Function.prototype}
+            isFullscreen={false}
+            fullscreenSupported={true}
+            isOpen={true}
+        />
+    )
+    expect(toJson(buttons)).toBeFalsy()
+})