Skip to content

0.5.2 #32

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 11 commits into from
Jun 6, 2019
Merged

0.5.2 #32

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
66c4db2
When height not defined, windowing is disabled.
easeq Jun 6, 2019
15c0a64
Added class name to html elements in the toolbar
easeq Jun 6, 2019
d08cbb6
Update dependencies
easeq Jun 6, 2019
5f7c85c
Disable autocomplete on filters (fixes #29)
easeq Jun 6, 2019
d159976
Updated modified fields feature
easeq Jun 6, 2019
711d88c
Updated editable feature
easeq Jun 6, 2019
1617c4f
Updated editable button labels
easeq Jun 6, 2019
740e11e
Added space (fixes #31)
easeq Jun 6, 2019
720a039
0.5.2
easeq Jun 6, 2019
bf60a98
Fixed action MODIFY_DATA with payload clear: true
easeq Jun 6, 2019
07618fb
Minor typo fix
easeq Jun 6, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
34 changes: 18 additions & 16 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -218,8 +218,8 @@ const YourComponent = () =>
| toolbar | array | false | \[] | Toolbar definition (Check below) |
| columns | array | true | - | Columns to display |
| styles | object | false | {} | Custom styles for your table |
| editable | boolean | false | {} | Set whether the table is editable |
| editing | boolean | false | {} | Set the default state of the table to be in editing mode |
| editable | boolean | false | {} | Set whether the table is editable |
| editing | boolean | false | {} | Set the default state of the table to be in editing mode |
| primaryKey | string | true | {} | Set the primary key column of the table for actions like editing. |

#### Pagination object
Expand Down Expand Up @@ -255,19 +255,21 @@ const YourComponent = () =>
Toolbar config is an array of array of object where objects are the
toolbar items. Each inner array represents a different row.

| Key | Type | Required | Default | Description |
| --------------------- | -------- | -------- | ------- | ------------------------------------------------------------------------- |
| type | string | false | actions | Available values resetFilters, print, editable and columns |
| label | string | true | - | Label for the toolbar item |
| visible | boolean | false | true | Whether the item is visible |
| state | boolean | false | false | Whether to pass the state object as item prop |
| **For type: actions** | | | | |
| options | array | true | - | Array of option objects |
| **-- options** | | | | |
| type | string | true | action | Available option: action |
| name | string | true | - | Unique name for the action |
| label | string | true | - | Label for the action |
| thunk | function | true | - | An action creator which is dispatched on action click. Check demo schema. |
| Key | Type | Required | Default | Description |
| ---------------------- | -------- | -------- | ------------------------------------------------------------- | ------------------------------------------------------------------------- |
| type | string | false | actions | Available values resetFilters, print, editable and columns |
| label | string | true | - | Label for the toolbar item |
| visible | boolean | false | true | Whether the item is visible |
| state | boolean | false | false | Whether to pass the state object as item prop |
| **For type: actions** | | | | |
| options | array | true | - | Array of option objects |
| **-- options** | | | | |
| type | string | true | action | Available option: action |
| name | string | true | - | Unique name for the action |
| label | string | true | - | Label for the action |
| thunk | function | true | - | An action creator which is dispatched on action click. Check demo schema. |
| **For type: editable** | | | | |
| labels | object | false | { show: 'Make editable', hide: 'Hide editable', save: 'Save'} | Labels for each of the buttons enabled when the table is editable |

Note: action of type "editable" is required when you set the table to be editable

Expand All @@ -279,7 +281,7 @@ Note: action of type "editable" is required when you set the table to be editabl
| label | string | true | - | Label for the column |
| sortable | boolean | false | true | Whether the column is sortable |
| filterable | boolean | false | true | Whether the column is filterable |
| editable | boolean | false | false | When the table is set to be editable, set whether the respective column is among the editable |
| editable | boolean | false | false | When the table is set to be editable, set whether the respective column is among the editable |
| visible | boolean | false | true | Whether the column is visible on load |
| type | string | true | string | Available types: selection, number, date, string, image, options, actions |
| width | integer | true | - | Width of the column |
Expand Down
27 changes: 15 additions & 12 deletions demo/src/schema/basic.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import React from 'react';
import { MODIFY_DATA } from '../../../src/actions';

export default {
name: 'posts',
Expand Down Expand Up @@ -149,7 +150,7 @@ export default {
name: 'delete',
label: 'Delete',
indexField: '@id',
thunk: ( payload ) => ( dispatch, getState ) => {
thunk: ( config ) => ( dispatch, getState ) => {
// Get current table state.
const tableState = getState()[payload.reducerName][payload.name];
confirm('Are your sure you want to delete the selected items?')
Expand All @@ -172,7 +173,7 @@ export default {
label: 'Simple Button',
visible: true,
state: false,
thunk: ( payload ) => ( dispatch, getState ) => {
thunk: ( config ) => ( dispatch, getState ) => {
console.log('toolbar button click', payload);
}
}, {
Expand All @@ -194,16 +195,17 @@ export default {
}, {
name: 'editable',
type: 'editable',
editableLabel: {
0: 'Make editable',
1: 'Hide editable'
labels: {
show: 'Make editable',
hide: 'Hide editable',
save: 'Save',
},
saveLabel: 'Save',
save: ( payload ) => ( dispatch, getState ) => {
const tableState = getState()[payload.reducerName][payload.name];
console.log('toolbar save click with modified data', payload, tableState.modified);
save: ( config ) => ( dispatch, getState ) => {
const tableState = getState()[config.reducerName][config.name];
console.log('toolbar save click with modified data', config, tableState.modified);
config.payload.action(MODIFY_DATA)({ clear: true });
// Dispatch MODIFY_DATA action with clear: true, to reset the modified data
// Dispatch REQUEST_DATA action "payload.action(REQUEST_DATA)" to refresh data.
// Dispatch REQUEST_DATA action "config.payload.action(REQUEST_DATA)" to refresh data.
}
}],
],
Expand All @@ -230,6 +232,7 @@ export default {
sortable: true,
filterable: true,
textAlign: "center",
width: 150,
options: {
"published": {
"label": "Published"
Expand Down Expand Up @@ -277,7 +280,7 @@ export default {
params: {
id: '@id',
},
thunk: ( payload ) => ( dispatch, getState ) => {
thunk: ( config ) => ( dispatch, getState ) => {
console.log('edit', payload, getState());
}
}, {
Expand All @@ -288,7 +291,7 @@ export default {
params: {
id: '@id'
},
thunk: ( payload ) => ( dispatch, getState ) => {
thunk: ( config ) => ( dispatch, getState ) => {
confirm('Are your sure you want to delete this page?')
? console.log('delete', getState())
: console.log(false);
Expand Down
21 changes: 12 additions & 9 deletions nwb.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,15 @@
module.exports = {
type: 'react-component',
npm: {
esModules: true,
umd: {
global: 'ReduxDatatable',
externals: {
react: 'React'
}
type: 'react-component',
npm: {
esModules: true,
umd: {
global: 'ReduxDatatable',
externals: {
react: 'React',
lodash: '_',
"redux-observable": 'ReduxObservable',
"redux-thunk": 'ReduxThunk'
}
}
}
}
};
62 changes: 41 additions & 21 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

19 changes: 11 additions & 8 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@flipbyte/redux-datatable",
"version": "0.5.1",
"version": "0.5.2",
"description": "React-Redux data table",
"main": "lib/index.js",
"module": "es/index.js",
Expand All @@ -20,35 +20,38 @@
"test:watch": "nwb test-react --server"
},
"peerDependencies": {
"lodash": ">=4.17.11",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"rxjs": "^6.4.0",
"prop-types": "^15.6.2",
"react-redux": "^6.0.1",
"redux": "^4.0.1",
"styled-components": "^4.2.0"
"styled-components": "^4.2.0",
"redux-observable": "^1.1.0",
"redux-thunk": "^2.3.0"
},
"dependencies": {
"lodash": ">=4.17.10",
"normalizr": "^3.3.0",
"object-assign-deep": "^0.4.0",
"query-string": "^6.1.0",
"react-pure-time": "^0.2.2",
"react-redux-notify": "^4.1.0",
"redux-observable": "^1.0.0",
"redux-thunk": "^2.3.0"
"react-redux-notify": "^4.1.1"
},
"devDependencies": {
"axios": "^0.18.0",
"axios-observable": "^1.0.7",
"axios": "^0.19.0",
"axios-observable": "^1.1.0",
"bootstrap": "^4.3.1",
"lodash": ">=4.17.11",
"nwb": "0.23.x",
"path-to-regexp": "^3.0.0",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-redux": "^6.0.1",
"redux": "^4.0.1",
"redux-logger": "^3.0.6",
"redux-observable": "^1.1.0",
"redux-thunk": "^2.3.0",
"rxjs": "^6.4.0",
"styled-components": "^4.2.0"
},
Expand Down
10 changes: 7 additions & 3 deletions src/Renderer/Body/Date.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,18 +9,22 @@ const Date = ({
index,
isEditing,
handleChange,
modifiedData,
isModified,
modifiedValue,
value = '',
colConfig: { name, textAlign, format, editable }
}) => (
<Fragment>
{ (!editable || !isEditing) && <Time value={ _.get(data, name, '') } format={ format ? format : 'F j, Y, g:i a' } /> }
{ (!editable || !isEditing) && <Time value={ value } format={ format ? format : 'F j, Y, g:i a' } /> }
{ !!editable && isEditing && (
<Row padding="0 0 5px">
<Field.Input
type="date"
name={ name }
onChange={ handleChange }
value={ formatDate(_.get(modifiedData, name) || _.get(data, name, ''), 'Y-m-d') }
modified={ isModified }
className={ isModified ? 'modified' : ''}
value={ formatDate(value, 'Y-m-d') }
/>
</Row>
)}
Expand Down
Loading