From be3100e63f4c306fa2432631e05e841434b9c5ff Mon Sep 17 00:00:00 2001
From: Sherfin Shamsudeen <sherfin@tooljet.io>
Date: Fri, 28 Jan 2022 20:23:28 +0530
Subject: [PATCH] [BugFix] Properly display and assign modal and tables on
 event manager (#1996)

---
 frontend/src/Editor/Inspector/EventManager.jsx |  6 +++---
 frontend/src/_helpers/appUtils.js              | 10 +++++-----
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/frontend/src/Editor/Inspector/EventManager.jsx b/frontend/src/Editor/Inspector/EventManager.jsx
index 9acf254b06..f81256e9fa 100644
--- a/frontend/src/Editor/Inspector/EventManager.jsx
+++ b/frontend/src/Editor/Inspector/EventManager.jsx
@@ -65,7 +65,7 @@ export const EventManager = ({
       if (components[key].component.component === componentType) {
         componentOptions.push({
           name: components[key].component.name,
-          value: { name: components[key].component.name, id: key },
+          value: key,
         });
       }
     });
@@ -207,7 +207,7 @@ export const EventManager = ({
                 <div className="col-9">
                   <SelectSearch
                     options={getComponentOptions('Modal')}
-                    value={event.model}
+                    value={event.modal?.id ?? event.modal}
                     search={true}
                     onChange={(value) => {
                       handlerChanged(index, 'modal', value);
@@ -225,7 +225,7 @@ export const EventManager = ({
                 <div className="col-9">
                   <SelectSearch
                     options={getComponentOptions('Modal')}
-                    value={event.model}
+                    value={event.modal?.id ?? event.modal}
                     search={true}
                     onChange={(value) => {
                       handlerChanged(index, 'modal', value);
diff --git a/frontend/src/_helpers/appUtils.js b/frontend/src/_helpers/appUtils.js
index a0ff4e0aae..2c9b5e173d 100644
--- a/frontend/src/_helpers/appUtils.js
+++ b/frontend/src/_helpers/appUtils.js
@@ -114,7 +114,7 @@ async function copyToClipboard(text) {
 }
 
 function showModal(_ref, modal, show) {
-  const modalId = modal.id;
+  const modalId = modal?.id ?? modal;
   if (_.isEmpty(modalId)) {
     console.log('No modal is associated with this event.');
     return Promise.resolve();
@@ -683,15 +683,15 @@ export function runQuery(_ref, queryId, queryName, confirmed = undefined, mode)
   });
 }
 
-function setTablePageIndex(_ref, table, index) {
-  if (_.isEmpty(table.id)) {
+function setTablePageIndex(_ref, tableId, index) {
+  if (_.isEmpty(tableId)) {
     console.log('No table is associated with this event.');
     return Promise.resolve();
   }
 
-  const tableMeta = _ref.state.currentState.components[table.name];
+  const table = Object.entries(_ref.state.currentState.components).filter((entry) => entry[1].id === tableId)[0][1];
   const newPageIndex = resolveReferences(index, _ref.state.currentState);
-  tableMeta.setPage(newPageIndex ?? 1);
+  table.setPage(newPageIndex ?? 1);
   return Promise.resolve();
 }