[ARVADOS-WORKBENCH2] created: 1.2.0-858-gce19ce1
Git user
git at public.curoverse.com
Wed Nov 14 06:13:16 EST 2018
at ce19ce10f479c168f72003495696fdd0f01ecc52 (commit)
commit ce19ce10f479c168f72003495696fdd0f01ecc52
Author: Pawel Kromplewski <pawel.kromplewski at contractors.roche.com>
Date: Wed Nov 14 12:12:58 2018 +0100
Force window resize after open/close details panel because of material-ui issue
Feature #14420
Arvados-DCO-1.1-Signed-off-by: Pawel Kromplewski <pawel.kromplewski at contractors.roche.com>
diff --git a/src/store/details-panel/details-panel-action.ts b/src/store/details-panel/details-panel-action.ts
index 2724a3e..ed71716 100644
--- a/src/store/details-panel/details-panel-action.ts
+++ b/src/store/details-panel/details-panel-action.ts
@@ -3,6 +3,7 @@
// SPDX-License-Identifier: AGPL-3.0
import { unionize, ofType, UnionOf } from '~/common/unionize';
+import { Dispatch } from 'redux';
export const detailsPanelActions = unionize({
TOGGLE_DETAILS_PANEL: ofType<{}>(),
@@ -13,6 +14,12 @@ export type DetailsPanelAction = UnionOf<typeof detailsPanelActions>;
export const loadDetailsPanel = (uuid: string) => detailsPanelActions.LOAD_DETAILS_PANEL(uuid);
-
-
-
+export const toggleDetailsPanel = () => (dispatch: Dispatch) => {
+ // because of material-ui issue resizing details panel breaks tabs.
+ // triggering window resize event fixes that.
+ const detailsPanelAnimationDuration = 500;
+ setTimeout(() => {
+ window.dispatchEvent(new Event('resize'));
+ }, detailsPanelAnimationDuration);
+ dispatch(detailsPanelActions.TOGGLE_DETAILS_PANEL());
+};
diff --git a/src/views-components/context-menu/action-sets/collection-action-set.ts b/src/views-components/context-menu/action-sets/collection-action-set.ts
index a33f78d..9d26fad 100644
--- a/src/views-components/context-menu/action-sets/collection-action-set.ts
+++ b/src/views-components/context-menu/action-sets/collection-action-set.ts
@@ -15,6 +15,7 @@ import { toggleCollectionTrashed } from "~/store/trash/trash-actions";
import { detailsPanelActions } from '~/store/details-panel/details-panel-action';
import { openSharingDialog } from '~/store/sharing-dialog/sharing-dialog-actions';
import { openAdvancedTabDialog } from "~/store/advanced-tab/advanced-tab";
+import { toggleDetailsPanel } from '~/store/details-panel/details-panel-action';
export const collectionActionSet: ContextMenuActionSet = [[
{
@@ -62,7 +63,7 @@ export const collectionActionSet: ContextMenuActionSet = [[
icon: DetailsIcon,
name: "View details",
execute: dispatch => {
- dispatch(detailsPanelActions.TOGGLE_DETAILS_PANEL());
+ dispatch<any>(toggleDetailsPanel());
}
},
// {
diff --git a/src/views-components/context-menu/action-sets/collection-resource-action-set.ts b/src/views-components/context-menu/action-sets/collection-resource-action-set.ts
index c398a0a..7730b14 100644
--- a/src/views-components/context-menu/action-sets/collection-resource-action-set.ts
+++ b/src/views-components/context-menu/action-sets/collection-resource-action-set.ts
@@ -15,6 +15,7 @@ import { toggleCollectionTrashed } from "~/store/trash/trash-actions";
import { detailsPanelActions } from '~/store/details-panel/details-panel-action';
import { openSharingDialog } from "~/store/sharing-dialog/sharing-dialog-actions";
import { openAdvancedTabDialog } from '~/store/advanced-tab/advanced-tab';
+import { toggleDetailsPanel } from '~/store/details-panel/details-panel-action';
export const collectionResourceActionSet: ContextMenuActionSet = [[
{
@@ -63,7 +64,7 @@ export const collectionResourceActionSet: ContextMenuActionSet = [[
icon: DetailsIcon,
name: "View details",
execute: dispatch => {
- dispatch(detailsPanelActions.TOGGLE_DETAILS_PANEL());
+ dispatch<any>(toggleDetailsPanel());
}
},
{
diff --git a/src/views-components/context-menu/action-sets/process-action-set.ts b/src/views-components/context-menu/action-sets/process-action-set.ts
index 5db50dd..2d15254 100644
--- a/src/views-components/context-menu/action-sets/process-action-set.ts
+++ b/src/views-components/context-menu/action-sets/process-action-set.ts
@@ -19,6 +19,7 @@ import { detailsPanelActions } from '~/store/details-panel/details-panel-action'
import { openSharingDialog } from "~/store/sharing-dialog/sharing-dialog-actions";
import { openAdvancedTabDialog } from "~/store/advanced-tab/advanced-tab";
import { openProcessInputDialog } from "~/store/processes/process-input-actions";
+import { toggleDetailsPanel } from '~/store/details-panel/details-panel-action';
export const processActionSet: ContextMenuActionSet = [[
{
@@ -96,7 +97,7 @@ export const processActionSet: ContextMenuActionSet = [[
icon: DetailsIcon,
name: "View details",
execute: dispatch => {
- dispatch(detailsPanelActions.TOGGLE_DETAILS_PANEL());
+ dispatch<any>(toggleDetailsPanel());
}
},
// {
diff --git a/src/views-components/context-menu/action-sets/process-resource-action-set.ts b/src/views-components/context-menu/action-sets/process-resource-action-set.ts
index 4a0a83b..21f3041 100644
--- a/src/views-components/context-menu/action-sets/process-resource-action-set.ts
+++ b/src/views-components/context-menu/action-sets/process-resource-action-set.ts
@@ -12,6 +12,7 @@ import { openProcessUpdateDialog } from "~/store/processes/process-update-action
import { openCopyProcessDialog } from '~/store/processes/process-copy-actions';
import { detailsPanelActions } from '~/store/details-panel/details-panel-action';
import { openSharingDialog } from "~/store/sharing-dialog/sharing-dialog-actions";
+import { toggleDetailsPanel } from '~/store/details-panel/details-panel-action';
export const processResourceActionSet: ContextMenuActionSet = [[
{
@@ -54,7 +55,7 @@ export const processResourceActionSet: ContextMenuActionSet = [[
icon: DetailsIcon,
name: "View details",
execute: dispatch => {
- dispatch(detailsPanelActions.TOGGLE_DETAILS_PANEL());
+ dispatch<any>(toggleDetailsPanel());
}
}
// {
diff --git a/src/views-components/context-menu/action-sets/project-action-set.ts b/src/views-components/context-menu/action-sets/project-action-set.ts
index aa82c7f..9b8ced5 100644
--- a/src/views-components/context-menu/action-sets/project-action-set.ts
+++ b/src/views-components/context-menu/action-sets/project-action-set.ts
@@ -16,6 +16,7 @@ import { detailsPanelActions } from '~/store/details-panel/details-panel-action'
import { ShareIcon } from '~/components/icon/icon';
import { openSharingDialog } from "~/store/sharing-dialog/sharing-dialog-actions";
import { openAdvancedTabDialog } from "~/store/advanced-tab/advanced-tab";
+import { toggleDetailsPanel } from '~/store/details-panel/details-panel-action';
export const projectActionSet: ContextMenuActionSet = [[
{
@@ -71,7 +72,7 @@ export const projectActionSet: ContextMenuActionSet = [[
icon: DetailsIcon,
name: "View details",
execute: dispatch => {
- dispatch(detailsPanelActions.TOGGLE_DETAILS_PANEL());
+ dispatch<any>(toggleDetailsPanel());
}
},
{
diff --git a/src/views-components/context-menu/action-sets/trashed-collection-action-set.ts b/src/views-components/context-menu/action-sets/trashed-collection-action-set.ts
index 1f91d7e..cefef34 100644
--- a/src/views-components/context-menu/action-sets/trashed-collection-action-set.ts
+++ b/src/views-components/context-menu/action-sets/trashed-collection-action-set.ts
@@ -7,13 +7,14 @@ import { DetailsIcon, ProvenanceGraphIcon, AdvancedIcon, RestoreFromTrashIcon }
import { toggleCollectionTrashed } from "~/store/trash/trash-actions";
import { detailsPanelActions } from "~/store/details-panel/details-panel-action";
import { openAdvancedTabDialog } from "~/store/advanced-tab/advanced-tab";
+import { toggleDetailsPanel } from '~/store/details-panel/details-panel-action';
export const trashedCollectionActionSet: ContextMenuActionSet = [[
{
icon: DetailsIcon,
name: "View details",
execute: dispatch => {
- dispatch(detailsPanelActions.TOGGLE_DETAILS_PANEL());
+ dispatch<any>(toggleDetailsPanel());
}
},
{
diff --git a/src/views-components/details-panel/details-panel.tsx b/src/views-components/details-panel/details-panel.tsx
index 5e5ccef..113cf09 100644
--- a/src/views-components/details-panel/details-panel.tsx
+++ b/src/views-components/details-panel/details-panel.tsx
@@ -24,6 +24,7 @@ import { DetailsResource } from "~/models/details";
import { getResource } from '~/store/resources/resources';
import { ResourceData } from "~/store/resources-data/resources-data-reducer";
import { getResourceData } from "~/store/resources-data/resources-data";
+import { toggleDetailsPanel } from '~/store/details-panel/details-panel-action';
type CssRules = 'root' | 'container' | 'opened' | 'headerContainer' | 'headerIcon' | 'tabContainer';
@@ -84,7 +85,7 @@ const mapStateToProps = ({ detailsPanel, resources, resourcesData }: RootState)
const mapDispatchToProps = (dispatch: Dispatch) => ({
onCloseDrawer: () => {
- dispatch(detailsPanelActions.TOGGLE_DETAILS_PANEL());
+ dispatch<any>(toggleDetailsPanel());
}
});
diff --git a/src/views-components/main-content-bar/main-content-bar.tsx b/src/views-components/main-content-bar/main-content-bar.tsx
index 6fb419e..b047837 100644
--- a/src/views-components/main-content-bar/main-content-bar.tsx
+++ b/src/views-components/main-content-bar/main-content-bar.tsx
@@ -10,6 +10,7 @@ import { detailsPanelActions } from "~/store/details-panel/details-panel-action"
import { connect } from 'react-redux';
import { RootState } from '~/store/store';
import { matchWorkflowRoute } from '~/routes/routes';
+import { toggleDetailsPanel } from '~/store/details-panel/details-panel-action';
interface MainContentBarProps {
onDetailsPanelToggle: () => void;
@@ -25,7 +26,7 @@ const isWorkflowPath = ({ router }: RootState) => {
export const MainContentBar = connect((state: RootState) => ({
buttonVisible: !isWorkflowPath(state)
}), {
- onDetailsPanelToggle: detailsPanelActions.TOGGLE_DETAILS_PANEL
+ onDetailsPanelToggle: toggleDetailsPanel
})((props: MainContentBarProps) =>
<Toolbar>
<Grid container>
-----------------------------------------------------------------------
hooks/post-receive
--
More information about the arvados-commits
mailing list