From b1a3a0a4aeadc234aa181a9af2f176d0ca8d505c Mon Sep 17 00:00:00 2001
From: Thomas Zemp <tom@dhis2.org>
Date: Fri, 23 Jun 2023 16:59:09 +0200
Subject: [PATCH 1/4] fix: check memomized props for postMessage communication
 [LIBS-514]

---
 services/plugin/src/Plugin.tsx | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/services/plugin/src/Plugin.tsx b/services/plugin/src/Plugin.tsx
index 17c77e2d..04934965 100644
--- a/services/plugin/src/Plugin.tsx
+++ b/services/plugin/src/Plugin.tsx
@@ -1,7 +1,7 @@
 import { AlertsManagerContext } from '@dhis2/app-service-alerts'
 import { useDataQuery } from '@dhis2/app-service-data'
 import postRobot from 'post-robot'
-import React, { useContext, useEffect, useRef, useState } from 'react'
+import React, { useContext, useEffect, useMemo, useRef, useState } from 'react'
 import PluginError from './PluginError'
 
 const appsInfoQuery = {
@@ -52,6 +52,13 @@ export const Plugin = ({
 
     const [inErrorState, setInErrorState] = useState<boolean>(false)
 
+    // since we do not know what props are passed, the dependency array has to be keys of whatever is standard prop
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    const memoizedPropsToPass = useMemo(
+        () => propsToPass,
+        [...Object.keys(propsToPass)]
+    )
+
     useEffect(() => {
         setCommunicationReceived(false)
     }, [pluginEntryPoint])
@@ -66,7 +73,7 @@ export const Plugin = ({
 
         if (iframeRef?.current) {
             const iframeProps = {
-                ...propsToPass,
+                ...memoizedPropsToPass,
                 alertsAdd,
                 setInErrorState,
                 setCommunicationReceived,
@@ -106,7 +113,7 @@ export const Plugin = ({
         }
         // prevCommunicationReceived update should not retrigger this hook
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [propsToPass, communicationReceived, inErrorState, alertsAdd])
+    }, [memoizedPropsToPass, communicationReceived, inErrorState, alertsAdd])
 
     if (data && !pluginEntryPoint) {
         return (

From 48912d76630d5490b983e5e730a7d82d06762148 Mon Sep 17 00:00:00 2001
From: Thomas Zemp <tom@dhis2.org>
Date: Fri, 23 Jun 2023 17:13:22 +0200
Subject: [PATCH 2/4] fix: move eslint disable line

---
 services/plugin/src/Plugin.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/services/plugin/src/Plugin.tsx b/services/plugin/src/Plugin.tsx
index 04934965..53cc25fd 100644
--- a/services/plugin/src/Plugin.tsx
+++ b/services/plugin/src/Plugin.tsx
@@ -53,9 +53,9 @@ export const Plugin = ({
     const [inErrorState, setInErrorState] = useState<boolean>(false)
 
     // since we do not know what props are passed, the dependency array has to be keys of whatever is standard prop
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     const memoizedPropsToPass = useMemo(
         () => propsToPass,
+        // eslint-disable-next-line react-hooks/exhaustive-deps
         [...Object.keys(propsToPass)]
     )
 

From 03ce64fb65af73190ec920d8d720250ec2ba3715 Mon Sep 17 00:00:00 2001
From: Thomas Zemp <tom@dhis2.org>
Date: Tue, 12 Sep 2023 13:14:53 +0200
Subject: [PATCH 3/4] fix: dependency array

---
 services/plugin/src/Plugin.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/services/plugin/src/Plugin.tsx b/services/plugin/src/Plugin.tsx
index 53cc25fd..03e04e29 100644
--- a/services/plugin/src/Plugin.tsx
+++ b/services/plugin/src/Plugin.tsx
@@ -56,7 +56,11 @@ export const Plugin = ({
     const memoizedPropsToPass = useMemo(
         () => propsToPass,
         // eslint-disable-next-line react-hooks/exhaustive-deps
-        [...Object.keys(propsToPass)]
+        [
+            ...Object.keys(propsToPass)
+                .sort()
+                .map((k) => propsToPass[k]),
+        ]
     )
 
     useEffect(() => {

From 9c17206a6942776f4c90c662153677ae9c00c350 Mon Sep 17 00:00:00 2001
From: Thomas Zemp <tom@dhis2.org>
Date: Thu, 28 Sep 2023 10:14:20 +0200
Subject: [PATCH 4/4] fix: type error

---
 services/plugin/src/Plugin.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/services/plugin/src/Plugin.tsx b/services/plugin/src/Plugin.tsx
index 03e04e29..3b65c85e 100644
--- a/services/plugin/src/Plugin.tsx
+++ b/services/plugin/src/Plugin.tsx
@@ -55,12 +55,13 @@ export const Plugin = ({
     // since we do not know what props are passed, the dependency array has to be keys of whatever is standard prop
     const memoizedPropsToPass = useMemo(
         () => propsToPass,
-        // eslint-disable-next-line react-hooks/exhaustive-deps
+        /* eslint-disable react-hooks/exhaustive-deps */
         [
             ...Object.keys(propsToPass)
                 .sort()
-                .map((k) => propsToPass[k]),
+                .map((k) => (propsToPass as any)[k]),
         ]
+        /* eslint-enable react-hooks/exhaustive-deps */
     )
 
     useEffect(() => {