16212: Sets api token on login success, re-focus on login error.
[arvados-workbench2.git] / src / views / collection-content-address-panel / collection-content-address-panel.tsx
index 5ca392feac7e781df75c2dd55aad2abd982c5a97..b652b502886653bcf43695cf80eeaefd8d9e86bf 100644 (file)
@@ -3,10 +3,7 @@
 // SPDX-License-Identifier: AGPL-3.0
 
 import * as React from 'react';
-import { Link } from 'react-router-dom';
-import {
-    StyleRulesCallback, WithStyles, withStyles, Grid
-} from '@material-ui/core';
+import { StyleRulesCallback, WithStyles, withStyles, Grid, Button } from '@material-ui/core';
 import { CollectionIcon } from '~/components/icon/icon';
 import { ArvadosTheme } from '~/common/custom-theme';
 import { BackIcon } from '~/components/icon/icon';
@@ -23,18 +20,18 @@ 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';
+import { ResourceName, ResourceOwnerName, ResourceLastModifiedDate } from '~/views-components/data-explorer/renderers';
 
 type CssRules = 'backLink' | 'backIcon' | 'card' | 'title' | 'iconHeader' | 'link';
 
 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     backLink: {
-        fontSize: '1rem',
+        fontSize: '14px',
         fontWeight: 600,
         display: 'flex',
         alignItems: 'center',
-        textDecoration: 'none',
         padding: theme.spacing.unit,
+        marginBottom: theme.spacing.unit,
         color: theme.palette.grey["700"],
     },
     backIcon: {
@@ -62,7 +59,7 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
 
 enum CollectionContentAddressPanelColumnNames {
     COLLECTION_WITH_THIS_ADDRESS = "Collection with this address",
-    OWNER = "Owner",
+    LOCATION = "Location",
     LAST_MODIFIED = "Last modified"
 }
 
@@ -76,11 +73,11 @@ export const collectionContentAddressPanelColumns: DataColumns<string> = [
         render: uuid => <ResourceName uuid={uuid} />
     },
     {
-        name: CollectionContentAddressPanelColumnNames.OWNER,
+        name: CollectionContentAddressPanelColumnNames.LOCATION,
         selected: true,
         configurable: true,
         filters: createTree(),
-        render: uuid => <ResourceOwner uuid={uuid} />
+        render: uuid => <ResourceOwnerName uuid={uuid} />
     },
     {
         name: CollectionContentAddressPanelColumnNames.LAST_MODIFIED,
@@ -92,13 +89,13 @@ export const collectionContentAddressPanelColumns: DataColumns<string> = [
     }
 ];
 
-export interface CollectionContentAddressMainCardActionProps {
+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);
@@ -121,21 +118,30 @@ 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}>
+                    <Button
+                        onClick={() => history.back()}
+                        className={this.props.classes.backLink}>
                         <BackIcon className={this.props.classes.backIcon} />
-                        Back test
-                    </Link> */}
+                        Back
+                    </Button>
                     <DataExplorer
                         id={COLLECTIONS_CONTENT_ADDRESS_PANEL_ID}
                         onRowClick={this.props.onItemClick}
                         onRowDoubleClick={this.props.onItemDoubleClick}
                         onContextMenu={this.props.onContextMenu}
                         contextMenuColumn={true}
+                        title={`Content address: ${this.props.match.params.id}`}
                         dataTableDefaultView={
                             <DataTableDefaultView
                                 icon={CollectionIcon}
@@ -145,4 +151,4 @@ export const CollectionsContentAddressPanel = withStyles(styles)(
             }
         }
     )
-);
\ No newline at end of file
+);