1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
5 import React from 'react';
6 import { connect } from 'react-redux';
7 import { Grid, Button, Typography } from "@material-ui/core";
8 import { DataExplorer } from "views-components/data-explorer/data-explorer";
9 import { DataColumns } from 'components/data-table/data-table';
10 import { SortDirection } from 'components/data-table/data-column';
11 import { ResourceUuid } from 'views-components/data-explorer/renderers';
12 import { AddIcon } from 'components/icon/icon';
13 import { ResourceName } from 'views-components/data-explorer/renderers';
14 import { createTree } from 'models/tree';
15 import { GROUPS_PANEL_ID, openCreateGroupDialog } from 'store/groups-panel/groups-panel-actions';
16 import { noop } from 'lodash/fp';
17 import { ContextMenuKind } from 'views-components/context-menu/context-menu';
18 import { getResource, ResourcesState, filterResources } from 'store/resources/resources';
19 import { GroupResource } from 'models/group';
20 import { RootState } from 'store/store';
21 import { openContextMenu } from 'store/context-menu/context-menu-actions';
22 import { ResourceKind } from 'models/resource';
23 import { LinkClass, LinkResource } from 'models/link';
24 import { navigateToGroupDetails } from 'store/navigation/navigation-action';
26 export enum GroupsPanelColumnNames {
32 export const groupsPanelColumns: DataColumns<string> = [
34 name: GroupsPanelColumnNames.GROUP,
37 sortDirection: SortDirection.ASC,
38 filters: createTree(),
39 render: uuid => <ResourceName uuid={uuid} />
42 name: GroupsPanelColumnNames.UUID,
45 filters: createTree(),
46 render: uuid => <ResourceUuid uuid={uuid} />,
49 name: GroupsPanelColumnNames.MEMBERS,
52 filters: createTree(),
53 render: uuid => <GroupMembersCount uuid={uuid} />,
57 const mapStateToProps = (state: RootState) => {
59 resources: state.resources
63 const mapDispatchToProps = {
64 onContextMenu: openContextMenu,
65 onNewGroup: openCreateGroupDialog,
68 export interface GroupsPanelProps {
69 onNewGroup: () => void;
70 onContextMenu: (event: React.MouseEvent<HTMLElement>, item: any) => void;
71 resources: ResourcesState;
74 export const GroupsPanel = connect(
75 mapStateToProps, mapDispatchToProps
77 class GroupsPanel extends React.Component<GroupsPanelProps> {
84 onRowDoubleClick={noop}
85 onContextMenu={this.handleContextMenu}
86 contextMenuColumn={true}
89 <Grid container justify='flex-end'>
93 onClick={this.props.onNewGroup}>
101 handleContextMenu = (event: React.MouseEvent<HTMLElement>, resourceUuid: string) => {
102 const resource = getResource<GroupResource>(resourceUuid)(this.props.resources);
104 this.props.onContextMenu(event, {
107 ownerUuid: resource.ownerUuid,
109 menuKind: ContextMenuKind.GROUPS
116 const GroupMembersCount = connect(
117 (state: RootState, props: { uuid: string }) => {
119 const permissions = filterResources((resource: LinkResource) =>
120 resource.kind === ResourceKind.LINK &&
121 resource.linkClass === LinkClass.PERMISSION &&
122 resource.headUuid === props.uuid
126 children: permissions.length,
130 )((props: {children: number}) => (<Typography children={props.children} />));