Merge pull request #157 from zenml-io/QA-Fixes

Qa fixes

Author: talhainvenxion

src/ui/components/Filters/index.tsx

@@ -293,7 +293,7 @@ export const getInitialFilterStateForRuns = () => {
         },
         {
           value: 'pipeline_id',
-          label: 'Pipeline Name',
+          label: 'Pipeline',
           type: 'string',
         },
         {
@@ -582,7 +582,7 @@ const FilterComponent = ({
 
       return member[0].name;
     }
-    if (typeName === 'Pipeline Name') {
+    if (typeName === 'Pipeline') {
       const pipeline = pipelines.filter((item) => item.id === value);
       return `${pipeline[0].name} ( v${pipeline[0].version} )`;
     }
@@ -627,7 +627,7 @@ const FilterComponent = ({
   }) as any;
   const pipelinesOptions = pipelines.map((item: any) => {
     return {
-      label: `${item.name} ( v${item.version} )` as string,
+      label: `${item.name} ( v${item.version})` as string,
       value: item.id as string,
     };
   }) as any;
@@ -834,8 +834,7 @@ const FilterComponent = ({
                         filter.column.selectedValue.label === 'Shared' ||
                         filter.column.selectedValue.label === 'Status'
                           ? 'is'
-                          : filter.column.selectedValue.label ===
-                              'Pipeline Name' ||
+                          : filter.column.selectedValue.label === 'Pipeline' ||
                             filter.column.selectedValue.label ===
                               'Stack Name' ||
                             filter.column.selectedValue.label === 'Author'

src/ui/layouts/stackComponents/Stacks/List/getHeaderCols.tsx

@@ -153,7 +153,11 @@ export const GetHeaderCols = ({
       width: '15%',
       renderRow: (stackComponent: TStack) => (
         <FlexBox alignItems="center" style={{ marginLeft: '-24px' }}>
-          <div data-tip data-for={stackComponent.flavor.name} style={{ margin: ' 0 auto 0 auto' }}>
+          <div
+            data-tip
+            data-for={stackComponent?.flavor?.name || stackComponent?.flavor}
+            style={{ margin: ' 0 auto 0 auto' }}
+          >
             <img
               alt={stackComponent.flavor.logoUrl}
               src={stackComponent.flavor.logoUrl}
@@ -165,7 +169,11 @@ export const GetHeaderCols = ({
           </div>
 
           <ReactTooltip
-            id={stackComponent.flavor.name}
+            id={
+              // stackComponent?.flavor
+              //   ? stackComponent?.flavor
+              stackComponent?.flavor?.name || stackComponent?.flavor
+            }
             place="top"
             effect="solid"
           >
@@ -195,8 +203,12 @@ export const GetHeaderCols = ({
       ),
       width: '15%',
       renderRow: (stackComponent: TStack) => (
-        <FlexBox alignItems="center"  style={{ marginLeft: '-24px' }}>
-          <div data-tip data-for={stackComponent.isShared} style={{ margin: '0 auto 0 auto' }}>
+        <FlexBox alignItems="center" style={{ marginLeft: '-24px' }}>
+          <div
+            data-tip
+            data-for={stackComponent.isShared}
+            style={{ margin: '0 auto 0 auto' }}
+          >
             <Box>
               <FlexBox
                 justifyContent="center"