Merge pull request #768 from smiclea/fix-os-label

Fix "Os" spelling in migration tasks names

src/components/modules/TransferModule/TaskItem/TaskItem.tsx

@@ -144,6 +144,7 @@ const Value = styled.div<any>`
 const DependsOnIds = styled.div<any>`
   display: flex;
   flex-direction: column;
+  text-transform: capitalize;
 `;
 const ExceptionText = styled.div<any>`
   cursor: pointer;
@@ -176,9 +177,18 @@ const ProgressUpdateValue = styled.div<any>`
   word-break: break-word;
 `;
 
+const getName = (taskType?: string) =>
+  taskType
+    ? taskType
+        .replace(/_/g, " ")
+        .toLowerCase()
+        .replace(/\b(?:os)\b/gi, "OS")
+    : "N/A";
+
 type Props = {
   columnWidths: string[];
   item: Task;
+  otherItems: Task[];
   open: boolean;
   instancesDetails: Instance[];
   onDependsOnClick: (id: string) => void;
@@ -258,9 +268,7 @@ class TaskItem extends React.Component<Props> {
               status={this.props.item.status}
               style={{ marginRight: "8px" }}
             />
-            <TitleText>
-              {this.props.item.task_type.replace(/_/g, " ").toLowerCase()}
-            </TitleText>
+            <TitleText>{getName(this.props.item.task_type)}</TitleText>
           </Title>
         </HeaderData>
         <HeaderData title={instanceName} width={this.props.columnWidths[1]}>
@@ -310,7 +318,9 @@ class TaskItem extends React.Component<Props> {
                 e.stopPropagation();
               }}
             >
-              {id}
+              {getName(
+                this.props.otherItems.find(item => item.id === id)?.task_type
+              )}
             </Value>
           ) : null
         )}

src/components/modules/TransferModule/TaskItem/story.tsx

@@ -48,6 +48,7 @@ storiesOf("TaskItem", module)
   .add("running", () => (
     <div style={{ width: "800px" }}>
       <TaskItem
+        otherItems={[]}
         instancesDetails={[]}
         item={item}
         columnWidths={columnWidths}
@@ -59,6 +60,7 @@ storiesOf("TaskItem", module)
   .add("closed", () => (
     <div style={{ width: "800px" }}>
       <TaskItem
+        otherItems={[]}
         instancesDetails={[]}
         item={item}
         columnWidths={columnWidths}
@@ -73,6 +75,7 @@ storiesOf("TaskItem", module)
     return (
       <div style={{ width: "800px" }}>
         <TaskItem
+          otherItems={[]}
           instancesDetails={[]}
           item={newItem}
           columnWidths={columnWidths}
@@ -88,6 +91,7 @@ storiesOf("TaskItem", module)
     return (
       <div style={{ width: "800px" }}>
         <TaskItem
+          otherItems={[]}
           instancesDetails={[]}
           item={newItem}
           columnWidths={columnWidths}
@@ -103,6 +107,7 @@ storiesOf("TaskItem", module)
     return (
       <div style={{ width: "800px" }}>
         <TaskItem
+          otherItems={[]}
           instancesDetails={[]}
           item={newItem}
           columnWidths={columnWidths}

src/components/modules/TransferModule/Tasks/Tasks.tsx

@@ -162,6 +162,7 @@ class Tasks extends React.Component<Props, State> {
             onMouseUp={e => this.handleItemMouseUp(e, item)}
             key={item.id}
             item={item}
+            otherItems={this.props.items.filter(i => i.id !== item.id)}
             instancesDetails={this.props.instancesDetails}
             columnWidths={ColumnWidths}
             open={Boolean(this.state.openedItems.find(i => i.id === item.id))}