Skip to content

Commit

Permalink
refactor: use generic Plugin component from the platform
Browse files Browse the repository at this point in the history
  • Loading branch information
@edoardo
edoardo committed Jun 22, 2023
1 parent 9d85e90 commit 3091fdd
Showing 1 changed file with 49 additions and 66 deletions.
115 changes: 49 additions & 66 deletions src/components/Item/VisualizationItem/Visualization/IframePlugin.js
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@
import { useConfig } from '@dhis2/app-runtime'
import { useConfig, Plugin } from '@dhis2/app-runtime'
import { useD2 } from '@dhis2/app-runtime-adapter-d2'
import { CenteredContent, CircularLoader } from '@dhis2/ui'
import postRobot from '@krakenjs/post-robot'
import PropTypes from 'prop-types'
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
import { useDispatch, useSelector } from 'react-redux'
import React, { useCallback, useEffect, useMemo, useState } from 'react'
import { useDispatch, useSelector, shallowEqual } from 'react-redux'
import { acAddIframePluginStatus } from '../../../../actions/iframePluginStatus.js'
import {
CHART,
Expand All @@ -15,9 +14,9 @@ import { getPluginOverrides } from '../../../../modules/localStorage.js'
import { useCacheableSection } from '../../../../modules/useCacheableSection.js'
import {
INSTALLATION_STATUS_INSTALLING,
INSTALLATION_STATUS_READY,
// INSTALLATION_STATUS_READY,
INSTALLATION_STATUS_UNKNOWN,
INSTALLATION_STATUS_WILL_NOT_INSTALL,
// INSTALLATION_STATUS_WILL_NOT_INSTALL,
sGetIframePluginStatus,
} from '../../../../reducers/iframePluginStatus.js'
import { useUserSettings } from '../../../UserSettingsProvider.js'
Expand All @@ -38,29 +37,41 @@ const IframePlugin = ({
isFirstOfType,
}) => {
const dispatch = useDispatch()
const iframePluginStatus = useSelector(sGetIframePluginStatus)
const iframePluginStatus = useSelector(sGetIframePluginStatus, shallowEqual)

const { d2 } = useD2()
const { baseUrl } = useConfig()

const { userSettings } = useUserSettings()
const iframeRef = useRef()
const [error, setError] = useState(null)

// When this mounts, check if the dashboard is recording
const { isCached, recordingState } = useCacheableSection(dashboardId)
const [recordOnNextLoad, setRecordOnNextLoad] = useState(
recordingState === 'recording'
)

const prevPluginRef = useRef()

const onError = () => setError('plugin')
// TODO set this to false after first props transfer with true flag
const recordOnNextLoad = recordingState === 'recording'
// const [recordOnNextLoad, setRecordOnNextLoad] = useState(
// recordingState === 'recording'
// )

const pluginType = [CHART, REPORT_TABLE].includes(activeType)
? VISUALIZATION
: activeType
const installationStatus = iframePluginStatus[pluginType]

const onError = () => setError('plugin')
const onInstallationStatusChange = useCallback(
(installationStatus) => {
if (isFirstOfType) {
dispatch(
acAddIframePluginStatus({
pluginType,
status: installationStatus,
})
)
}
},
[dispatch, isFirstOfType, pluginType]
)

const pluginProps = useMemo(
() => ({
Expand All @@ -69,6 +80,7 @@ const IframePlugin = ({
displayProperty: userSettings.displayProperty,
visualization,
onError,
onInstallationStatusChange,

// For caching: ---
// Add user & dashboard IDs to cache ID to avoid removing a cached
Expand All @@ -84,6 +96,7 @@ const IframePlugin = ({
dashboardId,
itemId,
isCached,
onInstallationStatusChange,
recordOnNextLoad,
]
)
Expand All @@ -109,23 +122,25 @@ const IframePlugin = ({

const iframeSrc = getIframeSrc()

useEffect(() => {
// Tell plugin to remove cached data if this dashboard has been removed
// from offline storage
if (iframeRef?.current && !isCached) {
postRobot
.send(iframeRef.current.contentWindow, 'removeCachedData')
.catch((err) => {
// catch error if iframe hasn't loaded yet
const msg = 'No handler found for post message:'
if (err.message.startsWith(msg)) {
return
}
console.error(err)
})
}
}, [isCached])

// TODO figure out how to send this message via Plugin without re-rendering
// useEffect(() => {
// // Tell plugin to remove cached data if this dashboard has been removed
// // from offline storage
// if (iframeRef?.current && !isCached) {
// postRobot
// .send(iframeRef.current.contentWindow, 'removeCachedData')
// .catch((err) => {
// // catch error if iframe hasn't loaded yet
// const msg = 'No handler found for post message:'
// if (err.message.startsWith(msg)) {
// return
// }
// console.error(err)
// })
// }
// }, [isCached])

/*
useEffect(() => {
if (
iframeRef?.current &&
Expand Down Expand Up @@ -167,30 +182,7 @@ const IframePlugin = ({
installationStatus,
isFirstOfType,
])

useEffect(() => {
if (iframeRef?.current) {
const listener = postRobot.on(
'installationStatus',
{
window: iframeRef.current.contentWindow,
},
(event) => {
if (isFirstOfType) {
dispatch(
acAddIframePluginStatus({
pluginType,
status: event.data.installationStatus,
})
)
}
}
)

return () => listener.cancel()
}
}, [pluginType, dispatch, visualization, iframePluginStatus, isFirstOfType])

*/
useEffect(() => {
setError(null)
}, [filterVersion, visualization.type])
Expand Down Expand Up @@ -237,16 +229,7 @@ const IframePlugin = ({
return (
<div className={classes.wrapper}>
{iframeSrc ? (
<iframe
ref={iframeRef}
src={iframeSrc}
// preserve dimensions if provided
style={{
width: style.width || '100%',
height: style.height || '100%',
border: 'none',
}}
></iframe>
<Plugin pluginSource={iframeSrc} {...pluginProps} />
) : null}
</div>
)
Expand Down

0 comments on commit 3091fdd

Please sign in to comment.