[arvados] updated: 2.7.0-5863-g0b569ee693
git repository hosting
git at public.arvados.org
Thu Feb 8 18:33:56 UTC 2024
Summary of changes:
.../src/components/data-explorer/data-explorer.tsx | 2 ++
.../src/components/data-table/data-table.tsx | 5 ++++
.../store/details-panel/details-panel-action.ts | 12 +++++----
.../src/store/multiselect/multiselect-reducer.tsx | 2 +-
.../data-explorer/data-explorer.tsx | 31 +++++++++++++++++++---
.../details-panel/details-panel.tsx | 29 +++++++++++++++++---
6 files changed, 68 insertions(+), 13 deletions(-)
via 0b569ee693ece680309ac9c114e975c9cb3e7f64 (commit)
from 5a858213eb471c685204b7a65b4e23ca1eb98d72 (commit)
Those revisions listed above that are new to this repository have
not appeared on any other notification email; so we list those
revisions in full, below.
commit 0b569ee693ece680309ac9c114e975c9cb3e7f64
Author: Lisa Knox <lisaknox83 at gmail.com>
Date: Thu Feb 8 13:33:49 2024 -0500
21224: details panel now displays correct item Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox at curii.com>
diff --git a/services/workbench2/src/components/data-explorer/data-explorer.tsx b/services/workbench2/src/components/data-explorer/data-explorer.tsx
index 22c53460e5..c1b2fbe587 100644
--- a/services/workbench2/src/components/data-explorer/data-explorer.tsx
+++ b/services/workbench2/src/components/data-explorer/data-explorer.tsx
@@ -116,6 +116,7 @@ interface DataExplorerActionProps<T> {
extractKey?: (item: T) => React.Key;
toggleMSToolbar: (isVisible: boolean) => void;
setCheckedListOnStore: (checkedList: TCheckedList) => void;
+ setSelectedUuid: (checkedList: TCheckedList) => void;
}
type DataExplorerProps<T> = DataExplorerDataProps<T> & DataExplorerActionProps<T> & WithStyles<CssRules> & MPVPanelProps;
@@ -324,6 +325,7 @@ export const DataExplorer = withStyles(styles)(
toggleMSToolbar={toggleMSToolbar}
setCheckedListOnStore={setCheckedListOnStore}
checkedList={checkedList}
+ setSelectedUuid={this.props.setSelectedUuid}
/>
</Grid>
<Grid
diff --git a/services/workbench2/src/components/data-table/data-table.tsx b/services/workbench2/src/components/data-table/data-table.tsx
index 9c1641dc87..2edd736b78 100644
--- a/services/workbench2/src/components/data-table/data-table.tsx
+++ b/services/workbench2/src/components/data-table/data-table.tsx
@@ -29,6 +29,7 @@ import { SvgIconProps } from "@material-ui/core/SvgIcon";
import ArrowDownwardIcon from "@material-ui/icons/ArrowDownward";
import { createTree } from "models/tree";
import { DataTableMultiselectOption } from "../data-table-multiselect-popover/data-table-multiselect-popover";
+import { isExactlyOneSelected } from "store/multiselect/multiselect-actions";
export type DataColumns<I, R> = Array<DataColumn<I, R>>;
@@ -54,6 +55,7 @@ export interface DataTableDataProps<I> {
toggleMSToolbar: (isVisible: boolean) => void;
setCheckedListOnStore: (checkedList: TCheckedList) => void;
checkedList: TCheckedList;
+ setSelectedUuid: (checkedList: TCheckedList) => void;
}
type CssRules =
@@ -171,6 +173,9 @@ export const DataTable = withStyles(styles)(
if (prevProps.currentRoute !== this.props.currentRoute) {
this.initializeCheckedList([])
}
+ if (isExactlyOneSelected(prevProps.checkedList) !== isExactlyOneSelected(this.props.checkedList)) {
+ this.props.setSelectedUuid(this.props.checkedList)
+ }
}
componentWillUnmount(): void {
diff --git a/services/workbench2/src/store/details-panel/details-panel-action.ts b/services/workbench2/src/store/details-panel/details-panel-action.ts
index 1367d44613..28347e828e 100644
--- a/services/workbench2/src/store/details-panel/details-panel-action.ts
+++ b/services/workbench2/src/store/details-panel/details-panel-action.ts
@@ -13,6 +13,7 @@ import { FilterBuilder } from 'services/api/filter-builder';
import { OrderBuilder } from 'services/api/order-builder';
import { CollectionResource } from 'models/collection';
import { extractUuidKind, ResourceKind } from 'models/resource';
+import { CLOSE_DRAWER } from 'views-components/details-panel/details-panel';
export const SLIDE_TIMEOUT = 500;
@@ -67,19 +68,20 @@ export const refreshCollectionVersionsList = (uuid: string) =>
};
export const toggleDetailsPanel = (uuid: string = '') => (dispatch: Dispatch, getState: () => RootState) => {
- const { detailsPanel, router }= getState()
- // because of material-ui issue resizing details panel breaks tabs.
- // triggering window resize event fixes that.
- if(uuid !== detailsPanel.resourceUuid && detailsPanel.isOpened){
+ const { detailsPanel }= getState()
+ const isTargetUuidNew = uuid !== detailsPanel.resourceUuid
+ if(isTargetUuidNew && uuid !== CLOSE_DRAWER && detailsPanel.isOpened){
dispatch<any>(loadDetailsPanel(uuid));
} else {
+ // because of material-ui issue resizing details panel breaks tabs.
+ // triggering window resize event fixes that.
setTimeout(() => {
window.dispatchEvent(new Event('resize'));
}, SLIDE_TIMEOUT);
startDetailsPanelTransition(dispatch)
dispatch(detailsPanelActions.TOGGLE_DETAILS_PANEL());
if (getState().detailsPanel.isOpened) {
- dispatch<any>(loadDetailsPanel(getState().detailsPanel.resourceUuid));
+ dispatch<any>(loadDetailsPanel(isTargetUuidNew ? uuid : detailsPanel.resourceUuid));
}
}
};
diff --git a/services/workbench2/src/store/multiselect/multiselect-reducer.tsx b/services/workbench2/src/store/multiselect/multiselect-reducer.tsx
index 9bcb46d018..750d859d10 100644
--- a/services/workbench2/src/store/multiselect/multiselect-reducer.tsx
+++ b/services/workbench2/src/store/multiselect/multiselect-reducer.tsx
@@ -5,7 +5,7 @@
import { multiselectActionConstants } from "./multiselect-actions";
import { TCheckedList } from "components/data-table/data-table";
-type MultiselectToolbarState = {
+export type MultiselectToolbarState = {
isVisible: boolean;
checkedList: TCheckedList;
selectedUuid: string;
diff --git a/services/workbench2/src/views-components/data-explorer/data-explorer.tsx b/services/workbench2/src/views-components/data-explorer/data-explorer.tsx
index 9b11f2ad3a..3de1948179 100644
--- a/services/workbench2/src/views-components/data-explorer/data-explorer.tsx
+++ b/services/workbench2/src/views-components/data-explorer/data-explorer.tsx
@@ -12,7 +12,8 @@ import { DataColumn } from "components/data-table/data-column";
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 { toggleMSToolbar, setCheckedListOnStore } from "store/multiselect/multiselect-actions";
+import { toggleMSToolbar, setCheckedListOnStore, setSelectedUuid, isExactlyOneSelected } from "store/multiselect/multiselect-actions";
+import { DetailsPanelState } from "store/details-panel/details-panel-reducer";
interface Props {
id: string;
@@ -22,6 +23,26 @@ interface Props {
extractKey?: (item: any) => React.Key;
}
+const getCurrentItemUuid = (
+ currentRoute: string,
+ workflowPanelDetailsUuid: string,
+ isDetailsResourceChecked: boolean,
+ isOnlyOneSelected: boolean,
+ detailsPanel: DetailsPanelState,
+ multiselectSelectedUuid: string
+) => {
+ if(currentRoute === '/workflows') {
+ return workflowPanelDetailsUuid;
+ }
+ if(isDetailsResourceChecked && isOnlyOneSelected) {
+ return detailsPanel.resourceUuid;
+ }
+ if(!detailsPanel.isOpened){
+ return multiselectSelectedUuid;
+ }
+ return detailsPanel.resourceUuid;
+};
+
const mapStateToProps = ({ progressIndicator, dataExplorer, router, multiselect, detailsPanel, properties}: RootState, { id }: Props) => {
const progress = progressIndicator.find(p => p.id === id);
const dataExplorerState = getDataExplorer(dataExplorer, id);
@@ -29,8 +50,7 @@ const mapStateToProps = ({ progressIndicator, dataExplorer, router, multiselect,
const currentRefresh = localStorage.getItem(LAST_REFRESH_TIMESTAMP) || "";
const isDetailsResourceChecked = multiselect.checkedList[detailsPanel.resourceUuid]
const isOnlyOneSelected = Object.values(multiselect.checkedList).filter(x => x === true).length === 1;
- const currentItemUuid =
- currentRoute === '/workflows' ? properties.workflowPanelDetailsUuid : isDetailsResourceChecked && isOnlyOneSelected ? detailsPanel.resourceUuid : multiselect.selectedUuid;
+ const currentItemUuid = getCurrentItemUuid(currentRoute, properties.workflowPanelDetailsUuid, isDetailsResourceChecked, isOnlyOneSelected, detailsPanel, multiselect.selectedUuid);
const isMSToolbarVisible = multiselect.isVisible;
return {
...dataExplorerState,
@@ -86,6 +106,11 @@ const mapDispatchToProps = () => {
dispatch<any>(setCheckedListOnStore(checkedList));
},
+ setSelectedUuid: (checkedList: TCheckedList) => {
+ dispatch<any>(setSelectedUuid(isExactlyOneSelected(checkedList)))
+ },
+
+
onRowClick,
onRowDoubleClick,
diff --git a/services/workbench2/src/views-components/details-panel/details-panel.tsx b/services/workbench2/src/views-components/details-panel/details-panel.tsx
index f4e0766d87..c48f784638 100644
--- a/services/workbench2/src/views-components/details-panel/details-panel.tsx
+++ b/services/workbench2/src/views-components/details-panel/details-panel.tsx
@@ -28,6 +28,8 @@ import { toggleDetailsPanel, SLIDE_TIMEOUT, openDetailsPanel } from 'store/detai
import { FileDetails } from 'views-components/details-panel/file-details';
import { getNode } from 'models/tree';
import { resourceIsFrozen } from 'common/frozen-resources';
+import { DetailsPanelState } from 'store/details-panel/details-panel-reducer';
+import { MultiselectToolbarState } from 'store/multiselect/multiselect-reducer';
type CssRules = 'root' | 'container' | 'opened' | 'headerContainer' | 'headerIcon' | 'tabContainer';
@@ -83,10 +85,27 @@ const getItem = (res: DetailsResource): DetailsData => {
}
};
+const getCurrentItemUuid = (
+ isDetailsResourceChecked: boolean,
+ currentRoute: string,
+ detailsPanel: DetailsPanelState,
+ multiselect: MultiselectToolbarState,
+ currentRouteSplit: string[]
+) => {
+ if (isDetailsResourceChecked || currentRoute.includes('collections') || detailsPanel.isOpened) {
+ return detailsPanel.resourceUuid;
+ }
+ if (!!multiselect.selectedUuid) {
+ return multiselect.selectedUuid;
+ }
+ return currentRouteSplit[currentRouteSplit.length - 1];
+};
+
const mapStateToProps = ({ auth, detailsPanel, resources, collectionPanelFiles, multiselect, router }: RootState) => {
- const isDetailsResourceChecked = multiselect.checkedList[detailsPanel.resourceUuid]
+ const isDetailsResourceChecked = multiselect.checkedList[detailsPanel.resourceUuid] === true;
const currentRoute = router.location ? router.location.pathname : "";
- const currentItemUuid = isDetailsResourceChecked || currentRoute.includes('collections') ? detailsPanel.resourceUuid : multiselect.selectedUuid ? multiselect.selectedUuid : currentRoute.split('/')[2];
+ const currentRouteSplit = currentRoute.split('/');
+ const currentItemUuid = getCurrentItemUuid(isDetailsResourceChecked, currentRoute, detailsPanel, multiselect, currentRouteSplit);
const resource = getResource(currentItemUuid)(resources) as DetailsResource | undefined;
const file = resource
? undefined
@@ -107,6 +126,8 @@ const mapStateToProps = ({ auth, detailsPanel, resources, collectionPanelFiles,
};
};
+export const CLOSE_DRAWER = 'CLOSE_DRAWER'
+
const mapDispatchToProps = (dispatch: Dispatch) => ({
onCloseDrawer: (currentItemId) => {
dispatch<any>(toggleDetailsPanel(currentItemId));
@@ -164,7 +185,7 @@ export const DetailsPanel = withStyles(styles)(
}
renderContent() {
- const { classes, onCloseDrawer, res, tabNr, authConfig, currentItemUuid } = this.props;
+ const { classes, onCloseDrawer, res, tabNr, authConfig } = this.props;
let shouldShowInlinePreview = false;
if (!('kind' in res)) {
@@ -201,7 +222,7 @@ export const DetailsPanel = withStyles(styles)(
</Tooltip>
</Grid>
<Grid item>
- <IconButton color="inherit" onClick={()=>onCloseDrawer(currentItemUuid)}>
+ <IconButton color="inherit" onClick={()=>onCloseDrawer(CLOSE_DRAWER)}>
<CloseIcon />
</IconButton>
</Grid>
-----------------------------------------------------------------------
hooks/post-receive
--
More information about the arvados-commits
mailing list