projects
/
arvados-workbench2.git
/ commitdiff
summary
|
shortlog
|
log
|
commit
| commitdiff |
tree
raw
|
patch
|
inline
| side by side (parent:
ae041e1
)
15768: checkedlist in redux store Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa...
author
Lisa Knox <lisaknox83@gmail.com>
Fri, 12 May 2023 16:55:14 +0000
(12:55 -0400)
committer
Lisa Knox <lisaknox83@gmail.com>
Fri, 12 May 2023 16:55:14 +0000
(12:55 -0400)
src/components/data-explorer/data-explorer.tsx
patch
|
blob
|
history
src/components/data-table-multiselect-popover/data-table-multiselect-popover.tsx
patch
|
blob
|
history
src/components/data-table/data-table.tsx
patch
|
blob
|
history
src/components/multiselectToolbar/MultiselectToolbar.tsx
patch
|
blob
|
history
src/store/multiselect/multiselect-actions.tsx
patch
|
blob
|
history
src/store/multiselect/multiselect-reducer.tsx
patch
|
blob
|
history
src/views-components/data-explorer/data-explorer.tsx
patch
|
blob
|
history
diff --git
a/src/components/data-explorer/data-explorer.tsx
b/src/components/data-explorer/data-explorer.tsx
index 0446ee6f3565169eef18cce0d669a7b8dfde29b4..3ef2e3f99e4e02a96e9aa4e6a7889d0aa605ff2f 100644
(file)
--- a/
src/components/data-explorer/data-explorer.tsx
+++ b/
src/components/data-explorer/data-explorer.tsx
@@
-15,6
+15,7
@@
import { CloseIcon, IconType, MaximizeIcon, UnMaximizeIcon, MoreOptionsIcon } fr
import { PaperProps } from '@material-ui/core/Paper';
import { MPVPanelProps } from 'components/multi-panel-view/multi-panel-view';
import { MultiselectToolbar, defaultActions } from 'components/multiselectToolbar/MultiselectToolbar';
import { PaperProps } from '@material-ui/core/Paper';
import { MPVPanelProps } from 'components/multi-panel-view/multi-panel-view';
import { MultiselectToolbar, defaultActions } from 'components/multiselectToolbar/MultiselectToolbar';
+import { TCheckedList } from 'components/data-table/data-table';
type CssRules = 'searchBox' | 'headerMenu' | 'toolbar' | 'footer' | 'root' | 'moreOptionsButton' | 'title' | 'dataTable' | 'container';
type CssRules = 'searchBox' | 'headerMenu' | 'toolbar' | 'footer' | 'root' | 'moreOptionsButton' | 'title' | 'dataTable' | 'container';
@@
-98,6
+99,7
@@
interface DataExplorerActionProps<T> {
onLoadMore: (page: number) => void;
extractKey?: (item: T) => React.Key;
toggleMSToolbar: (isVisible: boolean) => void;
onLoadMore: (page: number) => void;
extractKey?: (item: T) => React.Key;
toggleMSToolbar: (isVisible: boolean) => void;
+ setCheckedListOnStore: (checkedList: TCheckedList) => void;
}
type DataExplorerProps<T> = DataExplorerDataProps<T> & DataExplorerActionProps<T> & WithStyles<CssRules> & MPVPanelProps;
}
type DataExplorerProps<T> = DataExplorerDataProps<T> & DataExplorerActionProps<T> & WithStyles<CssRules> & MPVPanelProps;
@@
-186,6
+188,7
@@
export const DataExplorer = withStyles(styles)(
elementPath,
isMSToolbarVisible,
toggleMSToolbar,
elementPath,
isMSToolbarVisible,
toggleMSToolbar,
+ setCheckedListOnStore,
} = this.props;
return (
<Paper className={classes.root} {...paperProps} key={paperKey} data-cy={this.props['data-cy']}>
} = this.props;
return (
<Paper className={classes.root} {...paperProps} key={paperKey} data-cy={this.props['data-cy']}>
@@
-248,6
+251,7
@@
export const DataExplorer = withStyles(styles)(
currentItemUuid={currentItemUuid}
currentRoute={paperKey}
toggleMSToolbar={toggleMSToolbar}
currentItemUuid={currentItemUuid}
currentRoute={paperKey}
toggleMSToolbar={toggleMSToolbar}
+ setCheckedListOnStore={setCheckedListOnStore}
/>
</Grid>
<Grid item xs>
/>
</Grid>
<Grid item xs>
diff --git
a/src/components/data-table-multiselect-popover/data-table-multiselect-popover.tsx
b/src/components/data-table-multiselect-popover/data-table-multiselect-popover.tsx
index 1b58f9e8b9f8d1aa24aa44ff998fe98f51faeb2e..875f18186146a32f81856f75f4f6bee1ce8f44ec 100644
(file)
--- a/
src/components/data-table-multiselect-popover/data-table-multiselect-popover.tsx
+++ b/
src/components/data-table-multiselect-popover/data-table-multiselect-popover.tsx
@@
-3,7
+3,7
@@
// SPDX-License-Identifier: AGPL-3.0
import React, { useEffect } from 'react';
// SPDX-License-Identifier: AGPL-3.0
import React, { useEffect } from 'react';
-import { WithStyles, withStyles, ButtonBase, StyleRulesCallback, Theme, Popover,
Button, Card, CardActions
, Tooltip, IconButton } from '@material-ui/core';
+import { WithStyles, withStyles, ButtonBase, StyleRulesCallback, Theme, Popover,
Card
, Tooltip, IconButton } from '@material-ui/core';
import classnames from 'classnames';
import { DefaultTransformOrigin } from 'components/popover/helpers';
import debounce from 'lodash/debounce';
import classnames from 'classnames';
import { DefaultTransformOrigin } from 'components/popover/helpers';
import debounce from 'lodash/debounce';
diff --git
a/src/components/data-table/data-table.tsx
b/src/components/data-table/data-table.tsx
index e89fe4dd016fab09ed8bc529e39b427b8f791c2d..628405cee73eff7ecf6a8c01f50c171e461a0223 100644
(file)
--- a/
src/components/data-table/data-table.tsx
+++ b/
src/components/data-table/data-table.tsx
@@
-53,6
+53,7
@@
export interface DataTableDataProps<I> {
currentItemUuid?: string;
currentRoute?: string;
toggleMSToolbar: (isVisible: boolean) => void;
currentItemUuid?: string;
currentRoute?: string;
toggleMSToolbar: (isVisible: boolean) => void;
+ setCheckedListOnStore: (checkedList: TCheckedList) => void;
}
type CssRules =
}
type CssRules =
@@
-145,7
+146,7
@@
export const DataTable = withStyles(styles)(
}
componentDidUpdate(prevProps: Readonly<DataTableProps<T>>, prevState: DataTableState) {
}
componentDidUpdate(prevProps: Readonly<DataTableProps<T>>, prevState: DataTableState) {
- const { items, toggleMSToolbar } = this.props;
+ const { items, toggleMSToolbar
, setCheckedListOnStore
} = this.props;
const { isSelected, checkedList } = this.state;
if (!arraysAreCongruent(prevProps.items, items)) {
if (isSelected === true) this.setState({ isSelected: false });
const { isSelected, checkedList } = this.state;
if (!arraysAreCongruent(prevProps.items, items)) {
if (isSelected === true) this.setState({ isSelected: false });
@@
-153,6
+154,7
@@
export const DataTable = withStyles(styles)(
}
if (prevState.checkedList !== checkedList) {
toggleMSToolbar(this.isAnySelected() ? true : false);
}
if (prevState.checkedList !== checkedList) {
toggleMSToolbar(this.isAnySelected() ? true : false);
+ setCheckedListOnStore(checkedList);
}
}
}
}
diff --git
a/src/components/multiselectToolbar/MultiselectToolbar.tsx
b/src/components/multiselectToolbar/MultiselectToolbar.tsx
index 6620792e11787de49bff66cc91ce614d3c40c675..b39fd65765275ba56f1d95b16202a9dc473af78f 100644
(file)
--- a/
src/components/multiselectToolbar/MultiselectToolbar.tsx
+++ b/
src/components/multiselectToolbar/MultiselectToolbar.tsx
@@
-36,13
+36,11
@@
export const defaultActions: Array<MultiselectToolbarAction> = [
},
];
},
];
-const MSToolbarCopyButton = (classes, i) => {
- return (
- <Button key={i} className={classes.button}>
- <CopyToClipboardSnackbar value='foo' children={<div>Copy</div>} />
- </Button>
- );
-};
+const MSToolbarCopyButton = (classes, i) => (
+ <Button key={i} className={classes.button}>
+ <CopyToClipboardSnackbar value='foo' children={<div>Copy</div>} />
+ </Button>
+);
type MultiselectToolbarProps = MultiselectToolbarActions & WithStyles<CssRules>;
type MultiselectToolbarProps = MultiselectToolbarActions & WithStyles<CssRules>;
@@
-54,6
+52,7
@@
export const MultiselectToolbar = connect(mapStateToProps)(
);
function mapStateToProps(state: RootState) {
);
function mapStateToProps(state: RootState) {
+ // console.log(state);
return {
// state: state,
};
return {
// state: state,
};
diff --git
a/src/store/multiselect/multiselect-actions.tsx
b/src/store/multiselect/multiselect-actions.tsx
index 307423b5c69c99edecec388a9697509bf56f8484..ba8edf42789fd4ea3cc14d53ae6920614364854f 100644
(file)
--- a/
src/store/multiselect/multiselect-actions.tsx
+++ b/
src/store/multiselect/multiselect-actions.tsx
@@
-4,6
+4,7
@@
export const multiselectActions = {
TOGGLE_VISIBLITY: 'TOGGLE_VISIBLITY',
export const multiselectActions = {
TOGGLE_VISIBLITY: 'TOGGLE_VISIBLITY',
+ SET_CHECKEDLIST: 'SET_CHECKEDLIST',
};
export const toggleMSToolbar = (isVisible: boolean) => {
};
export const toggleMSToolbar = (isVisible: boolean) => {
@@
-11,3
+12,9
@@
export const toggleMSToolbar = (isVisible: boolean) => {
dispatch({ type: multiselectActions.TOGGLE_VISIBLITY, payload: isVisible });
};
};
dispatch({ type: multiselectActions.TOGGLE_VISIBLITY, payload: isVisible });
};
};
+
+export const setCheckedListOnStore = (checkedList) => {
+ return (dispatch) => {
+ dispatch({ type: multiselectActions.SET_CHECKEDLIST, payload: checkedList });
+ };
+};
diff --git
a/src/store/multiselect/multiselect-reducer.tsx
b/src/store/multiselect/multiselect-reducer.tsx
index 212f416b88568f6b846331e0e930065bb868fb25..6840df920aef33b2d0ad21505c30a490b482526c 100644
(file)
--- a/
src/store/multiselect/multiselect-reducer.tsx
+++ b/
src/store/multiselect/multiselect-reducer.tsx
@@
-3,16
+3,20
@@
// SPDX-License-Identifier: AGPL-3.0
import { multiselectActions } from './multiselect-actions';
// SPDX-License-Identifier: AGPL-3.0
import { multiselectActions } from './multiselect-actions';
+import { TCheckedList } from 'components/data-table/data-table';
type MultiselectToolbarState = {
isVisible: boolean;
type MultiselectToolbarState = {
isVisible: boolean;
+ checkedList: TCheckedList;
};
const multiselectToolbarInitialState = {
isVisible: false,
};
const multiselectToolbarInitialState = {
isVisible: false,
+ checkedList: {},
};
export const multiselectReducer = (state: MultiselectToolbarState = multiselectToolbarInitialState, action) => {
if (action.type === multiselectActions.TOGGLE_VISIBLITY) return { ...state, isVisible: action.payload };
};
export const multiselectReducer = (state: MultiselectToolbarState = multiselectToolbarInitialState, action) => {
if (action.type === multiselectActions.TOGGLE_VISIBLITY) return { ...state, isVisible: action.payload };
+ if (action.type === multiselectActions.SET_CHECKEDLIST) return { ...state, checkedList: action.payload };
return state;
};
return state;
};
diff --git
a/src/views-components/data-explorer/data-explorer.tsx
b/src/views-components/data-explorer/data-explorer.tsx
index be19319b84bb9876fa9c12eeaf63b1fa422b0a1b..871389d4160ece2392846afe68ef74b2e295844f 100644
(file)
--- a/
src/views-components/data-explorer/data-explorer.tsx
+++ b/
src/views-components/data-explorer/data-explorer.tsx
@@
-9,10
+9,10
@@
import { getDataExplorer } from 'store/data-explorer/data-explorer-reducer';
import { Dispatch } from 'redux';
import { dataExplorerActions } from 'store/data-explorer/data-explorer-action';
import { DataColumn } from 'components/data-table/data-column';
import { Dispatch } from 'redux';
import { dataExplorerActions } from 'store/data-explorer/data-explorer-action';
import { DataColumn } from 'components/data-table/data-column';
-import { DataColumns } from 'components/data-table/data-table';
+import { DataColumns
, TCheckedList
} from 'components/data-table/data-table';
import { DataTableFilters } from 'components/data-table-filters/data-table-filters-tree';
import { LAST_REFRESH_TIMESTAMP } from 'components/refresh-button/refresh-button';
import { DataTableFilters } from 'components/data-table-filters/data-table-filters-tree';
import { LAST_REFRESH_TIMESTAMP } from 'components/refresh-button/refresh-button';
-import { toggleMSToolbar } from 'store/multiselect/multiselect-actions';
+import { toggleMSToolbar
, setCheckedListOnStore
} from 'store/multiselect/multiselect-actions';
interface Props {
id: string;
interface Props {
id: string;
@@
-78,6
+78,10
@@
const mapDispatchToProps = (dispatchFn) => {
dispatchFn(toggleMSToolbar(isVisible));
},
dispatchFn(toggleMSToolbar(isVisible));
},
+ setCheckedListOnStore: (checkedList: TCheckedList) => {
+ dispatchFn(setCheckedListOnStore(checkedList));
+ },
+
onRowClick,
onRowDoubleClick,
onRowClick,
onRowDoubleClick,