From 86375bd13d2968855604a7dcbcbf5018a4d4f552 Mon Sep 17 00:00:00 2001 From: BSd3v <82055130+BSd3v@users.noreply.github.com> Date: Sat, 1 Feb 2025 07:53:08 -0500 Subject: [PATCH 1/4] this adds the ability for devs to define custom event data without needing to retrofit another prop --- src/lib/components/AgGrid.react.js | 15 +++++++++++ src/lib/fragments/AgGrid.react.js | 7 +++++ tests/assets/dashAgGridFunctions.js | 6 +++++ tests/test_event_listeners.py | 40 ++++++++++++++++++++++++++++- 4 files changed, 67 insertions(+), 1 deletion(-) diff --git a/src/lib/components/AgGrid.react.js b/src/lib/components/AgGrid.react.js index 0cec03f1..3cca1376 100644 --- a/src/lib/components/AgGrid.react.js +++ b/src/lib/components/AgGrid.react.js @@ -533,6 +533,21 @@ DashAgGrid.propTypes = { */ eventListeners: PropTypes.objectOf(PropTypes.array), + /** + * Object of Event Data from the grid, based upon when a user triggered an event with an event listener. + */ + eventData: PropTypes.shape({ + /** + * Data that the developers passes back + */ + data: PropTypes.any, + + /** + * Timestamp of when the event was fired + */ + timestamp: PropTypes.any, + }), + /******************************** * GRID PROPS *******************************/ diff --git a/src/lib/fragments/AgGrid.react.js b/src/lib/fragments/AgGrid.react.js index fa4d8138..d56df4dd 100644 --- a/src/lib/fragments/AgGrid.react.js +++ b/src/lib/fragments/AgGrid.react.js @@ -174,6 +174,12 @@ export default class DashAgGrid extends Component { this.props.setProps(propsToSet); } }; + this.setEventData = (data) => { + const timestamp = Date.now(); + this.customSetProps({eventData: { + data, timestamp + }}) + }; this.convertedPropCache = {}; @@ -1094,6 +1100,7 @@ export default class DashAgGrid extends Component { ...customFunctions, ...window.dashAgGridFunctions, setGridProps: this.customSetProps, + setEventData: this.setEventData, }; return (params) => evaluate(parsedCondition, {params, ...context}); }); diff --git a/tests/assets/dashAgGridFunctions.js b/tests/assets/dashAgGridFunctions.js index 2128fa6c..670a0907 100644 --- a/tests/assets/dashAgGridFunctions.js +++ b/tests/assets/dashAgGridFunctions.js @@ -499,3 +499,9 @@ dagfuncs.showOutput = (params, setGridProps) => { dagfuncs.sortColumns = (a, b) => b.localeCompare(a) // BEGIN test_pivot_column_order.py + + +dagfuncs.TestEvent = (params, setEventData) => { + console.log(params) + setEventData('here I am') +} \ No newline at end of file diff --git a/tests/test_event_listeners.py b/tests/test_event_listeners.py index 5fbd289b..4b9fd84b 100644 --- a/tests/test_event_listeners.py +++ b/tests/test_event_listeners.py @@ -1,8 +1,11 @@ import dash_ag_grid as dag -from dash import Dash, html, dcc, Input, Output, State +from dash import Dash, html, dcc, Input, Output, State, Patch import plotly.express as px from . import utils import json +from selenium.webdriver.common.by import By +from dash.testing.wait import until + df = px.data.medals_wide() @@ -84,3 +87,38 @@ def test_el002_event_listener(dash_duo): # Test left click. grid.get_cell(1, 2).click() assert dash_duo.find_element('#log').text == "rawr" + +def test_el003_event_listener(dash_duo): + app = Dash(__name__, suppress_callback_exceptions=True) + app.layout = html.Div([ + dag.AgGrid(id='grid', + columnDefs=[{'field': 'test'}], + rowData=[{'test': '1'}], + eventListeners={'cellClicked': ['TestEvent(params, setEventData)']} + ), + html.Div(id='output', children=[]) + ] + ) + + @app.callback( + Output('output', 'children'), + Input('grid', 'eventData') + ) + def show_event_data(v): + children = Patch() + if v: + children.append(html.Div(json.dumps(v))) + return children + + dash_duo.start_server(app) + + grid = utils.Grid(dash_duo, "grid") + grid.wait_for_cell_text(0, 0, "1") + + for i in range(5): + grid.get_cell(0, 0).click() + + # Assert that the output element has children + until(lambda: len(dash_duo.find_element("#output").find_elements(By.XPATH, "*")) == (i + 1), timeout=3) + + From 854795c566f888a39aa6d8c87867a69a124d9b6f Mon Sep 17 00:00:00 2001 From: BSd3v <82055130+BSd3v@users.noreply.github.com> Date: Sat, 1 Feb 2025 07:57:00 -0500 Subject: [PATCH 2/4] adjustments for lint --- src/lib/fragments/AgGrid.react.js | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/src/lib/fragments/AgGrid.react.js b/src/lib/fragments/AgGrid.react.js index d56df4dd..4c10af28 100644 --- a/src/lib/fragments/AgGrid.react.js +++ b/src/lib/fragments/AgGrid.react.js @@ -176,9 +176,12 @@ export default class DashAgGrid extends Component { }; this.setEventData = (data) => { const timestamp = Date.now(); - this.customSetProps({eventData: { - data, timestamp - }}) + this.customSetProps({ + eventData: { + data, + timestamp, + }, + }); }; this.convertedPropCache = {}; From 71fda0ba01311892affe5414a8151c6423ceef76 Mon Sep 17 00:00:00 2001 From: BSd3v <82055130+BSd3v@users.noreply.github.com> Date: Sat, 1 Feb 2025 07:59:08 -0500 Subject: [PATCH 3/4] adding `eventData` for props not for the grid --- src/lib/utils/propCategories.js | 2 ++ tests/test_event_listeners.py | 2 +- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/lib/utils/propCategories.js b/src/lib/utils/propCategories.js index 957cab1c..e6995f85 100644 --- a/src/lib/utils/propCategories.js +++ b/src/lib/utils/propCategories.js @@ -347,6 +347,7 @@ export const PROPS_NOT_FOR_AG_GRID = [ 'columnSize', 'scrollTo', 'eventListeners', + 'eventData', ]; /** @@ -364,6 +365,7 @@ export const OMIT_PROP_RENDER = [ 'paginationInfo', 'cellRendererData', 'cellDoubleClicked', + 'eventData', ]; /** diff --git a/tests/test_event_listeners.py b/tests/test_event_listeners.py index 4b9fd84b..867834ad 100644 --- a/tests/test_event_listeners.py +++ b/tests/test_event_listeners.py @@ -117,7 +117,7 @@ def show_event_data(v): for i in range(5): grid.get_cell(0, 0).click() - + # Assert that the output element has children until(lambda: len(dash_duo.find_element("#output").find_elements(By.XPATH, "*")) == (i + 1), timeout=3) From f549b021df3a5ecf546910330d4063ccbab00a17 Mon Sep 17 00:00:00 2001 From: BSd3v <82055130+BSd3v@users.noreply.github.com> Date: Fri, 7 Feb 2025 11:39:22 -0500 Subject: [PATCH 4/4] updating changelog --- CHANGELOG.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 43b7dc02..5b0da1ac 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,6 +10,9 @@ Links "DE#nnn" prior to version 2.0 point to the Dash Enterprise closed-source D - [#346](https://github.com/plotly/dash-ag-grid/pull/346) Fixes issue [#347](https://github.com/plotly/dash-ag-grid/issues/347) where styling wasnt considering if the grid had rows without `data`. This is related to the alteration in [#332](https://github.com/plotly/dash-ag-grid/pull/332) - [#353](https://github.com/plotly/dash-ag-grid/pull/353) Adjustments for support of Dash 3 +### Added +- [#352](https://github.com/plotly/dash-ag-grid/pull/352) Adds `eventData` prop for devs to send arbitrary events from the grid events complete with an auto timestamp + ## [31.3.0] - 2024-11-22 ### Fixed