From a61470255b4874196825dd1a69f1e3d01022ed72 Mon Sep 17 00:00:00 2001
From: Lisa Knox <lisaknox83@gmail.com>
Date: Thu, 21 Mar 2024 14:24:15 -0400
Subject: [PATCH] 21224: Root Project shows in details panel
 Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox@curii.com>

---
 services/workbench2/src/models/details.ts     |  3 +-
 .../details-panel/details-data.tsx            |  2 +
 .../details-panel/details-panel.tsx           |  4 +-
 .../details-panel/root-project-details.tsx    | 73 +++++++++++++++++++
 4 files changed, 80 insertions(+), 2 deletions(-)
 create mode 100644 services/workbench2/src/views-components/details-panel/root-project-details.tsx

diff --git a/services/workbench2/src/models/details.ts b/services/workbench2/src/models/details.ts
index b6eabd7014..5bde295e9a 100644
--- a/services/workbench2/src/models/details.ts
+++ b/services/workbench2/src/models/details.ts
@@ -8,5 +8,6 @@ import { ProcessResource } from "./process";
 import { EmptyResource } from "./empty";
 import { CollectionFile, CollectionDirectory } from 'models/collection-file';
 import { WorkflowResource } from 'models/workflow';
+import { UserResource } from "./user";
 
-export type DetailsResource = ProjectResource | CollectionResource | ProcessResource | EmptyResource | CollectionFile | CollectionDirectory | WorkflowResource;
+export type DetailsResource = ProjectResource | CollectionResource | ProcessResource | EmptyResource | CollectionFile | CollectionDirectory | WorkflowResource | UserResource & {name?: string};
diff --git a/services/workbench2/src/views-components/details-panel/details-data.tsx b/services/workbench2/src/views-components/details-panel/details-data.tsx
index bcca325c01..83ec4ff6cb 100644
--- a/services/workbench2/src/views-components/details-panel/details-data.tsx
+++ b/services/workbench2/src/views-components/details-panel/details-data.tsx
@@ -4,6 +4,7 @@
 
 import React from 'react';
 import { DetailsResource } from "models/details";
+import { ResourceKind } from 'models/resource';
 
 interface GetDetailsParams {
   tabNr?: number
@@ -14,6 +15,7 @@ export abstract class DetailsData<T extends DetailsResource = DetailsResource> {
     constructor(protected item: T) { }
 
     getTitle(): string {
+        if((this.item as any).kind === ResourceKind.USER) return 'Home Projects'
         return this.item.name || 'Projects';
     }
 
diff --git a/services/workbench2/src/views-components/details-panel/details-panel.tsx b/services/workbench2/src/views-components/details-panel/details-panel.tsx
index 8a05f11969..0c77281a79 100644
--- a/services/workbench2/src/views-components/details-panel/details-panel.tsx
+++ b/services/workbench2/src/views-components/details-panel/details-panel.tsx
@@ -15,6 +15,7 @@ import { EmptyResource } from 'models/empty';
 import { Dispatch } from "redux";
 import { ResourceKind } from "models/resource";
 import { ProjectDetails } from "./project-details";
+import { RootProjectDetails } from './root-project-details';
 import { CollectionDetails } from "./collection-details";
 import { ProcessDetails } from "./process-details";
 import { EmptyDetails } from "./empty-details";
@@ -76,6 +77,8 @@ const getItem = (res: DetailsResource): DetailsData => {
                 return new ProcessDetails(res);
             case ResourceKind.WORKFLOW:
                 return new WorkflowDetails(res);
+            case ResourceKind.USER:
+                return new RootProjectDetails(res);
             default:
                 return new EmptyDetails(res);
         }
@@ -161,7 +164,6 @@ export const DetailsPanel = withStyles(styles)(
 
             renderContent() {
                 const { classes, onCloseDrawer, res, tabNr, authConfig } = this.props;
-
                 let shouldShowInlinePreview = false;
                 if (!('kind' in res)) {
                     shouldShowInlinePreview = isInlineFileUrlSafe(
diff --git a/services/workbench2/src/views-components/details-panel/root-project-details.tsx b/services/workbench2/src/views-components/details-panel/root-project-details.tsx
new file mode 100644
index 0000000000..1a0446bbe9
--- /dev/null
+++ b/services/workbench2/src/views-components/details-panel/root-project-details.tsx
@@ -0,0 +1,73 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import React from 'react';
+import { connect } from 'react-redux';
+import { ProjectsIcon } from 'components/icon/icon';
+import { formatDate } from 'common/formatters';
+import { DetailsData } from "./details-data";
+import { DetailsAttribute } from "components/details-attribute/details-attribute";
+import { withStyles, StyleRulesCallback, WithStyles } from '@material-ui/core';
+import { ArvadosTheme } from 'common/custom-theme';
+import { Dispatch } from 'redux';
+import { openProjectUpdateDialog, ProjectUpdateFormDialogData } from 'store/projects/project-update-actions';
+import { RootState } from 'store/store';
+import { ResourcesState } from 'store/resources/resources';
+import { UserResource } from 'models/user';
+
+export class RootProjectDetails extends DetailsData<UserResource> {
+    getIcon(className?: string) {
+        return <ProjectsIcon className={className} />;
+    }
+
+    getDetails() {
+      console.log('RootProjectDetails getDetails', this.item);
+        return <RootProjectDetailsComponent rootProject={this.item} />;
+    }
+}
+
+type CssRules = 'tag' | 'editIcon' | 'editButton';
+
+const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
+    tag: {
+        marginRight: theme.spacing.unit / 2,
+        marginBottom: theme.spacing.unit / 2,
+    },
+    editIcon: {
+        paddingRight: theme.spacing.unit / 2,
+        fontSize: '1.125rem',
+    },
+    editButton: {
+        boxShadow: 'none',
+        padding: '2px 10px 2px 5px',
+        fontSize: '0.75rem'
+    },
+});
+
+interface RootProjectDetailsComponentDataProps {
+    rootProject: any;
+}
+
+const mapStateToProps = (state: RootState): { resources: ResourcesState } => {
+    return {
+        resources: state.resources
+    };
+};
+
+const mapDispatchToProps = (dispatch: Dispatch) => ({
+    onClick: (prj: ProjectUpdateFormDialogData) =>
+        () => dispatch<any>(openProjectUpdateDialog(prj)),
+});
+
+type RootProjectDetailsComponentProps = RootProjectDetailsComponentDataProps & WithStyles<CssRules>;
+
+const RootProjectDetailsComponent = connect(mapStateToProps, mapDispatchToProps)(
+    withStyles(styles)(
+        ({ rootProject}: RootProjectDetailsComponentProps & { resources: ResourcesState }) => <div>
+            <DetailsAttribute label='Type' value="Root Project" />
+            <DetailsAttribute label='User' value={rootProject.fullName} />
+            <DetailsAttribute label='Created at' value={formatDate(rootProject.createdAt)} />
+            <DetailsAttribute label='UUID' linkToUuid={rootProject.uuid} value={rootProject.uuid} />
+        </div>
+    ));
-- 
2.30.2