19462: Updating color scheme

[arvados-workbench2.git] / src / views-components / data-explorer / renderers.tsx

diff --git a/src/views-components/data-explorer/renderers.tsx b/src/views-components/data-explorer/renderers.tsx
index c955ebec8faaa0f3db964e63dae08ef39251cbec..cbe815c0582897e19064e622791c03fa83625152 100644 (file)
--- a/src/views-components/data-explorer/renderers.tsx
+++ b/src/views-components/data-explorer/renderers.tsx
@@ -15,7 +15,7 @@ import {
 import { FavoriteStar, PublicFavoriteStar } from '../favorite-star/favorite-star';
 import { Resource, ResourceKind, TrashableResource } from 'models/resource';
 import {
-    LockIcon,
+    FreezeIcon,
     ProjectIcon,
     FilterGroupIcon,
     CollectionIcon,
@@ -36,7 +36,7 @@ import { connect, DispatchProp } from 'react-redux';
 import { RootState } from 'store/store';
 import { getResource, filterResources } from 'store/resources/resources';
 import { GroupContentsResource } from 'services/groups-service/groups-service';
-import { getProcess, Process, getProcessStatus, getProcessStatusColor, getProcessRuntime } from 'store/processes/process';
+import { getProcess, Process, getProcessStatus, getProcessStatusStyles, getProcessRuntime } from 'store/processes/process';
 import { ArvadosTheme } from 'common/custom-theme';
 import { compose, Dispatch } from 'redux';
 import { WorkflowResource } from 'models/workflow';
@@ -100,7 +100,7 @@ const FrozenProject = (props: {item: ProjectResource}) => {
     if (props.item.frozenByUuid) {
 
         return <Tooltip onOpen={getFullName} enterDelay={500} title={<span>Project was frozen by {fullUsername}</span>}>
-            <LockIcon style={{ fontSize: "inherit" }}/>
+            <FreezeIcon style={{ fontSize: "inherit" }}/>
         </Tooltip>;
     } else {
         return null;
@@ -862,6 +862,16 @@ export const CollectionStatus = connect((state: RootState, props: { uuid: string
         : <Typography>head version</Typography>
 );
 
+export const CollectionName = connect((state: RootState, props: { uuid: string, className?: string }) => {
+    return {
+                collection: getResource<CollectionResource>(props.uuid)(state.resources),
+                uuid: props.uuid,
+                className: props.className,
+            };
+})((props: { collection: CollectionResource, uuid: string, className?: string }) =>
+        <Typography className={props.className}>{props.collection?.name || props.uuid}</Typography>
+);
+
 export const ProcessStatus = compose(
     connect((state: RootState, props: { uuid: string }) => {
         return { process: getProcess(props.uuid)(state.resources) };
@@ -873,15 +883,14 @@ export const ProcessStatus = compose(
                 style={{
                     height: props.theme.spacing.unit * 3,
                     width: props.theme.spacing.unit * 12,
-                    backgroundColor: getProcessStatusColor(
+                    ...getProcessStatusStyles(
                         getProcessStatus(props.process), props.theme),
-                    color: props.theme.palette.common.white,
                     fontSize: '0.875rem',
                     borderRadius: props.theme.spacing.unit * 0.625,
                 }}
             />
             : <Typography>-</Typography>
-    );
+        );
 
 export const ProcessStartDate = connect(
     (state: RootState, props: { uuid: string }) => {