fix: show tag and tooltip about not applied filters (DHIS2-13858)

dhis2 · Mar 19, 2024 · 1734549 · 1734549
1 parent 602c670
commit 1734549
Show file tree

Hide file tree

Showing 2 changed files with 48 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-02-26T14:42:02.563Z\n"
-"PO-Revision-Date: 2024-02-26T14:42:02.563Z\n"
+"POT-Creation-Date: 2024-03-19T12:31:03.302Z\n"
+"PO-Revision-Date: 2024-03-19T12:31:03.302Z\n"
 
 msgid "Untitled dashboard"
 msgstr "Untitled dashboard"
@@ -71,6 +71,12 @@ msgstr "Filters are not applied to line list dashboard items"
 msgid "Filters not applied"
 msgstr "Filters not applied"
 
+msgid "Only Period and Organisation unit filters can be applied to this item"
+msgstr "Only Period and Organisation unit filters can be applied to this item"
+
+msgid "Some filters not applied"
+msgstr "Some filters not applied"
+
 msgid "There was a problem loading this dashboard item"
 msgstr "There was a problem loading this dashboard item"
 

diff --git a/src/components/Item/VisualizationItem/Item.js b/src/components/Item/VisualizationItem/Item.js
@@ -1,3 +1,4 @@
+import { VIS_TYPE_OUTLIER_TABLE } from '@dhis2/analytics'
 import i18n from '@dhis2/d2-i18n'
 import { Tag, Tooltip } from '@dhis2/ui'
 import PropTypes from 'prop-types'
@@ -20,7 +21,9 @@ import {
 import {
     getDataStatisticsName,
     getItemTypeForVis,
+    CHART,
     EVENT_VISUALIZATION,
+    VISUALIZATION,
 } from '../../../modules/itemTypes.js'
 import { sGetIsEditing } from '../../../reducers/editDashboard.js'
 import { sGetItemActiveType } from '../../../reducers/itemActiveTypes.js'
@@ -203,19 +206,42 @@ class Item extends Component {
                 />
             ) : null
 
-        const tags =
-            isViewMode(dashboardMode) &&
-            Object.keys(itemFilters).length &&
-            !showNoFiltersOverlay &&
-            activeType === EVENT_VISUALIZATION ? (
-                <Tooltip
-                    content={i18n.t(
-                        'Filters are not applied to line list dashboard items'
-                    )}
-                >
-                    <Tag negative>{i18n.t('Filters not applied')}</Tag>
-                </Tooltip>
-            ) : null
+        const getTags = (item) => {
+            if (isViewMode(dashboardMode) && Object.keys(itemFilters).length) {
+                switch (activeType) {
+                    case EVENT_VISUALIZATION: {
+                        return !showNoFiltersOverlay ? (
+                            <Tooltip
+                                content={i18n.t(
+                                    'Filters are not applied to line list dashboard items'
+                                )}
+                            >
+                                <Tag negative>
+                                    {i18n.t('Filters not applied')}
+                                </Tag>
+                            </Tooltip>
+                        ) : null
+                    }
+                    case CHART:
+                    case VISUALIZATION: {
+                        return item.visualization.type ===
+                            VIS_TYPE_OUTLIER_TABLE ? (
+                            <Tooltip
+                                content={i18n.t(
+                                    'Only Period and Organisation unit filters can be applied to this item'
+                                )}
+                            >
+                                <Tag negative>
+                                    {i18n.t('Some filters not applied')}
+                                </Tag>
+                            </Tooltip>
+                        ) : null
+                    }
+                }
+            }
+
+            return null
+        }
 
         return (
             <>
@@ -226,7 +252,7 @@ class Item extends Component {
                     ref={this.headerRef}
                     dashboardMode={dashboardMode}
                     isShortened={item.shortened}
-                    tags={tags}
+                    tags={getTags(item)}
                 />
                 <FatalErrorBoundary
                     message={i18n.t(