From cb438ce67bcd24ce8f0ca6d7d62872d6bf6dbaf3 Mon Sep 17 00:00:00 2001 From: Sean Landsman Date: Fri, 11 Jan 2019 11:06:50 +0000 Subject: [PATCH 1/5] Update versions --- package.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index 2d1122d..551542a 100644 --- a/package.json +++ b/package.json @@ -57,9 +57,9 @@ "webpack-dev-server": "3.1.14" }, "dependencies": { - "ag-grid-community": "^19.1.0", - "ag-grid-enterprise": "^19.1.0", - "ag-grid-react": "^19.1.0", + "ag-grid-community": "^20.0.0", + "ag-grid-enterprise": "^20.0.0", + "ag-grid-react": "^20.0.0", "bootstrap": "4.1.3", "d3": "4.9.1", "lodash": "^4.17.11", From e07c66c95d071b377369ed7f258ff46ea7d79db9 Mon Sep 17 00:00:00 2001 From: Sean Landsman Date: Fri, 8 Feb 2019 11:00:27 +0000 Subject: [PATCH 2/5] AG-2264 Configuring AggregationPanel in status bar does not work if any other status panel is enabled --- package.json | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/package.json b/package.json index 551542a..1e5fcb1 100644 --- a/package.json +++ b/package.json @@ -38,10 +38,10 @@ "homepage": "http://www.ag-grid.com/", "devDependencies": { "@babel/core": "7.2.2", - "babel-loader": "8.0.4", - "@babel/preset-env": "7.2.3", + "babel-loader": "8.0.5", + "@babel/preset-env": "7.3.1", "@babel/preset-react": "7.0.0", - "@babel/plugin-proposal-class-properties": "7.2.3", + "@babel/plugin-proposal-class-properties": "7.3.0", "@babel/plugin-proposal-function-bind": "7.2.0", "css-loader": "2.1.0", "file-loader": "3.0.1", @@ -62,11 +62,11 @@ "ag-grid-react": "^20.0.0", "bootstrap": "4.1.3", "d3": "4.9.1", - "lodash": "^4.17.11", - "react": "16.7.0", - "react-dom": "16.7.0", + "lodash": "4.17.11", + "react": "16.8.1", + "react-dom": "16.8.1", "react-redux": "6.0.0", "react-router-dom": "4.3.1", "redux": "4.0.1" } -} \ No newline at end of file +} From 74ccfa6b264dba9953e33d63040087daf3120d9f Mon Sep 17 00:00:00 2001 From: Sean Landsman Date: Tue, 12 Feb 2019 14:45:24 +0000 Subject: [PATCH 3/5] AG-2653 Put React Hook example together, update docs --- src-examples/App.jsx | 3 + .../simpleReduxHooksExample/GridComponent.jsx | 32 ++++++++ .../simpleReduxHooksExample/PriceRenderer.jsx | 13 ++++ .../SimpleReduxHookExample.jsx | 18 +++++ .../gridDataActions.jsx | 14 ++++ src-examples/simpleReduxHooksExample/store.js | 75 +++++++++++++++++++ 6 files changed, 155 insertions(+) create mode 100644 src-examples/simpleReduxHooksExample/GridComponent.jsx create mode 100644 src-examples/simpleReduxHooksExample/PriceRenderer.jsx create mode 100644 src-examples/simpleReduxHooksExample/SimpleReduxHookExample.jsx create mode 100644 src-examples/simpleReduxHooksExample/gridDataActions.jsx create mode 100644 src-examples/simpleReduxHooksExample/store.js diff --git a/src-examples/App.jsx b/src-examples/App.jsx index c6cc744..9c15645 100644 --- a/src-examples/App.jsx +++ b/src-examples/App.jsx @@ -5,12 +5,14 @@ import NavItem from "./NavItem"; import RichGridDeclarativeExample from "./richGridDeclarativeExample/RichGridDeclarativeExample"; import SimpleReduxDynamicExample from "./simpleReduxDynamicComponentExample/SimpleReduxExample"; +import SimpleReduxHookExample from "./simpleReduxHooksExample/SimpleReduxHookExample"; const SideBar = () => (
    Rich Grid with Declarative Markup Simple Redux Dynamic Component Example + Simple Redux Dynamic Component Example
); @@ -25,6 +27,7 @@ class App extends Component { + diff --git a/src-examples/simpleReduxHooksExample/GridComponent.jsx b/src-examples/simpleReduxHooksExample/GridComponent.jsx new file mode 100644 index 0000000..4f924da --- /dev/null +++ b/src-examples/simpleReduxHooksExample/GridComponent.jsx @@ -0,0 +1,32 @@ +import React, { useContext } from "react"; +import {Context} from "./store"; +import {AgGridReact} from "ag-grid-react"; + +/* + * This component serves to display the row data (provided by redux) + */ +export default function GridComponent() { + const {store, dispatch} = useContext(Context); + const {columnDefs, rowData} = store; + + const onGridReady = (params) => { + params.api.sizeColumnsToFit(); + }; + + // row data will be provided via redux on this.props.rowData + return ( +
+ + +
+ ) +} diff --git a/src-examples/simpleReduxHooksExample/PriceRenderer.jsx b/src-examples/simpleReduxHooksExample/PriceRenderer.jsx new file mode 100644 index 0000000..8e60e1c --- /dev/null +++ b/src-examples/simpleReduxHooksExample/PriceRenderer.jsx @@ -0,0 +1,13 @@ +import React, {Component} from "react"; + +export default class PriceRenderer extends Component { + constructor(props) { + super(props); + } + + render() { + return ( + {this.props.value} + ); + } +} diff --git a/src-examples/simpleReduxHooksExample/SimpleReduxHookExample.jsx b/src-examples/simpleReduxHooksExample/SimpleReduxHookExample.jsx new file mode 100644 index 0000000..45d157d --- /dev/null +++ b/src-examples/simpleReduxHooksExample/SimpleReduxHookExample.jsx @@ -0,0 +1,18 @@ +import React, {useReducer} from "react"; +import GridComponent from "./GridComponent"; + +import {Context, initialState, reducer} from "./store"; + +export default function SimpleReduxHookExample() { + const [store, dispatch] = useReducer(reducer, initialState); + + return ( + +
+

Simple Example using Hooks (with useContext and useReducer)

+ + +
+ + ) +} diff --git a/src-examples/simpleReduxHooksExample/gridDataActions.jsx b/src-examples/simpleReduxHooksExample/gridDataActions.jsx new file mode 100644 index 0000000..c955838 --- /dev/null +++ b/src-examples/simpleReduxHooksExample/gridDataActions.jsx @@ -0,0 +1,14 @@ +export function updateRowData(rowData) { + return { + type: 'ROW_DATA_CHANGED', + rowData + } +} + +export function setCurrency(currencySymbol, exchangeRate) { + return { + type: 'CURRENCY_CHANGED', + currencySymbol, + exchangeRate + } +} \ No newline at end of file diff --git a/src-examples/simpleReduxHooksExample/store.js b/src-examples/simpleReduxHooksExample/store.js new file mode 100644 index 0000000..da862a6 --- /dev/null +++ b/src-examples/simpleReduxHooksExample/store.js @@ -0,0 +1,75 @@ +import React from "react"; +import PriceRenderer from "./PriceRenderer"; + +export const initialState = { + rowData: [], + columnDefs: [ + { + field: 'symbol' + }, + { + field: 'price', + cellClass: 'align-right', + cellRendererFramework: PriceRenderer + } + ] +}; + +export const reducer = (state = {rowData: []}, action) => { + switch (action.type) { + case 'SET_ROW_DATA': + return { + ...state, + rowData: createRowData() + }; + default: + return state; + } +}; + +export const Context = React.createContext(); + + +// for test data +// the following methods are for creating dummy row data +const createRowData = () => { + let rowData = []; + + for (let i = 0; i < 14; i++) { + let newItem = createItem(rowData); + rowData.push(newItem); + } + + return rowData; +}; + +const createItem = (rowData) => { + return { + symbol: createUniqueRandomSymbol(rowData), + price: Math.floor(Math.random() * 100) + }; +}; + +// creates a unique symbol, eg 'ADG' or 'ZJD' +const createUniqueRandomSymbol = (rowData) => { + let symbol; + let possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; + + let isUnique = false; + while (!isUnique) { + symbol = ''; + // create symbol + for (let i = 0; i < 3; i++) { + symbol += possible.charAt(Math.floor(Math.random() * possible.length)); + } + // check uniqueness + isUnique = true; + rowData.forEach(function (oldItem) { + if (oldItem.symbol === symbol) { + isUnique = false; + } + }); + } + + return symbol; +}; From 7ff41a69666249d933c8bded7f84fd58663e4b41 Mon Sep 17 00:00:00 2001 From: Sean Landsman Date: Wed, 20 Feb 2019 15:35:12 +0000 Subject: [PATCH 4/5] Update fw examples --- package.json | 26 +++++++++---------- src-examples/App.jsx | 2 +- .../RichGridDeclarativeExample.jsx | 20 +++++++------- 3 files changed, 25 insertions(+), 23 deletions(-) diff --git a/package.json b/package.json index 1e5fcb1..b454493 100644 --- a/package.json +++ b/package.json @@ -37,35 +37,35 @@ }, "homepage": "http://www.ag-grid.com/", "devDependencies": { - "@babel/core": "7.2.2", + "@babel/core": "7.3.3", "babel-loader": "8.0.5", "@babel/preset-env": "7.3.1", "@babel/preset-react": "7.0.0", - "@babel/plugin-proposal-class-properties": "7.3.0", + "@babel/plugin-proposal-class-properties": "7.3.3", "@babel/plugin-proposal-function-bind": "7.2.0", "css-loader": "2.1.0", "file-loader": "3.0.1", "gulp": "3.9.1", - "merge2": "^1.2.3", + "merge2": "1.2.3", "mkdirp": "0.5.1", "ncp": "2.0.0", - "prop-types": "15.6.2", - "rimraf": "~2.6.2", - "style-loader": "~0.23.0", - "webpack": "4.28.3", - "webpack-cli": "3.2.0", - "webpack-dev-server": "3.1.14" + "prop-types": "15.7.2", + "rimraf": "2.6.3", + "style-loader": "0.23.1", + "webpack": "4.29.5", + "webpack-cli": "3.2.3", + "webpack-dev-server": "3.2.0" }, "dependencies": { "ag-grid-community": "^20.0.0", "ag-grid-enterprise": "^20.0.0", "ag-grid-react": "^20.0.0", - "bootstrap": "4.1.3", + "bootstrap": "4.3.1", "d3": "4.9.1", "lodash": "4.17.11", - "react": "16.8.1", - "react-dom": "16.8.1", - "react-redux": "6.0.0", + "react": "16.8.2", + "react-dom": "16.8.2", + "react-redux": "6.0.1", "react-router-dom": "4.3.1", "redux": "4.0.1" } diff --git a/src-examples/App.jsx b/src-examples/App.jsx index 9c15645..812c66d 100644 --- a/src-examples/App.jsx +++ b/src-examples/App.jsx @@ -12,7 +12,7 @@ const SideBar = () => (
    Rich Grid with Declarative Markup Simple Redux Dynamic Component Example - Simple Redux Dynamic Component Example + Simple React Hook Component Example
); diff --git a/src-examples/richGridDeclarativeExample/RichGridDeclarativeExample.jsx b/src-examples/richGridDeclarativeExample/RichGridDeclarativeExample.jsx index 7347bd1..047c9e6 100644 --- a/src-examples/richGridDeclarativeExample/RichGridDeclarativeExample.jsx +++ b/src-examples/richGridDeclarativeExample/RichGridDeclarativeExample.jsx @@ -141,17 +141,8 @@ export default class RichGridDeclarativeExample extends Component {
- -
-
-
- -
Filter API:
+
+
+ +
+
+ +
+
Date: Wed, 20 Feb 2019 17:36:11 +0000 Subject: [PATCH 5/5] Release 20.1.0 dist files added and license key updated --- package.json | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index b454493..df452f4 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ag-grid-react-example", - "version": "19.1.2", + "version": "20.1.0", "description": "Example Reach applicaiton using ag-Grid.", "main": "dist/ag-grid-react-example.js", "scripts": { @@ -57,9 +57,9 @@ "webpack-dev-server": "3.2.0" }, "dependencies": { - "ag-grid-community": "^20.0.0", - "ag-grid-enterprise": "^20.0.0", - "ag-grid-react": "^20.0.0", + "ag-grid-community": "^20.1.0", + "ag-grid-enterprise": "^20.1.0", + "ag-grid-react": "^20.1.0", "bootstrap": "4.3.1", "d3": "4.9.1", "lodash": "4.17.11", @@ -69,4 +69,4 @@ "react-router-dom": "4.3.1", "redux": "4.0.1" } -} +} \ No newline at end of file