[arvados] updated: 2.7.0-6575-g8e1c9542ef

git repository hosting git at public.arvados.org
Thu May 16 15:14:57 UTC 2024


Summary of changes:
 .../root-details-card.tsx}                         |  61 +---------
 .../details-card/user-details-card.tsx             | 128 +++++++++++++++++++++
 .../src/views/project-panel/project-panel.tsx      |   4 +-
 3 files changed, 133 insertions(+), 60 deletions(-)
 rename services/workbench2/src/views-components/{project-details-card/project-details-card.tsx => details-card/root-details-card.tsx} (85%)
 create mode 100644 services/workbench2/src/views-components/details-card/user-details-card.tsx

       via  8e1c9542efbfddb2cf8cb79bb30937b436e6d3ef (commit)
      from  da46b2d068f86e75d055f98acbdbb789a4a7712f (commit)

Those revisions listed above that are new to this repository have
not appeared on any other notification email; so we list those
revisions in full, below.


commit 8e1c9542efbfddb2cf8cb79bb30937b436e6d3ef
Author: Lisa Knox <lisaknox83 at gmail.com>
Date:   Thu May 16 11:14:48 2024 -0400

    21224: moved user card to separate file
    
    Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox at curii.com>

diff --git a/services/workbench2/src/views-components/project-details-card/project-details-card.tsx b/services/workbench2/src/views-components/details-card/root-details-card.tsx
similarity index 85%
rename from services/workbench2/src/views-components/project-details-card/project-details-card.tsx
rename to services/workbench2/src/views-components/details-card/root-details-card.tsx
index b4494ae5ee..8ee0240baa 100644
--- a/services/workbench2/src/views-components/project-details-card/project-details-card.tsx
+++ b/services/workbench2/src/views-components/details-card/root-details-card.tsx
@@ -12,7 +12,6 @@ import { getPropertyChip } from '../resource-properties-form/property-chip';
 import { ProjectResource } from 'models/project';
 import { ResourceKind } from 'models/resource';
 import { UserResource } from 'models/user';
-import { UserResourceAccountStatus } from 'views-components/data-explorer/renderers';
 import { FavoriteStar, PublicFavoriteStar } from 'views-components/favorite-star/favorite-star';
 import { FreezeIcon } from 'components/icon/icon';
 import { Resource } from 'models/resource';
@@ -22,6 +21,7 @@ import { ExpandChevronRight } from 'components/expand-chevron-right/expand-chevr
 import { MultiselectToolbar } from 'components/multiselect-toolbar/MultiselectToolbar';
 import { setSelectedResourceUuid } from 'store/selected-resource/selected-resource-actions';
 import { deselectAllOthers } from 'store/multiselect/multiselect-actions';
+import { UserCard } from './user-details-card';
 
 type CssRules =
     | 'root'
@@ -169,13 +169,6 @@ type DetailsCardProps = WithStyles<CssRules> & {
     handleCardClick: (resource: any) => void;
 };
 
-type UserCardProps = WithStyles<CssRules> & {
-    currentResource: UserResource;
-    isAdmin: boolean;
-    isSelected: boolean;
-    handleCardClick: (resource: any) => void;
-};
-
 type ProjectCardProps = WithStyles<CssRules> & {
     currentResource: ProjectResource;
     frozenByFullName: string | undefined;
@@ -184,7 +177,7 @@ type ProjectCardProps = WithStyles<CssRules> & {
     handleCardClick: (resource: any) => void;
 };
 
-export const ProjectDetailsCard = connect(
+export const RootDetailsCard = connect(
     mapStateToProps,
     mapDispatchToProps
 )(
@@ -195,15 +188,7 @@ export const ProjectDetailsCard = connect(
         }
         switch (currentResource.kind as string) {
             case ResourceKind.USER:
-                return (
-                    <UserCard
-                        classes={classes}
-                        currentResource={currentResource as UserResource}
-                        isAdmin={isAdmin}
-                        isSelected={isSelected}
-                        handleCardClick={handleCardClick}
-                    />
-                );
+                return <UserCard />;
             case ResourceKind.PROJECT:
                 return (
                     <ProjectCard
@@ -221,46 +206,6 @@ export const ProjectDetailsCard = connect(
     })
 );
 
-const UserCard: React.FC<UserCardProps> = ({ classes, currentResource, handleCardClick, isSelected }) => {
-    const { fullName, uuid } = currentResource as UserResource & { fullName: string };
-
-    return (
-        <Card
-            className={classes.root}
-            onClick={() => handleCardClick(uuid)}
-            data-cy='user-details-card'
-        >
-            <Grid
-                container
-                wrap='nowrap'
-                className={classes.cardHeaderContainer}
-            >
-                <CardHeader
-                    className={classes.cardHeader}
-                    title={
-                        <section className={classes.userNameContainer}>
-                            <Typography
-                                noWrap
-                                variant='h6'
-                            >
-                                {fullName}
-                            </Typography>
-                            <section className={classes.accountStatusSection}>
-                                {!currentResource.isActive && (
-                                    <Typography>
-                                        <UserResourceAccountStatus uuid={uuid} />
-                                    </Typography>
-                            )}
-                            </section>
-                        </section>
-                    }
-                />
-                {isSelected && <MultiselectToolbar />}
-            </Grid>
-        </Card>
-    );
-};
-
 const ProjectCard: React.FC<ProjectCardProps> = ({ classes, currentResource, frozenByFullName, handleCardClick, isSelected }) => {
     const { name, description, uuid } = currentResource as ProjectResource;
     const [showDescription, setShowDescription] = React.useState(false);
diff --git a/services/workbench2/src/views-components/details-card/user-details-card.tsx b/services/workbench2/src/views-components/details-card/user-details-card.tsx
new file mode 100644
index 0000000000..f6d08f8d28
--- /dev/null
+++ b/services/workbench2/src/views-components/details-card/user-details-card.tsx
@@ -0,0 +1,128 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import React from 'react';
+import { StyleRulesCallback, Card, CardHeader, WithStyles, withStyles, Typography, Grid } from '@material-ui/core';
+import { ArvadosTheme } from 'common/custom-theme';
+import { UserResource } from 'models/user';
+import { connect } from 'react-redux';
+import { getResource } from 'store/resources/resources';
+import { UserResourceAccountStatus } from 'views-components/data-explorer/renderers';
+import { MultiselectToolbar } from 'components/multiselect-toolbar/MultiselectToolbar';
+import { RootState } from 'store/store';
+import { Dispatch } from 'redux';
+import { loadDetailsPanel } from 'store/details-panel/details-panel-action';
+import { setSelectedResourceUuid } from 'store/selected-resource/selected-resource-actions';
+import { deselectAllOthers } from 'store/multiselect/multiselect-actions';
+import { Resource } from 'models/resource';
+import { ProjectResource } from 'models/project';
+
+type CssRules = 'root' | 'cardHeaderContainer' | 'cardHeader' | 'userNameContainer' | 'accountStatusSection';
+
+const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
+    root: {
+        width: '100%',
+        marginBottom: '1rem',
+        flex: '0 0 auto',
+        padding: 0,
+        minHeight: '3rem',
+    },
+    userNameContainer: {
+        display: 'flex',
+        alignItems: 'center',
+        minHeight: '2.7rem',
+    },
+    cardHeaderContainer: {
+        width: '100%',
+        display: 'flex',
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+    },
+    cardHeader: {
+        minWidth: '30rem',
+        padding: '0.2rem 0.4rem 0.2rem 1rem',
+    },
+    accountStatusSection: {
+        display: 'flex',
+        flexDirection: 'row',
+        alignItems: 'center',
+        paddingLeft: '1rem',
+    },
+});
+
+const mapStateToProps = ({ auth, selectedResourceUuid, resources, properties }: RootState) => {
+    const currentResource = getResource(properties.currentRouteUuid)(resources);
+    const frozenByUser = currentResource && getResource((currentResource as ProjectResource).frozenByUuid as string)(resources);
+    const frozenByFullName = frozenByUser && (frozenByUser as Resource & { fullName: string }).fullName;
+    const isSelected = selectedResourceUuid === properties.currentRouteUuid;
+
+    return {
+        isAdmin: auth.user?.isAdmin,
+        currentResource,
+        frozenByFullName,
+        isSelected,
+    };
+};
+
+const mapDispatchToProps = (dispatch: Dispatch) => ({
+    handleCardClick: (uuid: string) => {
+        dispatch<any>(loadDetailsPanel(uuid));
+        dispatch<any>(setSelectedResourceUuid(uuid));
+        dispatch<any>(deselectAllOthers(uuid));
+    },
+});
+
+type UserCardProps = WithStyles<CssRules> & {
+    currentResource: UserResource;
+    isAdmin: boolean;
+    isSelected: boolean;
+    handleCardClick: (resource: any) => void;
+};
+
+export const UserCard = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(
+    withStyles(styles)((props: UserCardProps) => {
+        const { classes, currentResource, handleCardClick, isSelected } = props;
+        const { fullName, uuid } = currentResource as UserResource & { fullName: string };
+
+        return (
+            <Card
+                className={classes.root}
+                onClick={() => handleCardClick(uuid)}
+                data-cy='user-details-card'
+            >
+                <Grid
+                    container
+                    wrap='nowrap'
+                    className={classes.cardHeaderContainer}
+                >
+                    <CardHeader
+                        className={classes.cardHeader}
+                        title={
+                            <section className={classes.userNameContainer}>
+                                <Typography
+                                    noWrap
+                                    variant='h6'
+                                >
+                                    {fullName}
+                                </Typography>
+                                <section className={classes.accountStatusSection}>
+                                    {!currentResource.isActive && (
+                                        <Typography>
+                                            <UserResourceAccountStatus uuid={uuid} />
+                                        </Typography>
+                                    )}
+                                </section>
+                            </section>
+                        }
+                    />
+                    {isSelected && <MultiselectToolbar />}
+                </Grid>
+            </Card>
+        );
+    })
+);
diff --git a/services/workbench2/src/views/project-panel/project-panel.tsx b/services/workbench2/src/views/project-panel/project-panel.tsx
index 433cb11209..b9401a7b44 100644
--- a/services/workbench2/src/views/project-panel/project-panel.tsx
+++ b/services/workbench2/src/views/project-panel/project-panel.tsx
@@ -52,7 +52,7 @@ import { CollectionResource } from 'models/collection';
 import { resourceIsFrozen } from 'common/frozen-resources';
 import { ProjectResource } from 'models/project';
 import { deselectAllOthers, toggleOne } from 'store/multiselect/multiselect-actions';
-import { ProjectDetailsCard } from 'views-components/project-details-card/project-details-card';
+import { RootDetailsCard } from 'views-components/details-card/root-details-card'; 
 
 type CssRules = 'root' | 'button' ;
 
@@ -269,7 +269,7 @@ export const ProjectPanel = withStyles(styles)(
             render() {
                 const { classes } = this.props;
                 return <div data-cy='project-panel' className={classes.root}>
-                    <ProjectDetailsCard />
+                    <RootDetailsCard />
                     <DataExplorer
                         id={PROJECT_PANEL_ID}
                         onRowClick={this.handleRowClick}

-----------------------------------------------------------------------


hooks/post-receive
-- 




More information about the arvados-commits mailing list