From ec9cab81531780375f9fd76297694d34a2fd6c94 Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Fri, 6 Dec 2024 16:12:13 +0200
Subject: [PATCH 01/16] fix: Update AgGrid

---
 plugins/community-plugin-aggrid/src/AgGrid.js | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/plugins/community-plugin-aggrid/src/AgGrid.js b/plugins/community-plugin-aggrid/src/AgGrid.js
index 42bc621..ef54306 100644
--- a/plugins/community-plugin-aggrid/src/AgGrid.js
+++ b/plugins/community-plugin-aggrid/src/AgGrid.js
@@ -35,6 +35,15 @@ const AgGrid = ({ properties, methods, loading, events }) => {
 
   const memoDefaultColDef = useMemo(() => defaultColDef);
 
+  const getRowId = useCallback(
+    (params) =>
+      params.data[properties.rowId] ??
+      params.data.id ??
+      params.data._id ??
+      JSON.stringify(params.data),
+    []
+  );
+
   const onRowClick = useCallback((event) => {
     if (events.onRowClick) {
       methods.triggerEvent({
@@ -92,7 +101,7 @@ const AgGrid = ({ properties, methods, loading, events }) => {
         name: 'onFilterChanged',
         event: {
           rows: event.api.rowModel.rowsToDisplay.map((row) => row.data),
-          filter: this.gridApi.getFilterModel(),
+          filter: gridRef.current.api.getFilterModel(),
         },
       });
     }
@@ -111,7 +120,6 @@ const AgGrid = ({ properties, methods, loading, events }) => {
   }, []);
 
   useEffect(() => {
-    methods.registerMethod('exportDataAsCsv', (args) => gridRef.current.api.exportDataAsCsv(args));
     methods.registerMethod('exportDataAsCsv', (args) => gridRef.current.api.exportDataAsCsv(args));
     methods.registerMethod('sizeColumnsToFit', () => gridRef.current.api.sizeColumnsToFit());
     methods.registerMethod('setFilterModel', (model) => gridRef.current.api.setFilterModel(model));
@@ -159,6 +167,7 @@ const AgGrid = ({ properties, methods, loading, events }) => {
       modules={[ClientSideRowModelModule, CsvExportModule]}
       columnDefs={processColDefs(columnDefs, methods)}
       ref={gridRef}
+      getRowId={getRowId}
     />
   );
 };

From 52f730328dd14d9a836b8f483ea1e0932906139e Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Fri, 6 Dec 2024 17:02:49 +0200
Subject: [PATCH 02/16] wip: Render ag grid react buttons.

---
 .../src/processColDefs.js                     |  3 ++
 .../src/renderButtons.js                      | 45 +++++++++++++++++++
 2 files changed, 48 insertions(+)
 create mode 100644 plugins/community-plugin-aggrid/src/renderButtons.js

diff --git a/plugins/community-plugin-aggrid/src/processColDefs.js b/plugins/community-plugin-aggrid/src/processColDefs.js
index 5a36ac5..ca7c32d 100644
--- a/plugins/community-plugin-aggrid/src/processColDefs.js
+++ b/plugins/community-plugin-aggrid/src/processColDefs.js
@@ -16,6 +16,7 @@
 
 import { renderHtml } from '@lowdefy/block-utils';
 import { type } from '@lowdefy/helpers';
+import renderButtons from './renderButtons.js';
 
 function recProcessColDefs(columnDefs, methods) {
   return columnDefs.map((col) => {
@@ -30,6 +31,8 @@ function recProcessColDefs(columnDefs, methods) {
           methods,
         });
       };
+    } else if (type.isArray(col.blocks)) {
+      return renderButtons({ buttons: col.buttons });
     }
     return {
       ...col,
diff --git a/plugins/community-plugin-aggrid/src/renderButtons.js b/plugins/community-plugin-aggrid/src/renderButtons.js
new file mode 100644
index 0000000..917c634
--- /dev/null
+++ b/plugins/community-plugin-aggrid/src/renderButtons.js
@@ -0,0 +1,45 @@
+/*
+  Copyright 2021 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/
+
+import React, { useCallback } from 'react';
+
+import Button from '@lowdefy/blocks-antd/blocks/Button/Button.js';
+
+function renderButtons({ buttons, methods }) {
+  // TODO: Register button events
+  // buttons.array.forEach((button) => {
+  //   methods.registerEvent({
+  //     name: `${button.event}`
+  //   });
+  // });
+  return (
+    <div>
+      {buttons.map((button) => {
+        <Button
+          blockId={`${button.blockId}_button`}
+          // components={{ Icon, Link }}
+          events={button.events}
+          properties={button.properties}
+          methods={button.methods}
+          onClick={() => {}}
+          rename={button.rename}
+        />;
+      })}
+    </div>
+  );
+}
+
+export default renderButtons;

From 3dac810397611c83077991f10520f41ac4b46044 Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Thu, 12 Dec 2024 15:45:28 +0200
Subject: [PATCH 03/16] feat: Implemented ag grid buttons.

$5h
---
 plugins/community-plugin-aggrid/package.json  |  1 +
 plugins/community-plugin-aggrid/src/AgGrid.js |  4 +-
 .../src/processColDefs.js                     | 25 +++++--
 .../src/renderBlocks.js                       | 65 +++++++++++++++++++
 .../src/renderButtons.js                      | 45 -------------
 5 files changed, 87 insertions(+), 53 deletions(-)
 create mode 100644 plugins/community-plugin-aggrid/src/renderBlocks.js
 delete mode 100644 plugins/community-plugin-aggrid/src/renderButtons.js

diff --git a/plugins/community-plugin-aggrid/package.json b/plugins/community-plugin-aggrid/package.json
index 805bbf9..24d7c7b 100644
--- a/plugins/community-plugin-aggrid/package.json
+++ b/plugins/community-plugin-aggrid/package.json
@@ -53,6 +53,7 @@
     "@ag-grid-community/react": "30.2.0",
     "@ag-grid-community/styles": "30.2.0",
     "@lowdefy/block-utils": "4.0.0-rc.11",
+    "@lowdefy/blocks-antd": "4.0.0-rc.11",
     "@lowdefy/helpers": "4.0.0-rc.11",
     "react": "18.2.0",
     "react-dom": "18.2.0"
diff --git a/plugins/community-plugin-aggrid/src/AgGrid.js b/plugins/community-plugin-aggrid/src/AgGrid.js
index ef54306..6f91282 100644
--- a/plugins/community-plugin-aggrid/src/AgGrid.js
+++ b/plugins/community-plugin-aggrid/src/AgGrid.js
@@ -21,7 +21,7 @@ import { CsvExportModule } from '@ag-grid-community/csv-export';
 
 import processColDefs from './processColDefs.js';
 
-const AgGrid = ({ properties, methods, loading, events }) => {
+const AgGrid = ({ components, events, loading, methods, properties }) => {
   const {
     quickFilterValue,
     columnDefs,
@@ -165,7 +165,7 @@ const AgGrid = ({ properties, methods, loading, events }) => {
       onRowClicked={onRowClick}
       onCellClicked={onCellClicked}
       modules={[ClientSideRowModelModule, CsvExportModule]}
-      columnDefs={processColDefs(columnDefs, methods)}
+      columnDefs={processColDefs(columnDefs, methods, components, events)}
       ref={gridRef}
       getRowId={getRowId}
     />
diff --git a/plugins/community-plugin-aggrid/src/processColDefs.js b/plugins/community-plugin-aggrid/src/processColDefs.js
index ca7c32d..6b7011b 100644
--- a/plugins/community-plugin-aggrid/src/processColDefs.js
+++ b/plugins/community-plugin-aggrid/src/processColDefs.js
@@ -16,13 +16,13 @@
 
 import { renderHtml } from '@lowdefy/block-utils';
 import { type } from '@lowdefy/helpers';
-import renderButtons from './renderButtons.js';
+import renderBlocks from './renderBlocks.js';
 
-function recProcessColDefs(columnDefs, methods) {
+function recProcessColDefs(columnDefs, methods, components, events) {
   return columnDefs.map((col) => {
     const newColDef = {};
     if (type.isArray(col.children)) {
-      newColDef.children = recProcessColDefs(col.children, methods);
+      newColDef.children = recProcessColDefs(col.children, methods, components);
     }
     if (type.isFunction(col.cellRenderer)) {
       newColDef.cellRenderer = (params) => {
@@ -32,7 +32,20 @@ function recProcessColDefs(columnDefs, methods) {
         });
       };
     } else if (type.isArray(col.blocks)) {
-      return renderButtons({ buttons: col.buttons });
+      //TODO: delete col.blocks
+      newColDef.cellRenderer = (params) => {
+        return renderBlocks({
+          blocks: col.blocks,
+          methods,
+          components,
+          rowEvent: {
+            row: params.data,
+            rowIndex: params.rowIndex,
+            index: parseInt(params.node.id),
+          },
+          events,
+        });
+      };
     }
     return {
       ...col,
@@ -41,8 +54,8 @@ function recProcessColDefs(columnDefs, methods) {
   });
 }
 
-function processColDefs(columnDefs = [], methods) {
-  return recProcessColDefs(columnDefs, methods);
+function processColDefs(columnDefs = [], methods, components, events) {
+  return recProcessColDefs(columnDefs, methods, components, events);
 }
 
 export default processColDefs;
diff --git a/plugins/community-plugin-aggrid/src/renderBlocks.js b/plugins/community-plugin-aggrid/src/renderBlocks.js
new file mode 100644
index 0000000..425f3e0
--- /dev/null
+++ b/plugins/community-plugin-aggrid/src/renderBlocks.js
@@ -0,0 +1,65 @@
+/*
+  Copyright 2021 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/
+
+import React from 'react';
+
+import Tag from '@lowdefy/blocks-antd/blocks/Tag/Tag.js';
+import Button from '@lowdefy/blocks-antd/blocks/Button/Button.js';
+
+const typeMap = {
+  Button: ({ block, methods, components, rowEvent, events, eventId }) => {
+    return (
+      <Button
+        blockId={eventId}
+        components={components}
+        methods={methods}
+        events={events}
+        properties={block.properties}
+        rename={{
+          events: {
+            onClick: eventId,
+          },
+        }}
+        onClick={() => methods.triggerEvent({ name: eventId, event: rowEvent })}
+      />
+    );
+  },
+  Tag: ({ props }) => {
+    return <Tag {...props} />;
+  },
+};
+
+function registerEvent({ methods, eventId, actions, events }) {
+  if (events[eventId] || !actions) return;
+  methods.registerEvent({
+    name: eventId,
+    actions,
+  });
+}
+
+function renderBlocks({ blocks, methods, components, rowEvent, events }) {
+  return (
+    <div>
+      {blocks.map((block) => {
+        const eventId = `${block.id}_${rowEvent.rowIndex}_actions`;
+        registerEvent({ methods, eventId, actions: block.events?.onClick, events });
+        return typeMap[block.type]({ block, methods, components, rowEvent, events, eventId });
+      })}
+    </div>
+  );
+}
+
+export default renderBlocks;
diff --git a/plugins/community-plugin-aggrid/src/renderButtons.js b/plugins/community-plugin-aggrid/src/renderButtons.js
deleted file mode 100644
index 917c634..0000000
--- a/plugins/community-plugin-aggrid/src/renderButtons.js
+++ /dev/null
@@ -1,45 +0,0 @@
-/*
-  Copyright 2021 Lowdefy, Inc
-
-  Licensed under the Apache License, Version 2.0 (the "License");
-  you may not use this file except in compliance with the License.
-  You may obtain a copy of the License at
-
-      http://www.apache.org/licenses/LICENSE-2.0
-
-  Unless required by applicable law or agreed to in writing, software
-  distributed under the License is distributed on an "AS IS" BASIS,
-  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  See the License for the specific language governing permissions and
-  limitations under the License.
-*/
-
-import React, { useCallback } from 'react';
-
-import Button from '@lowdefy/blocks-antd/blocks/Button/Button.js';
-
-function renderButtons({ buttons, methods }) {
-  // TODO: Register button events
-  // buttons.array.forEach((button) => {
-  //   methods.registerEvent({
-  //     name: `${button.event}`
-  //   });
-  // });
-  return (
-    <div>
-      {buttons.map((button) => {
-        <Button
-          blockId={`${button.blockId}_button`}
-          // components={{ Icon, Link }}
-          events={button.events}
-          properties={button.properties}
-          methods={button.methods}
-          onClick={() => {}}
-          rename={button.rename}
-        />;
-      })}
-    </div>
-  );
-}
-
-export default renderButtons;

From 097de0f317516789100a3bf2fe9c3740970d33fa Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Thu, 12 Dec 2024 17:16:18 +0200
Subject: [PATCH 04/16] feat: Added Tag.

---
 .../community-plugin-aggrid/src/renderBlocks.js    | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/plugins/community-plugin-aggrid/src/renderBlocks.js b/plugins/community-plugin-aggrid/src/renderBlocks.js
index 425f3e0..832bed7 100644
--- a/plugins/community-plugin-aggrid/src/renderBlocks.js
+++ b/plugins/community-plugin-aggrid/src/renderBlocks.js
@@ -37,8 +37,16 @@ const typeMap = {
       />
     );
   },
-  Tag: ({ props }) => {
-    return <Tag {...props} />;
+  Tag: ({ block, methods, components, rowEvent, events, eventId }) => {
+    return (
+      <Tag
+        blockId={eventId}
+        components={components}
+        methods={methods}
+        properties={block.properties}
+        onClick={() => methods.triggerEvent({ name: eventId, event: rowEvent })}
+      />
+    );
   },
 };
 
@@ -52,7 +60,7 @@ function registerEvent({ methods, eventId, actions, events }) {
 
 function renderBlocks({ blocks, methods, components, rowEvent, events }) {
   return (
-    <div>
+    <div style={{ display: 'flex', gap: '4px' }}>
       {blocks.map((block) => {
         const eventId = `${block.id}_${rowEvent.rowIndex}_actions`;
         registerEvent({ methods, eventId, actions: block.events?.onClick, events });

From 314cb3b63806c206d8ae40d0385290df20584d32 Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Fri, 13 Dec 2024 12:31:49 +0200
Subject: [PATCH 05/16] fix: Actions fix for dynamic buttons.

$1h
---
 plugins/community-plugin-aggrid/src/AgGrid.js       | 9 +++++++++
 plugins/community-plugin-aggrid/src/renderBlocks.js | 4 ++--
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/plugins/community-plugin-aggrid/src/AgGrid.js b/plugins/community-plugin-aggrid/src/AgGrid.js
index 6f91282..7490f11 100644
--- a/plugins/community-plugin-aggrid/src/AgGrid.js
+++ b/plugins/community-plugin-aggrid/src/AgGrid.js
@@ -144,8 +144,17 @@ const AgGrid = ({ components, events, loading, methods, properties }) => {
     }
   }, []);
 
+  const clearBlockActions = useCallback(() => {
+    Object.keys(events).forEach((key) => {
+      if (key.endsWith('_actions')) {
+        delete events[key];
+      }
+    });
+  }, []);
+
   useEffect(() => {
     if (JSON.stringify(rowData) !== JSON.stringify(newRowData)) {
+      clearBlockActions();
       setRowData(newRowData);
     }
   }, [newRowData]);
diff --git a/plugins/community-plugin-aggrid/src/renderBlocks.js b/plugins/community-plugin-aggrid/src/renderBlocks.js
index 832bed7..9515f6d 100644
--- a/plugins/community-plugin-aggrid/src/renderBlocks.js
+++ b/plugins/community-plugin-aggrid/src/renderBlocks.js
@@ -61,8 +61,8 @@ function registerEvent({ methods, eventId, actions, events }) {
 function renderBlocks({ blocks, methods, components, rowEvent, events }) {
   return (
     <div style={{ display: 'flex', gap: '4px' }}>
-      {blocks.map((block) => {
-        const eventId = `${block.id}_${rowEvent.rowIndex}_actions`;
+      {blocks.map((block, index) => {
+        const eventId = `${block.id}_${rowEvent.rowIndex}_${index}_actions`;
         registerEvent({ methods, eventId, actions: block.events?.onClick, events });
         return typeMap[block.type]({ block, methods, components, rowEvent, events, eventId });
       })}

From fefc5a23ee5e7d4365f3b8bd3db45e21820546b4 Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Tue, 17 Dec 2024 15:53:53 +0200
Subject: [PATCH 06/16] feat: Override cellClick event.

---
 plugins/community-plugin-aggrid/src/AgGrid.js |  5 ++--
 .../src/processColDefs.js                     | 16 +++++++++----
 .../src/renderBlocks.js                       | 24 +++++++++++++++----
 3 files changed, 33 insertions(+), 12 deletions(-)

diff --git a/plugins/community-plugin-aggrid/src/AgGrid.js b/plugins/community-plugin-aggrid/src/AgGrid.js
index 7490f11..99a0285 100644
--- a/plugins/community-plugin-aggrid/src/AgGrid.js
+++ b/plugins/community-plugin-aggrid/src/AgGrid.js
@@ -30,6 +30,7 @@ const AgGrid = ({ components, events, loading, methods, properties }) => {
     ...someProperties
   } = properties;
   const [rowData, setRowData] = useState(newRowData ?? []);
+  const blockColumns = useRef({});
 
   const gridRef = useRef();
 
@@ -58,7 +59,7 @@ const AgGrid = ({ components, events, loading, methods, properties }) => {
     }
   }, []);
   const onCellClicked = useCallback((event) => {
-    if (events.onCellClick) {
+    if (events.onCellClick && !blockColumns.current[event.column.colId]) {
       methods.triggerEvent({
         name: 'onCellClick',
         event: {
@@ -174,7 +175,7 @@ const AgGrid = ({ components, events, loading, methods, properties }) => {
       onRowClicked={onRowClick}
       onCellClicked={onCellClicked}
       modules={[ClientSideRowModelModule, CsvExportModule]}
-      columnDefs={processColDefs(columnDefs, methods, components, events)}
+      columnDefs={processColDefs(columnDefs, methods, components, events, blockColumns)}
       ref={gridRef}
       getRowId={getRowId}
     />
diff --git a/plugins/community-plugin-aggrid/src/processColDefs.js b/plugins/community-plugin-aggrid/src/processColDefs.js
index 6b7011b..a2a2777 100644
--- a/plugins/community-plugin-aggrid/src/processColDefs.js
+++ b/plugins/community-plugin-aggrid/src/processColDefs.js
@@ -18,7 +18,7 @@ import { renderHtml } from '@lowdefy/block-utils';
 import { type } from '@lowdefy/helpers';
 import renderBlocks from './renderBlocks.js';
 
-function recProcessColDefs(columnDefs, methods, components, events) {
+function recProcessColDefs(columnDefs, methods, components, events, blockColumns) {
   return columnDefs.map((col) => {
     const newColDef = {};
     if (type.isArray(col.children)) {
@@ -31,21 +31,27 @@ function recProcessColDefs(columnDefs, methods, components, events) {
           methods,
         });
       };
-    } else if (type.isArray(col.blocks)) {
+    } else if (type.isArray(col.blocks) || type.isArray(col.cellRenderer)) {
       //TODO: delete col.blocks
+      const blocks = JSON.parse(JSON.stringify(col.blocks)) ?? col.cellRenderer;
       newColDef.cellRenderer = (params) => {
         return renderBlocks({
-          blocks: col.blocks,
+          blocks: blocks,
           methods,
           components,
           rowEvent: {
             row: params.data,
             rowIndex: params.rowIndex,
             index: parseInt(params.node.id),
+            columnId: params.column.colId,
           },
           events,
+          blockColumns,
         });
       };
+      // delete col.blocks;
+      // console.log('blocks: ', blocks);
+      // col.cellRenderer = blocks;
     }
     return {
       ...col,
@@ -54,8 +60,8 @@ function recProcessColDefs(columnDefs, methods, components, events) {
   });
 }
 
-function processColDefs(columnDefs = [], methods, components, events) {
-  return recProcessColDefs(columnDefs, methods, components, events);
+function processColDefs(columnDefs = [], methods, components, events, blockColumns) {
+  return recProcessColDefs(columnDefs, methods, components, events, blockColumns);
 }
 
 export default processColDefs;
diff --git a/plugins/community-plugin-aggrid/src/renderBlocks.js b/plugins/community-plugin-aggrid/src/renderBlocks.js
index 9515f6d..06a9775 100644
--- a/plugins/community-plugin-aggrid/src/renderBlocks.js
+++ b/plugins/community-plugin-aggrid/src/renderBlocks.js
@@ -50,20 +50,34 @@ const typeMap = {
   },
 };
 
-function registerEvent({ methods, eventId, actions, events }) {
-  if (events[eventId] || !actions) return;
+function registerEvent({ methods, eventId, actions, events, rowEvent, blockColumns }) {
+  if (!actions && events[eventId]) {
+    delete events[eventId];
+  }
+  if (!actions) return;
+
   methods.registerEvent({
     name: eventId,
     actions,
   });
+  if (!blockColumns.current[rowEvent.columnId]) {
+    blockColumns.current[rowEvent.columnId] = true;
+  }
 }
 
-function renderBlocks({ blocks, methods, components, rowEvent, events }) {
+function renderBlocks({ blocks, methods, components, rowEvent, events, blockColumns }) {
   return (
-    <div style={{ display: 'flex', gap: '4px' }}>
+    <div style={{ display: 'flex', gap: '4px', margin: 'auto' }}>
       {blocks.map((block, index) => {
         const eventId = `${block.id}_${rowEvent.rowIndex}_${index}_actions`;
-        registerEvent({ methods, eventId, actions: block.events?.onClick, events });
+        registerEvent({
+          methods,
+          eventId,
+          actions: block.events?.onClick,
+          events,
+          rowEvent,
+          blockColumns,
+        });
         return typeMap[block.type]({ block, methods, components, rowEvent, events, eventId });
       })}
     </div>

From d686db4dc6088d98a27527149e00a63ef0995f18 Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Wed, 18 Dec 2024 10:14:51 +0200
Subject: [PATCH 07/16] fix: Small refactor.

---
 plugins/community-plugin-aggrid/src/AgGrid.js | 20 +++++++++++---
 .../src/processColDefs.js                     |  8 +++---
 .../src/renderBlocks.js                       | 26 ++-----------------
 3 files changed, 23 insertions(+), 31 deletions(-)

diff --git a/plugins/community-plugin-aggrid/src/AgGrid.js b/plugins/community-plugin-aggrid/src/AgGrid.js
index 99a0285..00d104e 100644
--- a/plugins/community-plugin-aggrid/src/AgGrid.js
+++ b/plugins/community-plugin-aggrid/src/AgGrid.js
@@ -145,17 +145,31 @@ const AgGrid = ({ components, events, loading, methods, properties }) => {
     }
   }, []);
 
-  const clearBlockActions = useCallback(() => {
+  const registerBlockEvent = useCallback(({ eventId, actions, rowEvent }) => {
+    if (!actions && events[eventId]) {
+      delete events[eventId];
+    }
+    if (!actions) return;
+
+    methods.registerEvent({
+      name: eventId,
+      actions,
+    });
+    blockColumns.current[rowEvent.columnId] = true;
+  }, []);
+
+  const clearBlockEvents = useCallback(() => {
     Object.keys(events).forEach((key) => {
       if (key.endsWith('_actions')) {
         delete events[key];
       }
     });
+    blockColumns.current = {};
   }, []);
 
   useEffect(() => {
     if (JSON.stringify(rowData) !== JSON.stringify(newRowData)) {
-      clearBlockActions();
+      clearBlockEvents();
       setRowData(newRowData);
     }
   }, [newRowData]);
@@ -175,7 +189,7 @@ const AgGrid = ({ components, events, loading, methods, properties }) => {
       onRowClicked={onRowClick}
       onCellClicked={onCellClicked}
       modules={[ClientSideRowModelModule, CsvExportModule]}
-      columnDefs={processColDefs(columnDefs, methods, components, events, blockColumns)}
+      columnDefs={processColDefs(columnDefs, methods, components, events, registerBlockEvent)}
       ref={gridRef}
       getRowId={getRowId}
     />
diff --git a/plugins/community-plugin-aggrid/src/processColDefs.js b/plugins/community-plugin-aggrid/src/processColDefs.js
index a2a2777..4032c85 100644
--- a/plugins/community-plugin-aggrid/src/processColDefs.js
+++ b/plugins/community-plugin-aggrid/src/processColDefs.js
@@ -18,7 +18,7 @@ import { renderHtml } from '@lowdefy/block-utils';
 import { type } from '@lowdefy/helpers';
 import renderBlocks from './renderBlocks.js';
 
-function recProcessColDefs(columnDefs, methods, components, events, blockColumns) {
+function recProcessColDefs(columnDefs, methods, components, events, registerEvent) {
   return columnDefs.map((col) => {
     const newColDef = {};
     if (type.isArray(col.children)) {
@@ -46,7 +46,7 @@ function recProcessColDefs(columnDefs, methods, components, events, blockColumns
             columnId: params.column.colId,
           },
           events,
-          blockColumns,
+          registerEvent,
         });
       };
       // delete col.blocks;
@@ -60,8 +60,8 @@ function recProcessColDefs(columnDefs, methods, components, events, blockColumns
   });
 }
 
-function processColDefs(columnDefs = [], methods, components, events, blockColumns) {
-  return recProcessColDefs(columnDefs, methods, components, events, blockColumns);
+function processColDefs(columnDefs = [], methods, components, events, registerEvent) {
+  return recProcessColDefs(columnDefs, methods, components, events, registerEvent);
 }
 
 export default processColDefs;
diff --git a/plugins/community-plugin-aggrid/src/renderBlocks.js b/plugins/community-plugin-aggrid/src/renderBlocks.js
index 06a9775..e29432d 100644
--- a/plugins/community-plugin-aggrid/src/renderBlocks.js
+++ b/plugins/community-plugin-aggrid/src/renderBlocks.js
@@ -50,34 +50,12 @@ const typeMap = {
   },
 };
 
-function registerEvent({ methods, eventId, actions, events, rowEvent, blockColumns }) {
-  if (!actions && events[eventId]) {
-    delete events[eventId];
-  }
-  if (!actions) return;
-
-  methods.registerEvent({
-    name: eventId,
-    actions,
-  });
-  if (!blockColumns.current[rowEvent.columnId]) {
-    blockColumns.current[rowEvent.columnId] = true;
-  }
-}
-
-function renderBlocks({ blocks, methods, components, rowEvent, events, blockColumns }) {
+function renderBlocks({ blocks, methods, components, rowEvent, events, registerEvent }) {
   return (
     <div style={{ display: 'flex', gap: '4px', margin: 'auto' }}>
       {blocks.map((block, index) => {
         const eventId = `${block.id}_${rowEvent.rowIndex}_${index}_actions`;
-        registerEvent({
-          methods,
-          eventId,
-          actions: block.events?.onClick,
-          events,
-          rowEvent,
-          blockColumns,
-        });
+        registerEvent({ eventId, actions: block.events?.onClick, rowEvent });
         return typeMap[block.type]({ block, methods, components, rowEvent, events, eventId });
       })}
     </div>

From 3067d51731e2005cb317a344da5d5819a5793ba5 Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Wed, 18 Dec 2024 10:41:38 +0200
Subject: [PATCH 08/16] chore: Small fix and todo comment.

---
 plugins/community-plugin-aggrid/src/renderBlocks.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/plugins/community-plugin-aggrid/src/renderBlocks.js b/plugins/community-plugin-aggrid/src/renderBlocks.js
index e29432d..46371ec 100644
--- a/plugins/community-plugin-aggrid/src/renderBlocks.js
+++ b/plugins/community-plugin-aggrid/src/renderBlocks.js
@@ -38,6 +38,7 @@ const typeMap = {
     );
   },
   Tag: ({ block, methods, components, rowEvent, events, eventId }) => {
+    // TODO: Define onClose
     return (
       <Tag
         blockId={eventId}
@@ -52,7 +53,7 @@ const typeMap = {
 
 function renderBlocks({ blocks, methods, components, rowEvent, events, registerEvent }) {
   return (
-    <div style={{ display: 'flex', gap: '4px', margin: 'auto' }}>
+    <div style={{ display: 'flex', gap: '4px' }}>
       {blocks.map((block, index) => {
         const eventId = `${block.id}_${rowEvent.rowIndex}_${index}_actions`;
         registerEvent({ eventId, actions: block.events?.onClick, rowEvent });

From a613b01893f6ec56491f99fd4caa8bc718b02e53 Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Wed, 18 Dec 2024 10:53:59 +0200
Subject: [PATCH 09/16] chore: Added todo comment

---
 plugins/community-plugin-aggrid/src/AgGrid.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/plugins/community-plugin-aggrid/src/AgGrid.js b/plugins/community-plugin-aggrid/src/AgGrid.js
index 00d104e..7437510 100644
--- a/plugins/community-plugin-aggrid/src/AgGrid.js
+++ b/plugins/community-plugin-aggrid/src/AgGrid.js
@@ -59,6 +59,7 @@ const AgGrid = ({ components, events, loading, methods, properties }) => {
     }
   }, []);
   const onCellClicked = useCallback((event) => {
+    //TODO: cellClick triggers once if button modifies row data
     if (events.onCellClick && !blockColumns.current[event.column.colId]) {
       methods.triggerEvent({
         name: 'onCellClick',

From 72d01aa054114dc74fd81c98faef1b24b7f2ed8b Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Wed, 18 Dec 2024 15:43:48 +0200
Subject: [PATCH 10/16] feat: Map operators.

---
 plugins/community-plugin-aggrid/src/AgGrid.js |  3 +-
 .../src/mapOperators.js                       | 44 +++++++++++++++++++
 2 files changed, 46 insertions(+), 1 deletion(-)
 create mode 100644 plugins/community-plugin-aggrid/src/mapOperators.js

diff --git a/plugins/community-plugin-aggrid/src/AgGrid.js b/plugins/community-plugin-aggrid/src/AgGrid.js
index 7437510..46e5762 100644
--- a/plugins/community-plugin-aggrid/src/AgGrid.js
+++ b/plugins/community-plugin-aggrid/src/AgGrid.js
@@ -20,6 +20,7 @@ import { ClientSideRowModelModule } from '@ag-grid-community/client-side-row-mod
 import { CsvExportModule } from '@ag-grid-community/csv-export';
 
 import processColDefs from './processColDefs.js';
+import mapOperators from './mapOperators.js';
 
 const AgGrid = ({ components, events, loading, methods, properties }) => {
   const {
@@ -154,7 +155,7 @@ const AgGrid = ({ components, events, loading, methods, properties }) => {
 
     methods.registerEvent({
       name: eventId,
-      actions,
+      actions: mapOperators(actions),
     });
     blockColumns.current[rowEvent.columnId] = true;
   }, []);
diff --git a/plugins/community-plugin-aggrid/src/mapOperators.js b/plugins/community-plugin-aggrid/src/mapOperators.js
new file mode 100644
index 0000000..9da75b0
--- /dev/null
+++ b/plugins/community-plugin-aggrid/src/mapOperators.js
@@ -0,0 +1,44 @@
+/*
+  Copyright 2021 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/
+
+// TODO: Recursively find and replace keys
+import { type } from '@lowdefy/helpers';
+
+function recMapOperators(action) {
+  if (!type.isObject(action) && !type.isArray(action)) {
+    return action;
+  }
+
+  if (type.isArray(action)) {
+    return action.map((actionObj) => recMapOperators(actionObj));
+  }
+
+  const newObject = {};
+  const prefix = '$';
+
+  Object.entries(action).forEach(([key, value]) => {
+    const newKey = key.replace(new RegExp(`^\\${prefix}+`), (match) => '_'.repeat(match.length));
+    newObject[newKey] = recMapOperators(value);
+  });
+
+  return newObject;
+}
+
+function mapOperators(actions) {
+  return recMapOperators(actions);
+}
+
+export default mapOperators;

From 723e3492703bd52f150592bd3b0011abb4132d4f Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Wed, 18 Dec 2024 16:15:32 +0200
Subject: [PATCH 11/16] chore: Remove todo comment

---
 plugins/community-plugin-aggrid/src/mapOperators.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/plugins/community-plugin-aggrid/src/mapOperators.js b/plugins/community-plugin-aggrid/src/mapOperators.js
index 9da75b0..ce72bf1 100644
--- a/plugins/community-plugin-aggrid/src/mapOperators.js
+++ b/plugins/community-plugin-aggrid/src/mapOperators.js
@@ -14,7 +14,6 @@
   limitations under the License.
 */
 
-// TODO: Recursively find and replace keys
 import { type } from '@lowdefy/helpers';
 
 function recMapOperators(action) {

From cf944c92836a52b040d1aeaf1b18ded731ba1957 Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Thu, 19 Dec 2024 11:36:09 +0200
Subject: [PATCH 12/16] fix: Updated mapOperators.

---
 plugins/community-plugin-aggrid/src/mapOperators.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/plugins/community-plugin-aggrid/src/mapOperators.js b/plugins/community-plugin-aggrid/src/mapOperators.js
index ce72bf1..6622721 100644
--- a/plugins/community-plugin-aggrid/src/mapOperators.js
+++ b/plugins/community-plugin-aggrid/src/mapOperators.js
@@ -26,10 +26,10 @@ function recMapOperators(action) {
   }
 
   const newObject = {};
-  const prefix = '$';
+  const prefix = '_';
 
   Object.entries(action).forEach(([key, value]) => {
-    const newKey = key.replace(new RegExp(`^\\${prefix}+`), (match) => '_'.repeat(match.length));
+    const newKey = key.replace(new RegExp(`^${prefix}`), '');
     newObject[newKey] = recMapOperators(value);
   });
 

From bb11ac8fbab16f11635c7dd7b129f0bd1591d470 Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Thu, 19 Dec 2024 11:41:34 +0200
Subject: [PATCH 13/16] fix: Updated register function.

---
 plugins/community-plugin-aggrid/src/AgGrid.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/plugins/community-plugin-aggrid/src/AgGrid.js b/plugins/community-plugin-aggrid/src/AgGrid.js
index 46e5762..1c7a85e 100644
--- a/plugins/community-plugin-aggrid/src/AgGrid.js
+++ b/plugins/community-plugin-aggrid/src/AgGrid.js
@@ -148,10 +148,10 @@ const AgGrid = ({ components, events, loading, methods, properties }) => {
   }, []);
 
   const registerBlockEvent = useCallback(({ eventId, actions, rowEvent }) => {
-    if (!actions && events[eventId]) {
-      delete events[eventId];
+    if (!actions || events[eventId]) {
+      blockColumns.current[rowEvent.columnId] = !!events[eventId];
+      return;
     }
-    if (!actions) return;
 
     methods.registerEvent({
       name: eventId,

From 128542000813af69c6fd8623b80e9b53d19fac0f Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Thu, 19 Dec 2024 12:06:42 +0200
Subject: [PATCH 14/16] chore: Remove comments.

---
 plugins/community-plugin-aggrid/src/processColDefs.js | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/plugins/community-plugin-aggrid/src/processColDefs.js b/plugins/community-plugin-aggrid/src/processColDefs.js
index 4032c85..b686b19 100644
--- a/plugins/community-plugin-aggrid/src/processColDefs.js
+++ b/plugins/community-plugin-aggrid/src/processColDefs.js
@@ -49,9 +49,6 @@ function recProcessColDefs(columnDefs, methods, components, events, registerEven
           registerEvent,
         });
       };
-      // delete col.blocks;
-      // console.log('blocks: ', blocks);
-      // col.cellRenderer = blocks;
     }
     return {
       ...col,

From 5df16c2a57e2e7b6041bef9bcb91fbf66071790c Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Thu, 19 Dec 2024 12:08:02 +0200
Subject: [PATCH 15/16] chore: Remove unused code.

---
 plugins/community-plugin-aggrid/src/processColDefs.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/plugins/community-plugin-aggrid/src/processColDefs.js b/plugins/community-plugin-aggrid/src/processColDefs.js
index b686b19..c43cbfc 100644
--- a/plugins/community-plugin-aggrid/src/processColDefs.js
+++ b/plugins/community-plugin-aggrid/src/processColDefs.js
@@ -33,10 +33,9 @@ function recProcessColDefs(columnDefs, methods, components, events, registerEven
       };
     } else if (type.isArray(col.blocks) || type.isArray(col.cellRenderer)) {
       //TODO: delete col.blocks
-      const blocks = JSON.parse(JSON.stringify(col.blocks)) ?? col.cellRenderer;
       newColDef.cellRenderer = (params) => {
         return renderBlocks({
-          blocks: blocks,
+          blocks: col.blocks,
           methods,
           components,
           rowEvent: {

From c5e4ca06e641e7aa4e768c5c0aecb99a4e853563 Mon Sep 17 00:00:00 2001
From: Salahuddin Saiet <salahuddin@lowdefy.com>
Date: Thu, 19 Dec 2024 14:25:15 +0200
Subject: [PATCH 16/16] chore: Add changeset

---
 .changeset/olive-falcons-type.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/olive-falcons-type.md

diff --git a/.changeset/olive-falcons-type.md b/.changeset/olive-falcons-type.md
new file mode 100644
index 0000000..bd18263
--- /dev/null
+++ b/.changeset/olive-falcons-type.md
@@ -0,0 +1,5 @@
+---
+'@lowdefy/community-plugin-aggrid': minor
+---
+
+Add support for rendering Button and Tag blocks within AgGrid cells.