chore: use engine in postDataStatistics

src/api/dataStatistics.js

@@ -1,5 +1,3 @@
-import { getInstance } from 'd2'
-
 export const apiGetDataStatistics = async (dataEngine, username) => {
     const getDataStatisticsQuery = {
         resource: 'dataStatistics/favorites',
@@ -21,9 +19,19 @@ export const apiGetDataStatistics = async (dataEngine, username) => {
     }
 }
 
-export const apiPostDataStatistics = async (eventType, id) => {
-    const d2 = await getInstance()
-    const url = `dataStatistics?eventType=${eventType}&favorite=${id}`
-
-    d2.Api.getApi().post(url)
+const POST_DATA_STATISTICS_QUERY = {
+    resource: 'dataStatistics',
+    type: 'create',
+    params: ({ eventType, favorite }) => ({
+        eventType,
+        favorite,
+    }),
 }
+
+export const apiPostDataStatistics = async (eventType, favorite, engine) =>
+    await engine.mutate(POST_DATA_STATISTICS_QUERY, {
+        variables: {
+            eventType,
+            favorite,
+        },
+    })

src/api/userDataStore.js

@@ -5,7 +5,7 @@ export const NAMESPACE = 'dashboard'
 export const hasDashboardNamespace = async (d2) =>
     await d2.currentUser.dataStore.has(NAMESPACE)
 
-export const getNamespace = async (d2) => {
+const getNamespace = async (d2) => {
     const hasNamespace = await hasDashboardNamespace(d2)
 
     return hasNamespace

src/components/DashboardsBar/Chip.js

@@ -1,4 +1,4 @@
-import { useDhis2ConnectionStatus } from '@dhis2/app-runtime'
+import { useDhis2ConnectionStatus, useDataEngine } from '@dhis2/app-runtime'
 import { Chip as UiChip, colors, IconStarFilled24 } from '@dhis2/ui'
 import cx from 'classnames'
 import debounce from 'lodash/debounce.js'
@@ -13,6 +13,7 @@ import classes from './styles/Chip.module.css'
 const Chip = ({ starred, selected, label, dashboardId, onClick }) => {
     const { lastUpdated } = useCacheableSection(dashboardId)
     const { isConnected: online } = useDhis2ConnectionStatus()
+    const engine = useDataEngine()
     const chipProps = {
         selected,
     }
@@ -25,7 +26,7 @@ const Chip = ({ starred, selected, label, dashboardId, onClick }) => {
         )
     }
     const debouncedPostStatistics = debounce(
-        () => apiPostDataStatistics('DASHBOARD_VIEW', dashboardId),
+        () => apiPostDataStatistics('DASHBOARD_VIEW', dashboardId, engine),
         500
     )
 

src/components/Item/Item.js

@@ -1,4 +1,5 @@
 import { useCachedDataQuery } from '@dhis2/analytics'
+import { useDataEngine } from '@dhis2/app-runtime'
 import PropTypes from 'prop-types'
 import React from 'react'
 import {
@@ -62,9 +63,10 @@ const getGridItem = (type) => {
 
 export const Item = (props) => {
     const { apps } = useCachedDataQuery()
+    const engine = useDataEngine()
     const GridItem = getGridItem(props.item.type)
 
-    return <GridItem apps={apps} {...props} />
+    return <GridItem apps={apps} {...props} engine={engine} />
 }
 
 Item.propTypes = {

src/components/Item/VisualizationItem/Item.js

@@ -104,7 +104,8 @@ class Item extends Component {
             ) {
                 await apiPostDataStatistics(
                     getDataStatisticsName(this.props.item.type),
-                    getVisualizationId(this.props.item)
+                    getVisualizationId(this.props.item),
+                    this.props.engine
                 )
             }
         } catch (e) {
@@ -329,6 +330,7 @@ Item.propTypes = {
     activeType: PropTypes.string,
     apps: PropTypes.array,
     dashboardMode: PropTypes.string,
+    engine: PropTypes.object,
     gridWidth: PropTypes.number,
     isEditing: PropTypes.bool,
     isRecording: PropTypes.bool,

src/pages/view/ViewDashboard.js

@@ -1,4 +1,4 @@
-import { useDhis2ConnectionStatus } from '@dhis2/app-runtime'
+import { useDhis2ConnectionStatus, useDataEngine } from '@dhis2/app-runtime'
 import i18n from '@dhis2/d2-i18n'
 import { AlertStack, AlertBar } from '@dhis2/ui'
 import cx from 'classnames'
@@ -36,6 +36,7 @@ const ViewDashboard = (props) => {
     const [loadFailed, setLoadFailed] = useState(false)
     const { isConnected: online } = useDhis2ConnectionStatus()
     const { isCached } = useCacheableSection(props.requestedId)
+    const engine = useDataEngine()
 
     useEffect(() => {
         setHeaderbarVisible(true)
@@ -55,13 +56,17 @@ const ViewDashboard = (props) => {
 
     useEffect(() => {
         if (!props.passiveViewRegistered && online) {
-            apiPostDataStatistics('PASSIVE_DASHBOARD_VIEW', props.requestedId)
+            apiPostDataStatistics(
+                'PASSIVE_DASHBOARD_VIEW',
+                props.requestedId,
+                engine
+            )
                 .then(() => {
                     props.registerPassiveView()
                 })
                 .catch((error) => console.info(error))
         }
-    }, [props.passiveViewRegistered])
+    }, [props.passiveViewRegistered, engine])
 
     useEffect(() => {
         const loadDashboard = async () => {