diff --git a/app/client/src/components/designSystems/appsmith/ReactTableComponent.tsx b/app/client/src/components/designSystems/appsmith/ReactTableComponent.tsx
index 49bc5a228b..dd3957d208 100644
--- a/app/client/src/components/designSystems/appsmith/ReactTableComponent.tsx
+++ b/app/client/src/components/designSystems/appsmith/ReactTableComponent.tsx
@@ -31,14 +31,14 @@ export interface ColumnMenuOptionProps {
   id?: string;
   category?: boolean;
   options?: ColumnMenuSubOptionProps[];
-  onClick?: (isSelected: boolean) => void;
+  onClick?: (columnIndex: number, isSelected: boolean) => void;
 }
 
 export interface ColumnMenuSubOptionProps {
   content: string;
   isSelected: boolean;
   closeOnClick: boolean;
-  onClick: () => void;
+  onClick: (columnIndex: number) => void;
 }
 
 interface ReactTableComponentProps {
@@ -293,10 +293,6 @@ export class ReactTableComponent extends React.Component<
     return reorderedColumns;
   };
 
-  showMenu = (columnIndex: number) => {
-    this.setState({ columnIndex: columnIndex, action: "" });
-  };
-
   getColumnMenu = () => {
     const { columnIndex } = this.state;
     let columnType = "";
@@ -327,14 +323,18 @@ export class ReactTableComponent extends React.Component<
       updateColumnType: this.updateColumnType,
       handleUpdateCurrencySymbol: this.handleUpdateCurrencySymbol,
       handleDateFormatUpdate: this.handleDateFormatUpdate,
-      updateAction: (action: string) => this.setState({ action: action }),
+      updateAction: (columnIndex: number, action: string) =>
+        this.setState({ action: action }),
     });
     return columnMenuOptions;
   };
 
-  hideColumn = (isColumnHidden: boolean) => {
+  showMenu = (columnIndex: number) => {
+    this.setState({ columnIndex: columnIndex, action: "" });
+  };
+
+  hideColumn = (columnIndex: number, isColumnHidden: boolean) => {
     const columns = this.getTableColumns();
-    const columnIndex = this.state.columnIndex;
     const column = columns[columnIndex];
     let hiddenColumns = this.props.hiddenColumns || [];
     if (!isColumnHidden) {
@@ -353,9 +353,8 @@ export class ReactTableComponent extends React.Component<
     this.setState({ columnIndex: -1 });
   };
 
-  updateColumnType = (columnType: string) => {
+  updateColumnType = (columnIndex: number, columnType: string) => {
     const columns = this.getTableColumns();
-    const columnIndex = this.state.columnIndex;
     const column = columns[columnIndex];
     const columnTypeMap = this.props.columnTypeMap || {};
     columnTypeMap[column.accessor] = {
@@ -370,15 +369,14 @@ export class ReactTableComponent extends React.Component<
     this.setState({ columnName: event.target.value });
   };
 
-  onKeyPress = (key: string) => {
+  onKeyPress = (columnIndex: number, key: string) => {
     if (key === "Enter") {
-      this.handleColumnNameUpdate();
+      this.handleColumnNameUpdate(columnIndex);
     }
   };
 
-  handleColumnNameUpdate = () => {
+  handleColumnNameUpdate = (columnIndex: number) => {
     const columns = this.getTableColumns();
-    const columnIndex = this.state.columnIndex;
     const columnName = this.state.columnName;
     const column = columns[columnIndex];
     const columnNameMap = this.props.columnNameMap || {};
@@ -391,9 +389,11 @@ export class ReactTableComponent extends React.Component<
     });
   };
 
-  handleUpdateCurrencySymbol = (currencySymbol: string) => {
+  handleUpdateCurrencySymbol = (
+    columnIndex: number,
+    currencySymbol: string,
+  ) => {
     const columns = this.getTableColumns();
-    const columnIndex = this.state.columnIndex;
     const column = columns[columnIndex];
     const columnTypeMap = this.props.columnTypeMap || {};
     columnTypeMap[column.accessor] = {
@@ -407,9 +407,8 @@ export class ReactTableComponent extends React.Component<
     });
   };
 
-  handleDateFormatUpdate = (dateFormat: string) => {
+  handleDateFormatUpdate = (columnIndex: number, dateFormat: string) => {
     const columns = this.getTableColumns();
-    const columnIndex = this.state.columnIndex;
     const column = columns[columnIndex];
     const columnTypeMap = this.props.columnTypeMap || {};
     columnTypeMap[column.accessor] = {
diff --git a/app/client/src/components/designSystems/appsmith/Table.tsx b/app/client/src/components/designSystems/appsmith/Table.tsx
index e7dcd6825c..5807f46169 100644
--- a/app/client/src/components/designSystems/appsmith/Table.tsx
+++ b/app/client/src/components/designSystems/appsmith/Table.tsx
@@ -32,7 +32,7 @@ interface TableProps {
   columnIndex: number;
   columnAction: string;
   onColumnNameChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
-  handleColumnNameUpdate: () => void;
+  handleColumnNameUpdate: (columnIndex: number) => void;
   handleResizeColumn: Function;
   selectTableRow: (
     row: { original: object; index: number },
@@ -42,7 +42,7 @@ interface TableProps {
   updatePageNo: Function;
   nextPageClick: () => void;
   prevPageClick: () => void;
-  onKeyPress: (key: string) => void;
+  onKeyPress: (columnIndex: number, key: string) => void;
   serverSidePaginationEnabled: boolean;
   selectedRowIndex: number;
   disableDrag: () => void;
@@ -127,7 +127,9 @@ export const Table = (props: TableProps) => {
                           <InputGroup
                             placeholder="Enter Column Name"
                             onChange={props.onColumnNameChange}
-                            onKeyPress={event => props.onKeyPress(event.key)}
+                            onKeyPress={event =>
+                              props.onKeyPress(columnIndex, event.key)
+                            }
                             type="text"
                             defaultValue={
                               props.columnNameMap &&
@@ -136,7 +138,9 @@ export const Table = (props: TableProps) => {
                                 : column.id
                             }
                             className="input-group"
-                            onBlur={() => props.handleColumnNameUpdate()}
+                            onBlur={() =>
+                              props.handleColumnNameUpdate(columnIndex)
+                            }
                           />
                         )}
                       {(props.columnIndex !== columnIndex ||
diff --git a/app/client/src/components/designSystems/appsmith/TableColumnMenu.tsx b/app/client/src/components/designSystems/appsmith/TableColumnMenu.tsx
index 08a469d561..bcea38872c 100644
--- a/app/client/src/components/designSystems/appsmith/TableColumnMenu.tsx
+++ b/app/client/src/components/designSystems/appsmith/TableColumnMenu.tsx
@@ -46,7 +46,7 @@ export const TableColumnMenuPopup = (props: TableColumnMenuPopup) => {
               key={index}
               onClick={() => {
                 if (option.onClick) {
-                  option.onClick(!!option.isSelected);
+                  option.onClick(props.columnIndex, !!option.isSelected);
                 }
               }}
               className={
@@ -74,7 +74,7 @@ export const TableColumnMenuPopup = (props: TableColumnMenuPopup) => {
                       (item: ColumnMenuSubOptionProps, itemIndex: number) => (
                         <OptionWrapper
                           key={itemIndex}
-                          onClick={item.onClick}
+                          onClick={() => item.onClick(props.columnIndex)}
                           className={
                             item.closeOnClick ? Classes.POPOVER_DISMISS : ""
                           }
diff --git a/app/client/src/components/designSystems/appsmith/TableUtilities.tsx b/app/client/src/components/designSystems/appsmith/TableUtilities.tsx
index 4adcd20eb2..78aa9d8cf5 100644
--- a/app/client/src/components/designSystems/appsmith/TableUtilities.tsx
+++ b/app/client/src/components/designSystems/appsmith/TableUtilities.tsx
@@ -15,11 +15,14 @@ interface MenuOptionProps {
   isColumnHidden: boolean;
   columnType: string;
   format?: string;
-  hideColumn: (isColumnHidden: boolean) => void;
-  updateAction: (action: string) => void;
-  updateColumnType: (columnType: string) => void;
-  handleUpdateCurrencySymbol: (currencySymbol: string) => void;
-  handleDateFormatUpdate: (dateFormat: string) => void;
+  hideColumn: (columnIndex: number, isColumnHidden: boolean) => void;
+  updateAction: (columnIndex: number, action: string) => void;
+  updateColumnType: (columnIndex: number, columnType: string) => void;
+  handleUpdateCurrencySymbol: (
+    columnIndex: number,
+    currencySymbol: string,
+  ) => void;
+  handleDateFormatUpdate: (columnIndex: number, dateFormat: string) => void;
 }
 
 export const getMenuOptions = (props: MenuOptionProps) => {
@@ -28,16 +31,16 @@ export const getMenuOptions = (props: MenuOptionProps) => {
       content: "Rename a Column",
       closeOnClick: true,
       id: "rename_column",
-      onClick: () => {
-        props.updateAction("rename_column");
+      onClick: (columnIndex: number) => {
+        props.updateAction(columnIndex, "rename_column");
       },
     },
     {
       content: props.isColumnHidden ? "Show Column" : "Hide Column",
       closeOnClick: true,
       id: "hide_column",
-      onClick: () => {
-        props.hideColumn(props.isColumnHidden);
+      onClick: (columnIndex: number) => {
+        props.hideColumn(columnIndex, props.isColumnHidden);
       },
     },
   ];
@@ -64,11 +67,11 @@ export const getMenuOptions = (props: MenuOptionProps) => {
       ),
       closeOnClick: true,
       isSelected: props.columnType === "image",
-      onClick: (isSelected: boolean) => {
+      onClick: (columnIndex: number, isSelected: boolean) => {
         if (isSelected) {
-          props.updateColumnType("");
+          props.updateColumnType(columnIndex, "");
         } else {
-          props.updateColumnType("image");
+          props.updateColumnType(columnIndex, "image");
         }
       },
     },
@@ -85,11 +88,11 @@ export const getMenuOptions = (props: MenuOptionProps) => {
       ),
       isSelected: props.columnType === "video",
       closeOnClick: true,
-      onClick: (isSelected: boolean) => {
+      onClick: (columnIndex: number, isSelected: boolean) => {
         if (isSelected) {
-          props.updateColumnType("");
+          props.updateColumnType(columnIndex, "");
         } else {
-          props.updateColumnType("video");
+          props.updateColumnType(columnIndex, "video");
         }
       },
     },
@@ -106,11 +109,11 @@ export const getMenuOptions = (props: MenuOptionProps) => {
       ),
       closeOnClick: true,
       isSelected: props.columnType === "text",
-      onClick: (isSelected: boolean) => {
+      onClick: (columnIndex: number, isSelected: boolean) => {
         if (isSelected) {
-          props.updateColumnType("");
+          props.updateColumnType(columnIndex, "");
         } else {
-          props.updateColumnType("text");
+          props.updateColumnType(columnIndex, "text");
         }
       },
     },
@@ -138,56 +141,56 @@ export const getMenuOptions = (props: MenuOptionProps) => {
           content: "USD - $",
           isSelected: props.format === "$",
           closeOnClick: true,
-          onClick: () => {
-            props.handleUpdateCurrencySymbol("$");
+          onClick: (columnIndex: number) => {
+            props.handleUpdateCurrencySymbol(columnIndex, "$");
           },
         },
         {
           content: "INR - ₹",
           isSelected: props.format === "₹",
           closeOnClick: true,
-          onClick: () => {
-            props.handleUpdateCurrencySymbol("₹");
+          onClick: (columnIndex: number) => {
+            props.handleUpdateCurrencySymbol(columnIndex, "₹");
           },
         },
         {
           content: "GBP - £",
           isSelected: props.format === "£",
           closeOnClick: true,
-          onClick: () => {
-            props.handleUpdateCurrencySymbol("£");
+          onClick: (columnIndex: number) => {
+            props.handleUpdateCurrencySymbol(columnIndex, "£");
           },
         },
         {
           content: "AUD - A$",
           isSelected: props.format === "A$",
           closeOnClick: true,
-          onClick: () => {
-            props.handleUpdateCurrencySymbol("A$");
+          onClick: (columnIndex: number) => {
+            props.handleUpdateCurrencySymbol(columnIndex, "A$");
           },
         },
         {
           content: "EUR - €",
           isSelected: props.format === "€",
           closeOnClick: true,
-          onClick: () => {
-            props.handleUpdateCurrencySymbol("€");
+          onClick: (columnIndex: number) => {
+            props.handleUpdateCurrencySymbol(columnIndex, "€");
           },
         },
         {
           content: "SGD - S$",
           isSelected: props.format === "S$",
           closeOnClick: true,
-          onClick: () => {
-            props.handleUpdateCurrencySymbol("S$");
+          onClick: (columnIndex: number) => {
+            props.handleUpdateCurrencySymbol(columnIndex, "S$");
           },
         },
         {
           content: "CAD - C$",
           isSelected: props.format === "C$",
           closeOnClick: true,
-          onClick: () => {
-            props.handleUpdateCurrencySymbol("C$");
+          onClick: (columnIndex: number) => {
+            props.handleUpdateCurrencySymbol(columnIndex, "C$");
           },
         },
       ],
@@ -216,32 +219,32 @@ export const getMenuOptions = (props: MenuOptionProps) => {
           content: "MM-DD-YY",
           isSelected: props.format === "MM-DD-YY",
           closeOnClick: true,
-          onClick: () => {
-            props.handleDateFormatUpdate("MM-DD-YY");
+          onClick: (columnIndex: number) => {
+            props.handleDateFormatUpdate(columnIndex, "MM-DD-YY");
           },
         },
         {
           content: "DD-MM-YY",
           isSelected: props.format === "DD-MM-YY",
           closeOnClick: true,
-          onClick: () => {
-            props.handleDateFormatUpdate("DD-MM-YY");
+          onClick: (columnIndex: number) => {
+            props.handleDateFormatUpdate(columnIndex, "DD-MM-YY");
           },
         },
         {
           content: "DD/MM/YY",
           isSelected: props.format === "DD/MM/YY",
           closeOnClick: true,
-          onClick: () => {
-            props.handleDateFormatUpdate("DD/MM/YY");
+          onClick: (columnIndex: number) => {
+            props.handleDateFormatUpdate(columnIndex, "DD/MM/YY");
           },
         },
         {
           content: "MM/DD/YY",
           isSelected: props.format === "MM/DD/YY",
           closeOnClick: true,
-          onClick: () => {
-            props.handleDateFormatUpdate("MM/DD/YY");
+          onClick: (columnIndex: number) => {
+            props.handleDateFormatUpdate(columnIndex, "MM/DD/YY");
           },
         },
       ],
@@ -259,11 +262,11 @@ export const getMenuOptions = (props: MenuOptionProps) => {
       ),
       closeOnClick: true,
       isSelected: props.columnType === "time",
-      onClick: (isSelected: boolean) => {
+      onClick: (columnIndex: number, isSelected: boolean) => {
         if (isSelected) {
-          props.updateColumnType("");
+          props.updateColumnType(columnIndex, "");
         } else {
-          props.updateColumnType("time");
+          props.updateColumnType(columnIndex, "time");
         }
       },
     },