feat: legend key (DHIS2-11239) (#1839)

Adds the latest DV plugin and Analytics versions
Wraps the DV plugin in the necessary css class

.gitignore

@@ -7,6 +7,7 @@ docs/*
 # misc
 .DS_Store
 .env*.local
+.env
 .idea
 *.iml
 .vscode

package.json

@@ -5,7 +5,7 @@
     "private": true,
     "license": "BSD-3-Clause",
     "dependencies": {
-        "@dhis2/analytics": "^19.0.1",
+        "@dhis2/analytics": "^20.0.2",
         "@dhis2/app-runtime": "^2.8.0",
         "@dhis2/app-runtime-adapter-d2": "^1.1.0",
         "@dhis2/d2-i18n": "^1.1.0",
@@ -15,7 +15,7 @@
         "@dhis2/d2-ui-rich-text": "^7.3.1",
         "@dhis2/d2-ui-sharing-dialog": "^7.3.1",
         "@dhis2/d2-ui-translation-dialog": "^7.3.1",
-        "@dhis2/data-visualizer-plugin": "^37.6.0",
+        "@dhis2/data-visualizer-plugin": "^37.6.1",
         "@dhis2/ui": "^6.10.4",
         "classnames": "^2.3.1",
         "d2": "^31.10.0",

src/components/Item/VisualizationItem/Visualization/DataVisualizerPlugin.js

@@ -2,6 +2,7 @@ import PropTypes from 'prop-types'
 import React, { Suspense, useState, useEffect, useCallback } from 'react'
 import { useUserSettings } from '../../../UserSettingsProvider'
 import LoadingMask from './LoadingMask'
+import classes from './styles/DataVisualizerPlugin.module.css'
 import VisualizationErrorMessage from './VisualizationErrorMessage'
 
 const VisualizationPlugin = React.lazy(() =>
@@ -44,14 +45,16 @@ const DataVisualizerPlugin = ({
     return (
         <Suspense fallback={<div />}>
             {!visualizationLoaded && <LoadingMask style={style} />}
-            <VisualizationPlugin
-                visualization={visualization}
-                forDashboard={true}
-                userSettings={userSettings}
-                style={style}
-                onLoadingComplete={onLoadingComplete}
-                onError={onError}
-            />
+            <div className={classes.wrapper}>
+                <VisualizationPlugin
+                    visualization={visualization}
+                    forDashboard={true}
+                    userSettings={userSettings}
+                    style={style}
+                    onLoadingComplete={onLoadingComplete}
+                    onError={onError}
+                />
+            </div>
         </Suspense>
     )
 }

src/components/Item/VisualizationItem/Visualization/styles/DataVisualizerPlugin.module.css

@@ -0,0 +1,8 @@
+.wrapper {
+    display: flex;
+    justify-content: center;
+    height: 100%;
+    overflow: hidden;
+    position: relative;
+    flex-grow: 1;
+}

yarn.lock

@@ -2064,28 +2064,10 @@
     classnames "^2.3.1"
     prop-types "^15.7.2"
 
-"@dhis2/analytics@^19.0.1":
-  version "19.0.3"
-  resolved "https://registry.yarnpkg.com/@dhis2/analytics/-/analytics-19.0.3.tgz#956e456b6a67991e6e969f9d86f517ef26d36b50"
-  integrity sha512-9d7Dn3fSJrztkWO3g31/ENJJeoKDAV/nPc9fQh98WOkJ8j1/FjSiveHLoQvuwjmqLHTi9juCY4F0MGhzyeUSbQ==
-  dependencies:
-    "@dhis2/d2-ui-favorites-dialog" "^7.3.0"
-    "@dhis2/d2-ui-org-unit-dialog" "^7.3.0"
-    "@dhis2/d2-ui-sharing-dialog" "^7.2.0"
-    "@dhis2/d2-ui-translation-dialog" "^7.3.0"
-    classnames "^2.3.1"
-    d2-utilizr "^0.2.16"
-    d3-color "^1.2.3"
-    highcharts "^9.1.2"
-    lodash "^4.17.21"
-    mathjs "^9.4.2"
-    react-beautiful-dnd "^10.1.1"
-    resize-observer-polyfill "^1.5.1"
-
-"@dhis2/analytics@^20.0.0":
-  version "20.0.1"
-  resolved "https://registry.yarnpkg.com/@dhis2/analytics/-/analytics-20.0.1.tgz#78e477c0b508a2adebd93f8b4263eb0e0b88e185"
-  integrity sha512-cVbKb/O0EKYjARI2g+HnUAUzye4vselNQQ8HrpN+bJcM3xLiA4rc0nrqbgwZ+y+W0HufrrDE+ByBjy+pE8u1fg==
+"@dhis2/analytics@^20.0.2":
+  version "20.0.2"
+  resolved "https://registry.yarnpkg.com/@dhis2/analytics/-/analytics-20.0.2.tgz#0619ffdba59db03df176ae0c2a7d8d5b55fb68b7"
+  integrity sha512-oN7Fo2BE0PIKbaEUFVoED54v71lnmOpdeK00DPlEvG5vB/97pe+tmONz5imW2vkZGwmS/fqcF7C680GV4iRuOQ==
   dependencies:
     "@dhis2/d2-ui-favorites-dialog" "^7.3.0"
     "@dhis2/d2-ui-org-unit-dialog" "^7.3.0"
@@ -2370,7 +2352,7 @@
     recompose "^0.26.0"
     rxjs "^5.5.7"
 
-"@dhis2/d2-ui-translation-dialog@^7.3.0", "@dhis2/d2-ui-translation-dialog@^7.3.1":
+"@dhis2/d2-ui-translation-dialog@^7.3.1":
   version "7.3.1"
   resolved "https://registry.yarnpkg.com/@dhis2/d2-ui-translation-dialog/-/d2-ui-translation-dialog-7.3.1.tgz#aa10fad9e0cbf134ecc02b7dee6b9e07fa4edae3"
   integrity sha512-yApQUlj6F3Ll5zkdcnqspAm6m7KosL6Vbj7qa6rHooz/Dvu8fA2Isg/wqYN+ZuKmutaTpX26B7zlN4l1OOP9yw==
@@ -2384,12 +2366,12 @@
     react-select "^2.0.0"
     rxjs "^5.5.7"
 
-"@dhis2/data-visualizer-plugin@^37.6.0":
-  version "37.6.0"
-  resolved "https://registry.yarnpkg.com/@dhis2/data-visualizer-plugin/-/data-visualizer-plugin-37.6.0.tgz#f2d1b3a99a2dcbaef606ff2dad4cde63999040d5"
-  integrity sha512-txl7AlxQ/WubDsUr63PPGtIZsgrSLLtdA4BjnE9sqo47vAvkRLSxEkFqp9zOp/o4pRql/dq6LvqJSba0X3SyAg==
+"@dhis2/data-visualizer-plugin@^37.6.1":
+  version "37.6.1"
+  resolved "https://registry.yarnpkg.com/@dhis2/data-visualizer-plugin/-/data-visualizer-plugin-37.6.1.tgz#e050ead95b02a1239c1ad7d6c6155559631a102b"
+  integrity sha512-yXNDVKmHiPSygemotwU9msQgOZ6TuVoAijbOrIuiz4lYawvu8fAXMbbYScqana/WWJP4l/ooWg16Uh2CBMdYyw==
   dependencies:
-    "@dhis2/analytics" "^20.0.0"
+    "@dhis2/analytics" "^20.0.2"
     "@dhis2/app-runtime" "^2.8.0"
     "@dhis2/d2-i18n" "^1.1.0"
     "@dhis2/ui" "^6.9.0"