From 43ecad665e45bf13f822f9aa6d15cde9e563195b Mon Sep 17 00:00:00 2001
From: Joseph Izang <josephizang@gmail.com>
Date: Thu, 30 Dec 2021 02:30:40 +0100
Subject: [PATCH] badge handling correctly set to statusChanged

---
 .../vertical-icons-panel/src/lib/components/Debugger.tsx  | 1 +
 .../vertical-icons-panel/src/lib/components/Icon.tsx      | 8 +++++---
 .../src/lib/components/OtherIcons.tsx                     | 7 ++++---
 .../vertical-icons-panel/src/lib/components/Solidity.tsx  | 1 +
 .../src/lib/components/SolidityStaticAnalysis.tsx         | 1 +
 .../vertical-icons-panel/src/lib/components/Udapp.tsx     | 1 +
 .../src/lib/reducers/iconBadgeReducer.ts                  | 4 ++--
 7 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/libs/remix-ui/vertical-icons-panel/src/lib/components/Debugger.tsx b/libs/remix-ui/vertical-icons-panel/src/lib/components/Debugger.tsx
index d77286e213..e278a112cc 100644
--- a/libs/remix-ui/vertical-icons-panel/src/lib/components/Debugger.tsx
+++ b/libs/remix-ui/vertical-icons-panel/src/lib/components/Debugger.tsx
@@ -24,6 +24,7 @@ function Debugger ({ verticalIconsPlugin, itemContextAction, addActive, removeAc
 
   useEffect(() => {
     verticalIconsPlugin.on('debugger', 'statusChanged', (iconStatus: IconStatus) => {
+      iconStatus.pluginName = 'debugger'
       const action: IconBadgeReducerAction = { type: 'debugger', payload: { status: iconStatus, verticalIconPlugin: verticalIconsPlugin } }
       dispatchStatusUpdate(action)
     })
diff --git a/libs/remix-ui/vertical-icons-panel/src/lib/components/Icon.tsx b/libs/remix-ui/vertical-icons-panel/src/lib/components/Icon.tsx
index d0cd86b66c..26f3e6d254 100644
--- a/libs/remix-ui/vertical-icons-panel/src/lib/components/Icon.tsx
+++ b/libs/remix-ui/vertical-icons-panel/src/lib/components/Icon.tsx
@@ -20,6 +20,7 @@ export interface IconStatus {
     key: string
     title: string
     type: string
+    pluginName?: string
   }
 
 export interface BadgeStatus extends IconStatus {
@@ -111,9 +112,10 @@ function Icon ({
         ref={iconRef}
       >
         <img className="remixui_image" src={icon} alt={name} />
-        <Badge
-          badgeStatus={badgeStatus!}
-        />
+        { badgeStatus && badgeStatus.pluginName === name ? (
+          <Badge
+            badgeStatus={badgeStatus!}
+          />) : null }
       </div>
       {showContext ? (
         <VerticalIconsContextMenu
diff --git a/libs/remix-ui/vertical-icons-panel/src/lib/components/OtherIcons.tsx b/libs/remix-ui/vertical-icons-panel/src/lib/components/OtherIcons.tsx
index 941122e762..692304015d 100644
--- a/libs/remix-ui/vertical-icons-panel/src/lib/components/OtherIcons.tsx
+++ b/libs/remix-ui/vertical-icons-panel/src/lib/components/OtherIcons.tsx
@@ -23,7 +23,8 @@ const initialState = {
   text: '',
   key: '',
   title: '',
-  type: ''
+  type: '',
+  pluginName: ''
 }
 
 function OtherIcons ({ verticalIconsPlugin, itemContextAction, addActive, removeActive }: OtherIconsProps) {
@@ -33,12 +34,12 @@ function OtherIcons ({ verticalIconsPlugin, itemContextAction, addActive, remove
     Object.keys(verticalIconsPlugin.targetProfileForChange)
       .filter(customFilter)
       .forEach(p =>
-        verticalIconsPlugin.on(verticalIconsPlugin.targetProfileForChange[p].name, 'statusChanged', (evt: Event, iconStatus: IconStatus) => {
+        verticalIconsPlugin.on(verticalIconsPlugin.targetProfileForChange[p].name, 'statusChanged', (iconStatus: IconStatus) => {
+          iconStatus.pluginName = verticalIconsPlugin.targetProfileForChange[p].name
           const action: IconBadgeReducerAction = {
             type: verticalIconsPlugin.targetProfileForChange[p].name,
             payload: { status: iconStatus, verticalIconPlugin: verticalIconsPlugin }
           }
-          console.log('check the event payload', { evt })
           dispatchStatusUpdate(action)
         }))
   }, [verticalIconsPlugin.targetProfileForChange, Object.keys(verticalIconsPlugin.targetProfileForChange).length])
diff --git a/libs/remix-ui/vertical-icons-panel/src/lib/components/Solidity.tsx b/libs/remix-ui/vertical-icons-panel/src/lib/components/Solidity.tsx
index 28e8ab37be..1706687947 100644
--- a/libs/remix-ui/vertical-icons-panel/src/lib/components/Solidity.tsx
+++ b/libs/remix-ui/vertical-icons-panel/src/lib/components/Solidity.tsx
@@ -23,6 +23,7 @@ function Solidity ({ verticalIconsPlugin, itemContextAction, addActive, removeAc
 
   useEffect(() => {
     verticalIconsPlugin.on('solidity', 'statusChanged', (iconStatus: IconStatus) => {
+      iconStatus.pluginName = 'solidity'
       const action: IconBadgeReducerAction = { type: 'solidity', payload: { status: iconStatus, verticalIconPlugin: verticalIconsPlugin } }
       dispatchStatusUpdate(action)
     })
diff --git a/libs/remix-ui/vertical-icons-panel/src/lib/components/SolidityStaticAnalysis.tsx b/libs/remix-ui/vertical-icons-panel/src/lib/components/SolidityStaticAnalysis.tsx
index 1ad8517869..10f7f19424 100644
--- a/libs/remix-ui/vertical-icons-panel/src/lib/components/SolidityStaticAnalysis.tsx
+++ b/libs/remix-ui/vertical-icons-panel/src/lib/components/SolidityStaticAnalysis.tsx
@@ -23,6 +23,7 @@ function SolidityStaticAnalysis ({ verticalIconsPlugin, itemContextAction, addAc
   const [badgeStatus, dispatchStatusUpdate] = useReducer(iconBadgeReducer, initialState)
   useEffect(() => {
     verticalIconsPlugin.on('solidityStaticAnalysis', 'statusChanged', (iconStatus: IconStatus) => {
+      iconStatus.pluginName = 'solidityStaticAnalysis'
       const action: IconBadgeReducerAction = { type: 'solidityStaticAnalysis', payload: { status: iconStatus, verticalIconPlugin: verticalIconsPlugin } }
       dispatchStatusUpdate(action)
     })
diff --git a/libs/remix-ui/vertical-icons-panel/src/lib/components/Udapp.tsx b/libs/remix-ui/vertical-icons-panel/src/lib/components/Udapp.tsx
index 91f77bbb9c..3a1efeb5d4 100644
--- a/libs/remix-ui/vertical-icons-panel/src/lib/components/Udapp.tsx
+++ b/libs/remix-ui/vertical-icons-panel/src/lib/components/Udapp.tsx
@@ -23,6 +23,7 @@ function Udapp ({ verticalIconsPlugin, itemContextAction, addActive, removeActiv
 
   useEffect(() => {
     verticalIconsPlugin.on('udapp', 'statusChanged', (iconStatus: IconStatus) => {
+      iconStatus.pluginName = 'udapp'
       const action: IconBadgeReducerAction = { type: 'udapp', payload: { status: iconStatus, verticalIconPlugin: verticalIconsPlugin } }
       dispatchStatusUpdate(action)
     })
diff --git a/libs/remix-ui/vertical-icons-panel/src/lib/reducers/iconBadgeReducer.ts b/libs/remix-ui/vertical-icons-panel/src/lib/reducers/iconBadgeReducer.ts
index a5097e1553..ff20a3f63d 100644
--- a/libs/remix-ui/vertical-icons-panel/src/lib/reducers/iconBadgeReducer.ts
+++ b/libs/remix-ui/vertical-icons-panel/src/lib/reducers/iconBadgeReducer.ts
@@ -31,12 +31,12 @@ function setIconStatus (name: string, status: IconStatus) {
     thisType = 'danger' // to use with bootstrap
   } else thisType = helper.checkSpecialChars(status.type) ? '' : status.type!
   const title = helper.checkSpecialChars(status.title) ? '' : status.title
-  return { title, type: thisType, key, text }
+  const pluginName = status.pluginName
+  return { title, type: thisType, key, text, pluginName }
 }
 
 export function iconBadgeReducer (state: BadgeStatus, action: IconBadgeReducerAction) {
   const { status, ref, verticalIconPlugin } = action.payload
-  console.log('badge contains ', { status })
   if (Object.keys(verticalIconPlugin.targetProfileForChange).includes(action.type)) {
     const setStatus = setIconStatus(action.type, status)
     return setStatus