Merge branch 'master' of git.curoverse.com:arvados-workbench2 into 14433_properties_i...
[arvados-workbench2.git] / src / views-components / details-panel / details-panel.tsx
index f0075558dfe20549a808a5ebf47840139381dece..fe434b6c731aef10539945b662cb36bec2c8b9dd 100644 (file)
@@ -10,7 +10,6 @@ import { ArvadosTheme } from '~/common/custom-theme';
 import * as classnames from "classnames";
 import { connect } from 'react-redux';
 import { RootState } from '~/store/store';
-import { detailsPanelActions } from "~/store/details-panel/details-panel-action";
 import { CloseIcon } from '~/components/icon/icon';
 import { EmptyResource } from '~/models/empty';
 import { Dispatch } from "redux";
@@ -22,11 +21,13 @@ import { EmptyDetails } from "./empty-details";
 import { DetailsData } from "./details-data";
 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, SLIDE_TIMEOUT } from '~/store/details-panel/details-panel-action';
 
 type CssRules = 'root' | 'container' | 'opened' | 'headerContainer' | 'headerIcon' | 'tabContainer';
 
 const DRAWER_WIDTH = 320;
-const SLIDE_TIMEOUT = 500;
 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     root: {
         background: theme.palette.background.paper,
@@ -57,13 +58,13 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     },
 });
 
-const getItem = (resource: DetailsResource): DetailsData => {
+const getItem = (resource: DetailsResource, resourceData?: ResourceData): DetailsData => {
     const res = resource || { kind: undefined, name: 'Projects' };
     switch (res.kind) {
         case ResourceKind.PROJECT:
             return new ProjectDetails(res);
         case ResourceKind.COLLECTION:
-            return new CollectionDetails(res);
+            return new CollectionDetails(res, resourceData);
         case ResourceKind.PROCESS:
             return new ProcessDetails(res);
         default:
@@ -71,17 +72,18 @@ const getItem = (resource: DetailsResource): DetailsData => {
     }
 };
 
-const mapStateToProps = ({ detailsPanel, resources }: RootState) => {
+const mapStateToProps = ({ detailsPanel, resources, resourcesData }: RootState) => {
     const resource = getResource(detailsPanel.resourceUuid)(resources) as DetailsResource;
+    const resourceData = getResourceData(detailsPanel.resourceUuid)(resourcesData);
     return {
         isOpened: detailsPanel.isOpened,
-        item: getItem(resource)
+        item: getItem(resource, resourceData)
     };
 };
 
 const mapDispatchToProps = (dispatch: Dispatch) => ({
     onCloseDrawer: () => {
-        dispatch(detailsPanelActions.TOGGLE_DETAILS_PANEL());
+        dispatch<any>(toggleDetailsPanel());
     }
 });