Merge branch '14941-public-favorites-initialize-data-explorer-and-routing'

[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 be0fc793a3cb8716d879f1e8400c5acfacdd3e78..04dbfa7c03ae05f40cf5a42003728d2ce91cddbd 100644 (file)
--- a/src/views-components/data-explorer/renderers.tsx
+++ b/src/views-components/data-explorer/renderers.tsx
@@ -25,12 +25,12 @@ import { UserResource } from '~/models/user';
 import { toggleIsActive, toggleIsAdmin } from '~/store/users/users-actions';
 import { LinkResource } from '~/models/link';
 import { navigateTo } from '~/store/navigation/navigation-action';
-import { withResource, getDataFromResource, withResourceData } from '~/views-components/data-explorer/with-resources';
+import { withResourceData } from '~/views-components/data-explorer/with-resources';
 
 const renderName = (item: { name: string; uuid: string, kind: string }) =>
     <Grid container alignItems="center" wrap="nowrap" spacing={16}>
         <Grid item>
-            {renderIcon(item)}
+            {renderIcon(item.kind)}
         </Grid>
         <Grid item>
             <Typography color="primary" style={{ width: 'auto' }}>
@@ -50,8 +50,8 @@ export const ResourceName = connect(
         return resource || { name: '', uuid: '', kind: '' };
     })(renderName);
 
-const renderIcon = (item: { kind: string }) => {
-    switch (item.kind) {
+const renderIcon = (kind: string) => {
+    switch (kind) {
         case ResourceKind.PROJECT:
             return <ProjectIcon />;
         case ResourceKind.COLLECTION:
@@ -72,7 +72,7 @@ const renderDate = (date?: string) => {
 const renderWorkflowName = (item: { name: string; uuid: string, kind: string, ownerUuid: string }) =>
     <Grid container alignItems="center" wrap="nowrap" spacing={16}>
         <Grid item>
-            {renderIcon(item)}
+            {renderIcon(item.kind)}
         </Grid>
         <Grid item>
             <Typography color="primary" style={{ width: '100px' }}>
@@ -284,13 +284,13 @@ const renderLinkTail = (dispatch: Dispatch, item: { uuid: string, tailUuid: stri
     const currentLabel = resourceLabel(item.tailKind);
     const isUnknow = currentLabel === "Unknown";
     return (<div>
-        { !isUnknow  ? (
-                renderLink(dispatch, item.tailUuid, currentLabel)
-            ) : (
+        {!isUnknow ? (
+            renderLink(dispatch, item.tailUuid, currentLabel)
+        ) : (
                 <Typography noWrap color="default">
                     {item.tailUuid}
                 </Typography>
-        )}
+            )}
     </div>);
 };
 
@@ -326,6 +326,35 @@ export const ResourceLinkUuid = connect(
         return resource || { uuid: '' };
     })(renderUuid);
 
+const renderLinkNameAndIcon = (item: { name: string; headUuid: string, headKind: string }) =>
+    <Grid container alignItems="center" wrap="nowrap" spacing={16}>
+        <Grid item>
+            {renderIcon(item.headKind)}
+        </Grid>
+        <Grid item>
+            <Typography color="primary" style={{ width: 'auto' }}>
+                {item.name}
+            </Typography>
+        </Grid>
+        <Grid item>
+            <Typography variant="caption">
+                <FavoriteStar resourceUuid={item.headUuid} />
+            </Typography>
+        </Grid>
+    </Grid>;
+
+export const ResourceLinkNameAndIcon = connect(
+    (state: RootState, props: { uuid: string }) => {
+        const resource = getResource<LinkResource>(props.uuid)(state.resources);
+        return resource || { name: '', headUuid: '', headKind: '' };
+    })(renderLinkNameAndIcon);
+
+export const ResourceLinkType = connect(
+    (state: RootState, props: { uuid: string }) => {
+        const resource = getResource<LinkResource>(props.uuid)(state.resources);
+        return { type: resource ? resource.headKind : '' };
+    })((props: { type: string }) => renderType(props.type));
+
 // Process Resources
 const resourceRunProcess = (dispatch: Dispatch, uuid: string) => {
     return (