Create shared-with-me panel skeleton
[arvados-workbench2.git] / src / views / shared-with-me-panel / shared-with-me-panel.tsx
1 // Copyright (C) The Arvados Authors. All rights reserved.
2 //
3 // SPDX-License-Identifier: AGPL-3.0
4
5 import * as React from 'react';
6 import { StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core';
7 import { DataExplorer } from "~/views-components/data-explorer/data-explorer";
8 import { connect, DispatchProp } from 'react-redux';
9 import { RootState } from '~/store/store';
10 import { ArvadosTheme } from '~/common/custom-theme';
11 import { ShareMeIcon } from '~/components/icon/icon';
12 import { ResourcesState } from "~/store/resources/resources";
13 import { navigateTo } from "~/store/navigation/navigation-action";
14 import { loadDetailsPanel } from "~/store/details-panel/details-panel-action";
15 import { PanelDefaultView } from '~/components/panel-default-view/panel-default-view';
16 import { DataTableDefaultView } from '~/components/data-table-default-view/data-table-default-view';
17 import { SHARED_WITH_ME_PANEL_ID } from '~/store/shared-with-me-panel/shared-with-me-panel-actions';
18
19 type CssRules = "toolbar" | "button";
20
21 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
22     toolbar: {
23         paddingBottom: theme.spacing.unit * 3,
24         textAlign: "right"
25     },
26     button: {
27         marginLeft: theme.spacing.unit
28     },
29 });
30
31 interface SharedWithMePanelDataProps {
32     resources: ResourcesState;
33 }
34
35 type SharedWithMePanelProps = SharedWithMePanelDataProps & DispatchProp & WithStyles<CssRules>;
36
37 export const SharedWithMePanel = withStyles(styles)(
38     connect((state: RootState) => ({
39         resources: state.resources
40     }))(
41         class extends React.Component<SharedWithMePanelProps> {
42             render() {
43                 return this.hasAnyTrashedResources()
44                     ? <DataExplorer
45                         id={SHARED_WITH_ME_PANEL_ID}
46                         onRowClick={this.handleRowClick}
47                         onRowDoubleClick={this.handleRowDoubleClick}
48                         onContextMenu={this.handleContextMenu}
49                         contextMenuColumn={false}
50                         dataTableDefaultView={<DataTableDefaultView icon={ShareMeIcon} />} />
51                     : <PanelDefaultView
52                         icon={ShareMeIcon}
53                         messages={['No shared items.']} />;
54             }
55
56             hasAnyTrashedResources = () => {
57                 // TODO: implement check if there is anything in the trash,
58                 //       without taking pagination into the account
59                 return false;
60             }
61
62             handleContextMenu = (event: React.MouseEvent<HTMLElement>, resourceUuid: string) => {
63                 // const resource = getResource<TrashableResource>(resourceUuid)(this.props.resources);
64                 // if (resource) {
65                 //     this.props.dispatch<any>(openContextMenu(event, {
66                 //         name: '',
67                 //         uuid: resource.uuid,
68                 //         ownerUuid: resource.ownerUuid,
69                 //         isTrashed: resource.isTrashed,
70                 //         kind: resource.kind,
71                 //         menuKind: ContextMenuKind.TRASH
72                 //     }));
73                 // }
74             }
75
76             handleRowDoubleClick = (uuid: string) => {
77                 this.props.dispatch<any>(navigateTo(uuid));
78             }
79
80             handleRowClick = (uuid: string) => {
81                 this.props.dispatch(loadDetailsPanel(uuid));
82             }
83         }
84     )
85 );