title-for-data-table

[arvados-workbench2.git] / src / views / collection-content-address-panel / collection-content-address-panel.tsx

diff --git a/src/views/collection-content-address-panel/collection-content-address-panel.tsx b/src/views/collection-content-address-panel/collection-content-address-panel.tsx
index 009e16c735051cf15e523f1f89f4f9cfd54d281f..dfe1b5bf825375ed08321b130869bf2cc4328a86 100644 (file)
--- a/src/views/collection-content-address-panel/collection-content-address-panel.tsx
+++ b/src/views/collection-content-address-panel/collection-content-address-panel.tsx
@@ -10,7 +10,6 @@ import {
 import { CollectionIcon } from '~/components/icon/icon';
 import { ArvadosTheme } from '~/common/custom-theme';
 import { BackIcon } from '~/components/icon/icon';
-import { CollectionResource } from '~/models/collection';
 import { DataTableDefaultView } from '~/components/data-table-default-view/data-table-default-view';
 import { COLLECTIONS_CONTENT_ADDRESS_PANEL_ID } from '~/store/collections-content-address-panel/collections-content-address-panel-actions';
 import { DataExplorer } from "~/views-components/data-explorer/data-explorer";
@@ -19,8 +18,12 @@ import { getIsAdmin } from '~/store/public-favorites/public-favorites-actions';
 import { resourceKindToContextMenuKind, openContextMenu } from '~/store/context-menu/context-menu-actions';
 import { ResourceKind } from '~/models/resource';
 import { loadDetailsPanel } from '~/store/details-panel/details-panel-action';
-import { connect, DispatchProp } from 'react-redux';
+import { connect } from 'react-redux';
 import { navigateTo } from '~/store/navigation/navigation-action';
+import { DataColumns } from '~/components/data-table/data-table';
+import { SortDirection } from '~/components/data-table/data-column';
+import { createTree } from '~/models/tree';
+import { ResourceName, ResourceOwner, ResourceLastModifiedDate } from '~/views-components/data-explorer/renderers';
 
 type CssRules = 'backLink' | 'backIcon' | 'card' | 'title' | 'iconHeader' | 'link';
 
@@ -57,14 +60,45 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     }
 });
 
+enum CollectionContentAddressPanelColumnNames {
+    COLLECTION_WITH_THIS_ADDRESS = "Collection with this address",
+    LOCATION = "Location",
+    LAST_MODIFIED = "Last modified"
+}
 
-export interface CollectionContentAddressMainCardActionProps {
+export const collectionContentAddressPanelColumns: DataColumns<string> = [
+    {
+        name: CollectionContentAddressPanelColumnNames.COLLECTION_WITH_THIS_ADDRESS,
+        selected: true,
+        configurable: true,
+        sortDirection: SortDirection.NONE,
+        filters: createTree(),
+        render: uuid => <ResourceName uuid={uuid} />
+    },
+    {
+        name: CollectionContentAddressPanelColumnNames.LOCATION,
+        selected: true,
+        configurable: true,
+        filters: createTree(),
+        render: uuid => <ResourceOwner uuid={uuid} />
+    },
+    {
+        name: CollectionContentAddressPanelColumnNames.LAST_MODIFIED,
+        selected: true,
+        configurable: true,
+        sortDirection: SortDirection.DESC,
+        filters: createTree(),
+        render: uuid => <ResourceLastModifiedDate uuid={uuid} />
+    }
+];
+
+export interface CollectionContentAddressPanelActionProps {
     onContextMenu: (event: React.MouseEvent<any>, uuid: string) => void;
     onItemClick: (item: string) => void;
     onItemDoubleClick: (item: string) => void;
 }
 
-const mapDispatchToProps = (dispatch: Dispatch): CollectionContentAddressMainCardActionProps => ({
+const mapDispatchToProps = (dispatch: Dispatch): CollectionContentAddressPanelActionProps => ({
     onContextMenu: (event, resourceUuid) => {
         const isAdmin = dispatch<any>(getIsAdmin());
         const kind = resourceKindToContextMenuKind(resourceUuid, isAdmin);
@@ -87,14 +121,20 @@ const mapDispatchToProps = (dispatch: Dispatch): CollectionContentAddressMainCar
     }
 });
 
+interface CollectionContentAddressDataProps {
+    match: {
+        params: { id: string }
+    };
+}
+
 export const CollectionsContentAddressPanel = withStyles(styles)(
     connect(null, mapDispatchToProps)(
-        class extends React.Component<CollectionContentAddressMainCardActionProps & WithStyles<CssRules>> {
+        class extends React.Component<CollectionContentAddressPanelActionProps & CollectionContentAddressDataProps & WithStyles<CssRules>> {
             render() {
                 return <Grid item xs={12}>
-                    {/* <Link to={`/collections/${this.props.collection.uuid}`} className={this.props.classes.backLink}>
+                    {/* <Link to={`/collections/${collectionUuid}`} className={this.props.classes.backLink}>
                         <BackIcon className={this.props.classes.backIcon} />
-                        Back test
+                        Back
                     </Link> */}
                     <DataExplorer
                         id={COLLECTIONS_CONTENT_ADDRESS_PANEL_ID}
@@ -102,6 +142,7 @@ export const CollectionsContentAddressPanel = withStyles(styles)(
                         onRowDoubleClick={this.props.onItemDoubleClick}
                         onContextMenu={this.props.onContextMenu}
                         contextMenuColumn={true}
+                        title={this.props.match.params.id}
                         dataTableDefaultView={
                             <DataTableDefaultView
                                 icon={CollectionIcon}