1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
5 import React from "react";
6 import { Grid, Typography, withStyles, Tooltip, IconButton, Checkbox, Chip, withTheme } from "@material-ui/core";
7 import { FavoriteStar, PublicFavoriteStar } from "../favorite-star/favorite-star";
8 import { Resource, ResourceKind, TrashableResource } from "models/resource";
17 CollectionOldVersionIcon,
25 } from "components/icon/icon";
26 import { formatDate, formatFileSize, formatTime } from "common/formatters";
27 import { resourceLabel } from "common/labels";
28 import { connect, DispatchProp } from "react-redux";
29 import { RootState } from "store/store";
30 import { getResource, filterResources } from "store/resources/resources";
31 import { GroupContentsResource } from "services/groups-service/groups-service";
32 import { getProcess, Process, getProcessStatus, getProcessStatusStyles, getProcessRuntime } from "store/processes/process";
33 import { ArvadosTheme } from "common/custom-theme";
34 import { compose, Dispatch } from "redux";
35 import { WorkflowResource } from "models/workflow";
36 import { ResourceStatus as WorkflowStatus } from "views/workflow-panel/workflow-panel-view";
37 import { getUuidPrefix, openRunProcess } from "store/workflow-panel/workflow-panel-actions";
38 import { openSharingDialog } from "store/sharing-dialog/sharing-dialog-actions";
39 import { getUserFullname, getUserDisplayName, User, UserResource } from "models/user";
40 import { toggleIsAdmin } from "store/users/users-actions";
41 import { LinkClass, LinkResource } from "models/link";
42 import { navigateTo, navigateToGroupDetails, navigateToUserProfile } from "store/navigation/navigation-action";
43 import { withResourceData } from "views-components/data-explorer/with-resources";
44 import { CollectionResource } from "models/collection";
45 import { IllegalNamingWarning } from "components/warning/warning";
46 import { loadResource } from "store/resources/resources-actions";
47 import { BuiltinGroups, getBuiltinGroupUuid, GroupClass, GroupResource, isBuiltinGroup } from "models/group";
48 import { openRemoveGroupMemberDialog } from "store/group-details-panel/group-details-panel-actions";
49 import { setMemberIsHidden } from "store/group-details-panel/group-details-panel-actions";
50 import { formatPermissionLevel } from "views-components/sharing-dialog/permission-select";
51 import { PermissionLevel } from "models/permission";
52 import { openPermissionEditContextMenu } from "store/context-menu/context-menu-actions";
53 import { VirtualMachinesResource } from "models/virtual-machines";
54 import { CopyToClipboardSnackbar } from "components/copy-to-clipboard-snackbar/copy-to-clipboard-snackbar";
55 import { ProjectResource } from "models/project";
56 import { ProcessResource } from "models/process";
57 import { InlinePulser } from "components/loading/inline-pulser";
59 const renderName = (dispatch: Dispatch, item: GroupContentsResource) => {
60 const navFunc = "groupClass" in item && item.groupClass === GroupClass.ROLE ? navigateToGroupDetails : navigateTo;
68 <Grid item>{renderIcon(item)}</Grid>
72 style={{ width: "auto", cursor: "pointer" }}
75 dispatch<any>(navFunc(item.uuid))
78 {item.kind === ResourceKind.PROJECT || item.kind === ResourceKind.COLLECTION ? <IllegalNamingWarning name={item.name} /> : null}
83 <Typography variant="caption">
84 <FavoriteStar resourceUuid={item.uuid} />
85 <PublicFavoriteStar resourceUuid={item.uuid} />
86 {item.kind === ResourceKind.PROJECT && <FrozenProject item={item} />}
93 const FrozenProject = (props: { item: ProjectResource }) => {
94 const [fullUsername, setFullusername] = React.useState<any>(null);
95 const getFullName = React.useCallback(() => {
96 if (props.item.frozenByUuid) {
97 setFullusername(<UserNameFromID uuid={props.item.frozenByUuid} />);
99 }, [props.item, setFullusername]);
101 if (props.item.frozenByUuid) {
106 title={<span>Project was frozen by {fullUsername}</span>}
108 <FreezeIcon style={{ fontSize: "inherit" }} />
116 export const ResourceName = connect((state: RootState, props: { uuid: string }) => {
117 const resource = getResource<GroupContentsResource>(props.uuid)(state.resources);
119 })((resource: GroupContentsResource & DispatchProp<any>) => renderName(resource.dispatch, resource));
121 const renderIcon = (item: GroupContentsResource) => {
123 case ResourceKind.PROJECT:
124 if (item.groupClass === GroupClass.FILTER) {
125 return <FilterGroupIcon />;
127 return <ProjectIcon />;
128 case ResourceKind.COLLECTION:
129 if (item.uuid === item.currentVersionUuid) {
130 return <CollectionIcon />;
132 return <CollectionOldVersionIcon />;
133 case ResourceKind.PROCESS:
134 return <ProcessIcon />;
135 case ResourceKind.WORKFLOW:
136 return <WorkflowIcon />;
138 return <DefaultIcon />;
142 const renderDate = (date?: string) => {
146 style={{ minWidth: "100px" }}
153 const renderWorkflowName = (item: WorkflowResource) => (
160 <Grid item>{renderIcon(item)}</Grid>
164 style={{ width: "100px" }}
172 export const ResourceWorkflowName = connect((state: RootState, props: { uuid: string }) => {
173 const resource = getResource<WorkflowResource>(props.uuid)(state.resources);
175 })(renderWorkflowName);
177 const getPublicUuid = (uuidPrefix: string) => {
178 return `${uuidPrefix}-tpzed-anonymouspublic`;
181 const resourceShare = (dispatch: Dispatch, uuidPrefix: string, ownerUuid?: string, uuid?: string) => {
182 const isPublic = ownerUuid === getPublicUuid(uuidPrefix);
185 {!isPublic && uuid && (
186 <Tooltip title="Share">
187 <IconButton onClick={() => dispatch<any>(openSharingDialog(uuid))}>
196 export const ResourceShare = connect((state: RootState, props: { uuid: string }) => {
197 const resource = getResource<WorkflowResource>(props.uuid)(state.resources);
198 const uuidPrefix = getUuidPrefix(state);
200 uuid: resource ? resource.uuid : "",
201 ownerUuid: resource ? resource.ownerUuid : "",
204 })((props: { ownerUuid?: string; uuidPrefix: string; uuid?: string } & DispatchProp<any>) =>
205 resourceShare(props.dispatch, props.uuidPrefix, props.ownerUuid, props.uuid)
209 const renderFirstName = (item: { firstName: string }) => {
210 return <Typography noWrap>{item.firstName}</Typography>;
213 export const ResourceFirstName = connect((state: RootState, props: { uuid: string }) => {
214 const resource = getResource<UserResource>(props.uuid)(state.resources);
215 return resource || { firstName: "" };
218 const renderLastName = (item: { lastName: string }) => <Typography noWrap>{item.lastName}</Typography>;
220 export const ResourceLastName = connect((state: RootState, props: { uuid: string }) => {
221 const resource = getResource<UserResource>(props.uuid)(state.resources);
222 return resource || { lastName: "" };
225 const renderFullName = (dispatch: Dispatch, item: { uuid: string; firstName: string; lastName: string }, link?: boolean) => {
226 const displayName = (item.firstName + " " + item.lastName).trim() || item.uuid;
231 style={{ cursor: "pointer" }}
232 onClick={() => dispatch<any>(navigateToUserProfile(item.uuid))}
237 <Typography noWrap>{displayName}</Typography>
241 export const UserResourceFullName = connect((state: RootState, props: { uuid: string; link?: boolean }) => {
242 const resource = getResource<UserResource>(props.uuid)(state.resources);
243 return { item: resource || { uuid: "", firstName: "", lastName: "" }, link: props.link };
244 })((props: { item: { uuid: string; firstName: string; lastName: string }; link?: boolean } & DispatchProp<any>) =>
245 renderFullName(props.dispatch, props.item, props.link)
248 const renderUuid = (item: { uuid: string }) => (
254 {(item.uuid && <CopyToClipboardSnackbar value={item.uuid} />) || "-"}
258 const renderUuidCopyIcon = (item: { uuid: string }) => (
263 {(item.uuid && <CopyToClipboardSnackbar value={item.uuid} />) || "-"}
267 export const ResourceUuid = connect(
268 (state: RootState, props: { uuid: string }) => getResource<UserResource>(props.uuid)(state.resources) || { uuid: "" }
271 const renderEmail = (item: { email: string }) => <Typography noWrap>{item.email}</Typography>;
273 export const ResourceEmail = connect((state: RootState, props: { uuid: string }) => {
274 const resource = getResource<UserResource>(props.uuid)(state.resources);
275 return resource || { email: "" };
278 enum UserAccountStatus {
280 INACTIVE = "Inactive",
285 const renderAccountStatus = (props: { status: UserAccountStatus }) => (
291 data-cy="account-status"
295 switch (props.status) {
296 case UserAccountStatus.ACTIVE:
297 return <ActiveIcon style={{ color: "#4caf50", verticalAlign: "middle" }} />;
298 case UserAccountStatus.SETUP:
299 return <SetupIcon style={{ color: "#2196f3", verticalAlign: "middle" }} />;
300 case UserAccountStatus.INACTIVE:
301 return <InactiveIcon style={{ color: "#9e9e9e", verticalAlign: "middle" }} />;
308 <Typography noWrap>{props.status}</Typography>
313 const getUserAccountStatus = (state: RootState, props: { uuid: string }) => {
314 const user = getResource<UserResource>(props.uuid)(state.resources);
315 // Get membership links for all users group
316 const allUsersGroupUuid = getBuiltinGroupUuid(state.auth.localCluster, BuiltinGroups.ALL);
317 const permissions = filterResources(
318 (resource: LinkResource) =>
319 resource.kind === ResourceKind.LINK &&
320 resource.linkClass === LinkClass.PERMISSION &&
321 resource.headUuid === allUsersGroupUuid &&
322 resource.tailUuid === props.uuid
327 ? { status: UserAccountStatus.ACTIVE }
328 : permissions.length > 0
329 ? { status: UserAccountStatus.SETUP }
330 : { status: UserAccountStatus.INACTIVE };
332 return { status: UserAccountStatus.UNKNOWN };
336 export const ResourceLinkTailAccountStatus = connect((state: RootState, props: { uuid: string }) => {
337 const link = getResource<LinkResource>(props.uuid)(state.resources);
338 return link && link.tailKind === ResourceKind.USER ? getUserAccountStatus(state, { uuid: link.tailUuid }) : { status: UserAccountStatus.UNKNOWN };
339 })(renderAccountStatus);
341 export const UserResourceAccountStatus = connect(getUserAccountStatus)(renderAccountStatus);
343 const renderIsHidden = (props: {
344 memberLinkUuid: string;
345 permissionLinkUuid: string;
348 setMemberIsHidden: (memberLinkUuid: string, permissionLinkUuid: string, hide: boolean) => void;
350 if (props.memberLinkUuid) {
353 data-cy="user-visible-checkbox"
355 checked={props.visible}
356 disabled={!props.canManage}
359 props.setMemberIsHidden(props.memberLinkUuid, props.permissionLinkUuid, !props.visible);
364 return <Typography />;
368 export const ResourceLinkTailIsVisible = connect(
369 (state: RootState, props: { uuid: string }) => {
370 const link = getResource<LinkResource>(props.uuid)(state.resources);
371 const member = getResource<Resource>(link?.tailUuid || "")(state.resources);
372 const group = getResource<GroupResource>(link?.headUuid || "")(state.resources);
373 const permissions = filterResources((resource: LinkResource) => {
375 resource.linkClass === LinkClass.PERMISSION &&
376 resource.headUuid === link?.tailUuid &&
377 resource.tailUuid === group?.uuid &&
378 resource.name === PermissionLevel.CAN_READ
382 const permissionLinkUuid = permissions.length > 0 ? permissions[0].uuid : "";
383 const isVisible = link && group && permissions.length > 0;
384 // Consider whether the current user canManage this resurce in addition when it's possible
385 const isBuiltin = isBuiltinGroup(link?.headUuid || "");
387 return member?.kind === ResourceKind.USER
388 ? { memberLinkUuid: link?.uuid, permissionLinkUuid, visible: isVisible, canManage: !isBuiltin }
389 : { memberLinkUuid: "", permissionLinkUuid: "", visible: false, canManage: false };
391 { setMemberIsHidden }
394 const renderIsAdmin = (props: { uuid: string; isAdmin: boolean; toggleIsAdmin: (uuid: string) => void }) => (
397 checked={props.isAdmin}
400 props.toggleIsAdmin(props.uuid);
405 export const ResourceIsAdmin = connect(
406 (state: RootState, props: { uuid: string }) => {
407 const resource = getResource<UserResource>(props.uuid)(state.resources);
408 return resource || { isAdmin: false };
413 const renderUsername = (item: { username: string; uuid: string }) => <Typography noWrap>{item.username || item.uuid}</Typography>;
415 export const ResourceUsername = connect((state: RootState, props: { uuid: string }) => {
416 const resource = getResource<UserResource>(props.uuid)(state.resources);
417 return resource || { username: "", uuid: props.uuid };
420 // Virtual machine resource
422 const renderHostname = (item: { hostname: string }) => <Typography noWrap>{item.hostname}</Typography>;
424 export const VirtualMachineHostname = connect((state: RootState, props: { uuid: string }) => {
425 const resource = getResource<VirtualMachinesResource>(props.uuid)(state.resources);
426 return resource || { hostname: "" };
429 const renderVirtualMachineLogin = (login: { user: string }) => <Typography noWrap>{login.user}</Typography>;
431 export const VirtualMachineLogin = connect((state: RootState, props: { linkUuid: string }) => {
432 const permission = getResource<LinkResource>(props.linkUuid)(state.resources);
433 const user = getResource<UserResource>(permission?.tailUuid || "")(state.resources);
435 return { user: user?.username || permission?.tailUuid || "" };
436 })(renderVirtualMachineLogin);
439 const renderCommonData = (data: string) => <Typography noWrap>{data}</Typography>;
441 const renderCommonDate = (date: string) => <Typography noWrap>{formatDate(date)}</Typography>;
443 export const CommonUuid = withResourceData("uuid", renderCommonData);
445 // Api Client Authorizations
446 export const TokenApiClientId = withResourceData("apiClientId", renderCommonData);
448 export const TokenApiToken = withResourceData("apiToken", renderCommonData);
450 export const TokenCreatedByIpAddress = withResourceData("createdByIpAddress", renderCommonDate);
452 export const TokenDefaultOwnerUuid = withResourceData("defaultOwnerUuid", renderCommonData);
454 export const TokenExpiresAt = withResourceData("expiresAt", renderCommonDate);
456 export const TokenLastUsedAt = withResourceData("lastUsedAt", renderCommonDate);
458 export const TokenLastUsedByIpAddress = withResourceData("lastUsedByIpAddress", renderCommonData);
460 export const TokenScopes = withResourceData("scopes", renderCommonData);
462 export const TokenUserId = withResourceData("userId", renderCommonData);
464 const clusterColors = [
472 export const ResourceCluster = (props: { uuid: string }) => {
473 const CLUSTER_ID_LENGTH = 5;
474 const pos = props.uuid.length > CLUSTER_ID_LENGTH ? props.uuid.indexOf("-") : 5;
475 const clusterId = pos >= CLUSTER_ID_LENGTH ? props.uuid.substring(0, pos) : "";
477 pos >= CLUSTER_ID_LENGTH
478 ? ((props.uuid.charCodeAt(0) * props.uuid.charCodeAt(1) + props.uuid.charCodeAt(2)) * props.uuid.charCodeAt(3) +
479 props.uuid.charCodeAt(4)) %
485 backgroundColor: clusterColors[ci][0],
486 color: clusterColors[ci][1],
497 const renderLinkName = (item: { name: string }) => <Typography noWrap>{item.name || "-"}</Typography>;
499 export const ResourceLinkName = connect((state: RootState, props: { uuid: string }) => {
500 const resource = getResource<LinkResource>(props.uuid)(state.resources);
501 return resource || { name: "" };
504 const renderLinkClass = (item: { linkClass: string }) => <Typography noWrap>{item.linkClass}</Typography>;
506 export const ResourceLinkClass = connect((state: RootState, props: { uuid: string }) => {
507 const resource = getResource<LinkResource>(props.uuid)(state.resources);
508 return resource || { linkClass: "" };
511 const getResourceDisplayName = (resource: Resource): string => {
512 if ((resource as UserResource).kind === ResourceKind.USER && typeof (resource as UserResource).firstName !== "undefined") {
513 // We can be sure the resource is UserResource
514 return getUserDisplayName(resource as UserResource);
516 return (resource as GroupContentsResource).name;
520 const renderResourceLink = (dispatch: Dispatch, item: Resource ) => {
521 var displayName = getResourceDisplayName(item);
527 style={{ cursor: "pointer" }}
529 item.kind === ResourceKind.GROUP && (item as GroupResource).groupClass === "role"
530 ? dispatch<any>(navigateToGroupDetails(item.uuid))
531 : item.kind === ResourceKind.USER
532 ? dispatch<any>(navigateToUserProfile(item.uuid))
533 : dispatch<any>(navigateTo(item.uuid));
536 {resourceLabel(item.kind, item && item.kind === ResourceKind.GROUP ? (item as GroupResource).groupClass || "" : "")}:{" "}
537 {displayName || item.uuid}
542 export const ResourceLinkTail = connect((state: RootState, props: { uuid: string }) => {
543 const resource = getResource<LinkResource>(props.uuid)(state.resources);
544 const tailResource = getResource<Resource>(resource?.tailUuid || "")(state.resources);
547 item: tailResource || { uuid: resource?.tailUuid || "", kind: resource?.tailKind || ResourceKind.NONE },
549 })((props: { item: Resource } & DispatchProp<any>) => renderResourceLink(props.dispatch, props.item));
551 export const ResourceLinkHead = connect((state: RootState, props: { uuid: string }) => {
552 const resource = getResource<LinkResource>(props.uuid)(state.resources);
553 const headResource = getResource<Resource>(resource?.headUuid || "")(state.resources);
556 item: headResource || { uuid: resource?.headUuid || "", kind: resource?.headKind || ResourceKind.NONE },
558 })((props: { item: Resource } & DispatchProp<any>) => renderResourceLink(props.dispatch, props.item));
560 export const ResourceLinkUuid = connect((state: RootState, props: { uuid: string }) => {
561 const resource = getResource<LinkResource>(props.uuid)(state.resources);
562 return resource || { uuid: "" };
565 export const ResourceLinkHeadUuid = connect((state: RootState, props: { uuid: string }) => {
566 const link = getResource<LinkResource>(props.uuid)(state.resources);
567 const headResource = getResource<Resource>(link?.headUuid || "")(state.resources);
569 return headResource || { uuid: "" };
572 export const ResourceLinkTailUuid = connect((state: RootState, props: { uuid: string }) => {
573 const link = getResource<LinkResource>(props.uuid)(state.resources);
574 const tailResource = getResource<Resource>(link?.tailUuid || "")(state.resources);
576 return tailResource || { uuid: "" };
579 const renderLinkDelete = (dispatch: Dispatch, item: LinkResource, canManage: boolean) => {
584 data-cy="resource-delete-button"
585 onClick={() => dispatch<any>(openRemoveGroupMemberDialog(item.uuid))}
594 data-cy="resource-delete-button"
601 return <Typography noWrap></Typography>;
605 export const ResourceLinkDelete = connect((state: RootState, props: { uuid: string }) => {
606 const link = getResource<LinkResource>(props.uuid)(state.resources);
607 const isBuiltin = isBuiltinGroup(link?.headUuid || "") || isBuiltinGroup(link?.tailUuid || "");
610 item: link || { uuid: "", kind: ResourceKind.NONE },
611 canManage: link && getResourceLinkCanManage(state, link) && !isBuiltin,
613 })((props: { item: LinkResource; canManage: boolean } & DispatchProp<any>) => renderLinkDelete(props.dispatch, props.item, props.canManage));
615 export const ResourceLinkTailEmail = connect((state: RootState, props: { uuid: string }) => {
616 const link = getResource<LinkResource>(props.uuid)(state.resources);
617 const resource = getResource<UserResource>(link?.tailUuid || "")(state.resources);
619 return resource || { email: "" };
622 export const ResourceLinkTailUsername = connect((state: RootState, props: { uuid: string }) => {
623 const link = getResource<LinkResource>(props.uuid)(state.resources);
624 const resource = getResource<UserResource>(link?.tailUuid || "")(state.resources);
626 return resource || { username: "" };
629 const renderPermissionLevel = (dispatch: Dispatch, link: LinkResource, canManage: boolean) => {
632 {formatPermissionLevel(link.name as PermissionLevel)}
635 data-cy="edit-permission-button"
636 onClick={event => dispatch<any>(openPermissionEditContextMenu(event, link))}
647 export const ResourceLinkHeadPermissionLevel = connect((state: RootState, props: { uuid: string }) => {
648 const link = getResource<LinkResource>(props.uuid)(state.resources);
649 const isBuiltin = isBuiltinGroup(link?.headUuid || "") || isBuiltinGroup(link?.tailUuid || "");
652 link: link || { uuid: "", name: "", kind: ResourceKind.NONE },
653 canManage: link && getResourceLinkCanManage(state, link) && !isBuiltin,
655 })((props: { link: LinkResource; canManage: boolean } & DispatchProp<any>) => renderPermissionLevel(props.dispatch, props.link, props.canManage));
657 export const ResourceLinkTailPermissionLevel = connect((state: RootState, props: { uuid: string }) => {
658 const link = getResource<LinkResource>(props.uuid)(state.resources);
659 const isBuiltin = isBuiltinGroup(link?.headUuid || "") || isBuiltinGroup(link?.tailUuid || "");
662 link: link || { uuid: "", name: "", kind: ResourceKind.NONE },
663 canManage: link && getResourceLinkCanManage(state, link) && !isBuiltin,
665 })((props: { link: LinkResource; canManage: boolean } & DispatchProp<any>) => renderPermissionLevel(props.dispatch, props.link, props.canManage));
667 const getResourceLinkCanManage = (state: RootState, link: LinkResource) => {
668 const headResource = getResource<Resource>(link.headUuid)(state.resources);
669 if (headResource && headResource.kind === ResourceKind.GROUP) {
670 return (headResource as GroupResource).canManage;
678 const resourceRunProcess = (dispatch: Dispatch, uuid: string) => {
682 <Tooltip title="Run process">
683 <IconButton onClick={() => dispatch<any>(openRunProcess(uuid))}>
692 export const ResourceRunProcess = connect((state: RootState, props: { uuid: string }) => {
693 const resource = getResource<WorkflowResource>(props.uuid)(state.resources);
695 uuid: resource ? resource.uuid : "",
697 })((props: { uuid: string } & DispatchProp<any>) => resourceRunProcess(props.dispatch, props.uuid));
699 const renderWorkflowStatus = (uuidPrefix: string, ownerUuid?: string) => {
700 if (ownerUuid === getPublicUuid(uuidPrefix)) {
701 return renderStatus(WorkflowStatus.PUBLIC);
703 return renderStatus(WorkflowStatus.PRIVATE);
707 const renderStatus = (status: string) => (
710 style={{ width: "60px" }}
716 export const ResourceWorkflowStatus = connect((state: RootState, props: { uuid: string }) => {
717 const resource = getResource<WorkflowResource>(props.uuid)(state.resources);
718 const uuidPrefix = getUuidPrefix(state);
720 ownerUuid: resource ? resource.ownerUuid : "",
723 })((props: { ownerUuid?: string; uuidPrefix: string }) => renderWorkflowStatus(props.uuidPrefix, props.ownerUuid));
725 export const ResourceContainerUuid = connect((state: RootState, props: { uuid: string }) => {
726 const process = getProcess(props.uuid)(state.resources);
727 return { uuid: process?.container?.uuid ? process?.container?.uuid : "" };
728 })((props: { uuid: string }) => renderUuid({ uuid: props.uuid }));
730 enum ColumnSelection {
731 OUTPUT_UUID = "outputUuid",
732 LOG_UUID = "logUuid",
735 const renderUuidLinkWithCopyIcon = (dispatch: Dispatch, item: ProcessResource, column: string) => {
736 const selectedColumnUuid = item[column];
744 {selectedColumnUuid ? (
747 style={{ width: "auto", cursor: "pointer" }}
749 onClick={() => dispatch<any>(navigateTo(selectedColumnUuid))}
757 <Grid item>{selectedColumnUuid && renderUuidCopyIcon({ uuid: selectedColumnUuid })}</Grid>
762 export const ResourceOutputUuid = connect((state: RootState, props: { uuid: string }) => {
763 const resource = getResource<ProcessResource>(props.uuid)(state.resources);
765 })((process: ProcessResource & DispatchProp<any>) => renderUuidLinkWithCopyIcon(process.dispatch, process, ColumnSelection.OUTPUT_UUID));
767 export const ResourceLogUuid = connect((state: RootState, props: { uuid: string }) => {
768 const resource = getResource<ProcessResource>(props.uuid)(state.resources);
770 })((process: ProcessResource & DispatchProp<any>) => renderUuidLinkWithCopyIcon(process.dispatch, process, ColumnSelection.LOG_UUID));
772 export const ResourceParentProcess = connect((state: RootState, props: { uuid: string }) => {
773 const process = getProcess(props.uuid)(state.resources);
774 return { parentProcess: process?.containerRequest?.requestingContainerUuid || "" };
775 })((props: { parentProcess: string }) => renderUuid({ uuid: props.parentProcess }));
777 export const ResourceModifiedByUserUuid = connect((state: RootState, props: { uuid: string }) => {
778 const process = getProcess(props.uuid)(state.resources);
779 return { userUuid: process?.containerRequest?.modifiedByUserUuid || "" };
780 })((props: { userUuid: string }) => renderUuid({ uuid: props.userUuid }));
782 export const ResourceCreatedAtDate = connect((state: RootState, props: { uuid: string }) => {
783 const resource = getResource<GroupContentsResource>(props.uuid)(state.resources);
784 return { date: resource ? resource.createdAt : "" };
785 })((props: { date: string }) => renderDate(props.date));
787 export const ResourceLastModifiedDate = connect((state: RootState, props: { uuid: string }) => {
788 const resource = getResource<GroupContentsResource>(props.uuid)(state.resources);
789 return { date: resource ? resource.modifiedAt : "" };
790 })((props: { date: string }) => renderDate(props.date));
792 export const ResourceTrashDate = connect((state: RootState, props: { uuid: string }) => {
793 const resource = getResource<TrashableResource>(props.uuid)(state.resources);
794 return { date: resource ? resource.trashAt : "" };
795 })((props: { date: string }) => renderDate(props.date));
797 export const ResourceDeleteDate = connect((state: RootState, props: { uuid: string }) => {
798 const resource = getResource<TrashableResource>(props.uuid)(state.resources);
799 return { date: resource ? resource.deleteAt : "" };
800 })((props: { date: string }) => renderDate(props.date));
802 export const renderFileSize = (fileSize?: number) => (
805 style={{ minWidth: "45px" }}
807 {formatFileSize(fileSize)}
811 export const ResourceFileSize = connect((state: RootState, props: { uuid: string }) => {
812 const resource = getResource<CollectionResource>(props.uuid)(state.resources);
814 if (resource && resource.kind !== ResourceKind.COLLECTION) {
815 return { fileSize: "" };
818 return { fileSize: resource ? resource.fileSizeTotal : 0 };
819 })((props: { fileSize?: number }) => renderFileSize(props.fileSize));
821 const renderOwner = (owner: string) => <Typography noWrap>{owner || "-"}</Typography>;
823 export const ResourceOwner = connect((state: RootState, props: { uuid: string }) => {
824 const resource = getResource<GroupContentsResource>(props.uuid)(state.resources);
825 return { owner: resource ? resource.ownerUuid : "" };
826 })((props: { owner: string }) => renderOwner(props.owner));
828 export const ResourceOwnerName = connect((state: RootState, props: { uuid: string }) => {
829 const resource = getResource<GroupContentsResource>(props.uuid)(state.resources);
830 const ownerNameState = state.ownerName;
831 const ownerName = ownerNameState.find(it => it.uuid === resource!.ownerUuid);
832 return { owner: ownerName ? ownerName!.name : resource!.ownerUuid };
833 })((props: { owner: string }) => renderOwner(props.owner));
835 export const ResourceUUID = connect((state: RootState, props: { uuid: string }) => {
836 const resource = getResource<CollectionResource>(props.uuid)(state.resources);
837 return { uuid: resource ? resource.uuid : "" };
838 })((props: { uuid: string }) => renderUuid({ uuid: props.uuid }));
840 const renderVersion = (version: number) => {
841 return <Typography>{version ?? "-"}</Typography>;
844 export const ResourceVersion = connect((state: RootState, props: { uuid: string }) => {
845 const resource = getResource<CollectionResource>(props.uuid)(state.resources);
846 return { version: resource ? resource.version : "" };
847 })((props: { version: number }) => renderVersion(props.version));
849 const renderPortableDataHash = (portableDataHash: string | null) => (
851 {portableDataHash ? (
854 <CopyToClipboardSnackbar value={portableDataHash} />
862 export const ResourcePortableDataHash = connect((state: RootState, props: { uuid: string }) => {
863 const resource = getResource<CollectionResource>(props.uuid)(state.resources);
864 return { portableDataHash: resource ? resource.portableDataHash : "" };
865 })((props: { portableDataHash: string }) => renderPortableDataHash(props.portableDataHash));
867 const renderFileCount = (fileCount: number) => {
868 return <Typography>{fileCount ?? "-"}</Typography>;
871 export const ResourceFileCount = connect((state: RootState, props: { uuid: string }) => {
872 const resource = getResource<CollectionResource>(props.uuid)(state.resources);
873 return { fileCount: resource ? resource.fileCount : "" };
874 })((props: { fileCount: number }) => renderFileCount(props.fileCount));
876 const userFromID = connect((state: RootState, props: { uuid: string }) => {
877 let userFullname = "";
878 const resource = getResource<GroupContentsResource & UserResource>(props.uuid)(state.resources);
881 userFullname = getUserFullname(resource as User) || (resource as GroupContentsResource).name;
884 return { uuid: props.uuid, userFullname };
887 const ownerFromResourceId = compose(
888 connect((state: RootState, props: { uuid: string }) => {
889 const childResource = getResource<GroupContentsResource & UserResource>(props.uuid)(state.resources);
890 return { uuid: childResource ? (childResource as Resource).ownerUuid : "" };
895 const _resourceWithName = withStyles(
898 )((props: { uuid: string; userFullname: string; dispatch: Dispatch; theme: ArvadosTheme }) => {
899 const { uuid, userFullname, dispatch, theme } = props;
900 if (userFullname === "") {
901 dispatch<any>(loadResource(uuid, false));
904 style={{ color: theme.palette.primary.main }}
914 style={{ color: theme.palette.primary.main }}
917 {userFullname} ({uuid})
922 const _resourceWithNameLink = withStyles(
925 )((props: { uuid: string; userFullname: string; dispatch: Dispatch; theme: ArvadosTheme }) => {
926 const { uuid, userFullname, dispatch, theme } = props;
928 dispatch<any>(loadResource(uuid, false));
933 style={{ color: theme.palette.primary.main, cursor: 'pointer' }}
936 onClick={() => dispatch<any>(navigateTo(uuid))}
938 {userFullname ? userFullname : uuid}
944 export const ResourceOwnerWithNameLink = ownerFromResourceId(_resourceWithNameLink);
946 export const ResourceOwnerWithName = ownerFromResourceId(_resourceWithName);
948 export const ResourceWithName = userFromID(_resourceWithName);
950 export const UserNameFromID = compose(userFromID)((props: { uuid: string; displayAsText?: string; userFullname: string; dispatch: Dispatch }) => {
951 const { uuid, userFullname, dispatch } = props;
953 if (userFullname === "") {
954 dispatch<any>(loadResource(uuid, false));
956 return <span>{userFullname ? userFullname : uuid}</span>;
959 export const ResponsiblePerson = compose(
960 connect((state: RootState, props: { uuid: string; parentRef: HTMLElement | null }) => {
961 let responsiblePersonName: string = "";
962 let responsiblePersonUUID: string = "";
963 let responsiblePersonProperty: string = "";
965 if (state.auth.config.clusterConfig.Collections.ManagedProperties) {
967 const keys = Object.keys(state.auth.config.clusterConfig.Collections.ManagedProperties);
969 while (!responsiblePersonProperty && keys[index]) {
970 const key = keys[index];
971 if (state.auth.config.clusterConfig.Collections.ManagedProperties[key].Function === "original_owner") {
972 responsiblePersonProperty = key;
978 let resource: Resource | undefined = getResource<GroupContentsResource & UserResource>(props.uuid)(state.resources);
980 while (resource && resource.kind !== ResourceKind.USER && responsiblePersonProperty) {
981 responsiblePersonUUID = (resource as CollectionResource).properties[responsiblePersonProperty];
982 resource = getResource<GroupContentsResource & UserResource>(responsiblePersonUUID)(state.resources);
985 if (resource && resource.kind === ResourceKind.USER) {
986 responsiblePersonName = getUserFullname(resource as UserResource) || (resource as GroupContentsResource).name;
989 return { uuid: responsiblePersonUUID, responsiblePersonName, parentRef: props.parentRef };
991 withStyles({}, { withTheme: true })
992 )((props: { uuid: string | null; responsiblePersonName: string; parentRef: HTMLElement | null; theme: ArvadosTheme }) => {
993 const { uuid, responsiblePersonName, parentRef, theme } = props;
995 if (!uuid && parentRef) {
996 parentRef.style.display = "none";
998 } else if (parentRef) {
999 parentRef.style.display = "block";
1002 if (!responsiblePersonName) {
1005 style={{ color: theme.palette.primary.main }}
1016 style={{ color: theme.palette.primary.main }}
1020 {responsiblePersonName} ({uuid})
1025 const renderType = (type: string, subtype: string) => <Typography noWrap>{resourceLabel(type, subtype)}</Typography>;
1027 export const ResourceType = connect((state: RootState, props: { uuid: string }) => {
1028 const resource = getResource<GroupContentsResource>(props.uuid)(state.resources);
1029 return { type: resource ? resource.kind : "", subtype: resource && resource.kind === ResourceKind.GROUP ? resource.groupClass : "" };
1030 })((props: { type: string; subtype: string }) => renderType(props.type, props.subtype));
1032 export const ResourceStatus = connect((state: RootState, props: { uuid: string }) => {
1033 return { resource: getResource<GroupContentsResource>(props.uuid)(state.resources) };
1034 })((props: { resource: GroupContentsResource }) =>
1035 props.resource && props.resource.kind === ResourceKind.COLLECTION ? (
1036 <CollectionStatus uuid={props.resource.uuid} />
1038 <ProcessStatus uuid={props.resource.uuid} />
1042 export const CollectionStatus = connect((state: RootState, props: { uuid: string }) => {
1043 return { collection: getResource<CollectionResource>(props.uuid)(state.resources) };
1044 })((props: { collection: CollectionResource }) =>
1045 props.collection.uuid !== props.collection.currentVersionUuid ? (
1046 <Typography>version {props.collection.version}</Typography>
1048 <Typography>head version</Typography>
1052 export const CollectionName = connect((state: RootState, props: { uuid: string; className?: string }) => {
1054 collection: getResource<CollectionResource>(props.uuid)(state.resources),
1056 className: props.className,
1058 })((props: { collection: CollectionResource; uuid: string; className?: string }) => (
1059 <Typography className={props.className}>{props.collection?.name || props.uuid}</Typography>
1062 export const ProcessStatus = compose(
1063 connect((state: RootState, props: { uuid: string }) => {
1064 return { process: getProcess(props.uuid)(state.resources) };
1066 withStyles({}, { withTheme: true })
1067 )((props: { process?: Process; theme: ArvadosTheme }) =>
1070 label={getProcessStatus(props.process)}
1072 height: props.theme.spacing.unit * 3,
1073 width: props.theme.spacing.unit * 12,
1074 ...getProcessStatusStyles(getProcessStatus(props.process), props.theme),
1075 fontSize: "0.875rem",
1076 borderRadius: props.theme.spacing.unit * 0.625,
1080 <Typography>-</Typography>
1084 export const ProcessStartDate = connect((state: RootState, props: { uuid: string }) => {
1085 const process = getProcess(props.uuid)(state.resources);
1086 return { date: process && process.container ? process.container.startedAt : "" };
1087 })((props: { date: string }) => renderDate(props.date));
1089 export const renderRunTime = (time: number) => (
1092 style={{ minWidth: "45px" }}
1094 {formatTime(time, true)}
1098 interface ContainerRunTimeProps {
1102 interface ContainerRunTimeState {
1106 export const ContainerRunTime = connect((state: RootState, props: { uuid: string }) => {
1107 return { process: getProcess(props.uuid)(state.resources) };
1109 class extends React.Component<ContainerRunTimeProps, ContainerRunTimeState> {
1112 constructor(props: ContainerRunTimeProps) {
1114 this.state = { runtime: this.getRuntime() };
1118 return this.props.process ? getProcessRuntime(this.props.process) : 0;
1122 this.setState({ runtime: this.getRuntime() });
1125 componentDidMount() {
1126 this.timer = setInterval(this.updateRuntime.bind(this), 5000);
1129 componentWillUnmount() {
1130 clearInterval(this.timer);
1134 return this.props.process ? renderRunTime(this.state.runtime) : <Typography>-</Typography>;
1139 export const GroupMembersCount = connect(
1140 (state: RootState, props: { uuid: string }) => {
1141 const group = getResource<GroupResource>(props.uuid)(state.resources);
1144 value: group?.memberCount,
1148 )(withTheme()((props: {value: number | null | undefined, theme:ArvadosTheme}) => {
1149 if (props.value === undefined) {
1151 return <Typography component={"div"}>
1154 } else if (props.value === null) {
1157 <Tooltip title="Failed to load member count">
1158 <ErrorIcon style={{color: props.theme.customs.colors.greyL}}/>
1162 return <Typography children={props.value} />;