19482: Fix context menu, breadcrumbs
[arvados.git] / src / views / workflow-panel / workflow-panel-view.tsx
1 // Copyright (C) The Arvados Authors. All rights reserved.
2 //
3 // SPDX-License-Identifier: AGPL-3.0
4
5 import React from 'react';
6 import { DataExplorer } from "views-components/data-explorer/data-explorer";
7 import { WorkflowIcon } from 'components/icon/icon';
8 import { WORKFLOW_PANEL_ID } from 'store/workflow-panel/workflow-panel-actions';
9 import {
10     ResourceLastModifiedDate,
11     ResourceWorkflowName,
12     ResourceWorkflowStatus,
13     ResourceShare,
14     ResourceRunProcess
15 } from "views-components/data-explorer/renderers";
16 import { SortDirection } from 'components/data-table/data-column';
17 import { DataColumns } from 'components/data-table/data-table';
18 import { DataTableFilterItem } from 'components/data-table-filters/data-table-filters';
19 import { Grid, Paper } from '@material-ui/core';
20 import { WorkflowDetailsCard } from './workflow-description-card';
21 import { WorkflowResource } from 'models/workflow';
22 import { createTree } from 'models/tree';
23
24 export enum WorkflowPanelColumnNames {
25     NAME = "Name",
26     AUTHORISATION = "Authorisation",
27     LAST_MODIFIED = "Last modified",
28     SHARE = 'Share'
29 }
30
31 export interface WorkflowPanelFilter extends DataTableFilterItem {
32     type: ResourceStatus;
33 }
34
35 export interface WorkflowPanelDataProps {
36     workflow?: WorkflowResource;
37 }
38
39 export interface WorfklowPanelActionProps {
40     handleRowDoubleClick: (workflowUuid: string) => void;
41     handleRowClick: (workflowUuid: string) => void;
42 }
43
44 export type WorkflowPanelProps = WorkflowPanelDataProps & WorfklowPanelActionProps;
45
46 export enum ResourceStatus {
47     PUBLIC = "Public",
48     PRIVATE = "Private",
49     SHARED = "Shared"
50 }
51
52 // TODO: restore filters
53 // const resourceStatus = (type: string) => {
54 //     switch (type) {
55 //         case ResourceStatus.PUBLIC:
56 //             return "Public";
57 //         case ResourceStatus.PRIVATE:
58 //             return "Private";
59 //         case ResourceStatus.SHARED:
60 //             return "Shared";
61 //         default:
62 //             return "Unknown";
63 //     }
64 // };
65
66 export const workflowPanelColumns: DataColumns<string> = [
67     {
68         name: WorkflowPanelColumnNames.NAME,
69         selected: true,
70         configurable: true,
71         sortDirection: SortDirection.ASC,
72         filters: createTree(),
73         render: (uuid: string) => <ResourceWorkflowName uuid={uuid} />
74     },
75     {
76         name: WorkflowPanelColumnNames.AUTHORISATION,
77         selected: true,
78         configurable: true,
79         filters: createTree(),
80         // TODO: restore filters
81         // filters: [
82         //     {
83         //         name: resourceStatus(ResourceStatus.PUBLIC),
84         //         selected: true,
85         //         type: ResourceStatus.PUBLIC
86         //     },
87         //     {
88         //         name: resourceStatus(ResourceStatus.PRIVATE),
89         //         selected: true,
90         //         type: ResourceStatus.PRIVATE
91         //     },
92         //     {
93         //         name: resourceStatus(ResourceStatus.SHARED),
94         //         selected: true,
95         //         type: ResourceStatus.SHARED
96         //     }
97         // ],
98         render: (uuid: string) => <ResourceWorkflowStatus uuid={uuid} />,
99     },
100     {
101         name: WorkflowPanelColumnNames.LAST_MODIFIED,
102         selected: true,
103         configurable: true,
104         sortDirection: SortDirection.NONE,
105         filters: createTree(),
106         render: (uuid: string) => <ResourceLastModifiedDate uuid={uuid} />
107     },
108     {
109         name: '',
110         selected: true,
111         configurable: false,
112         filters: createTree(),
113         render: (uuid: string) => <ResourceShare uuid={uuid} />
114     },
115     {
116         name: '',
117         selected: true,
118         configurable: false,
119         filters: createTree(),
120         render: (uuid: string) => <ResourceRunProcess uuid={uuid} />
121     }
122 ];
123
124 export const WorkflowPanelView = (props: WorkflowPanelProps) => {
125     return <Grid container spacing={16} style={{ minHeight: '500px' }}>
126         <Grid item xs={6}>
127             <DataExplorer
128                 id={WORKFLOW_PANEL_ID}
129                 onRowClick={props.handleRowClick}
130                 onRowDoubleClick={props.handleRowDoubleClick}
131                 contextMenuColumn={false}
132                 onContextMenu={e => e}
133                 defaultViewIcon={WorkflowIcon}
134                 defaultViewMessages={['Workflow list is empty.']} />
135         </Grid>
136         <Grid item xs={6}>
137             <Paper style={{ height: '100%' }}>
138                 <WorkflowDetailsCard workflow={props.workflow} />
139             </Paper>
140         </Grid>
141     </Grid>;
142 };