From bd99e4056e42d462e04c238f4892dcb1221646d2 Mon Sep 17 00:00:00 2001
From: Jorge Padilla <jorge.esteban.padilla@gmail.com>
Date: Wed, 29 Nov 2023 18:36:08 -0500
Subject: [PATCH] fix(frontend): minor UI issues (#3411)

---
 web/src/components/Inputs/TestSelection/TestItem.tsx      | 8 +++++---
 .../Inputs/TestSelection/TestsSelection.styled.ts         | 7 +++++++
 web/src/components/RunDetailTrigger/RunDetailTrigger.tsx  | 6 +++++-
 .../SkipTraceCollectionInfo/SkipTraceCollectionInfo.tsx   | 2 +-
 4 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/web/src/components/Inputs/TestSelection/TestItem.tsx b/web/src/components/Inputs/TestSelection/TestItem.tsx
index 9dcd72d700..532df827c1 100644
--- a/web/src/components/Inputs/TestSelection/TestItem.tsx
+++ b/web/src/components/Inputs/TestSelection/TestItem.tsx
@@ -20,9 +20,11 @@ const TestItem = ({test, onDelete, sortableId}: IProps) => {
   return (
     <S.TestItemContainer ref={setNodeRef} style={style} {...attributes}>
       <S.DragHandle {...listeners} />
-      <S.TestLink to={`/test/${test.id}`} target="_blank">
-        <span>{test.name}</span>
-      </S.TestLink>
+      <S.TestNameContainer>
+        <S.TestLink to={`/test/${test.id}`} target="_blank">
+          <span>{test.name}</span>
+        </S.TestLink>
+      </S.TestNameContainer>
       <S.DeleteIcon onClick={() => onDelete(sortableId)} />
     </S.TestItemContainer>
   );
diff --git a/web/src/components/Inputs/TestSelection/TestsSelection.styled.ts b/web/src/components/Inputs/TestSelection/TestsSelection.styled.ts
index e08bd850b8..aa4d01677f 100644
--- a/web/src/components/Inputs/TestSelection/TestsSelection.styled.ts
+++ b/web/src/components/Inputs/TestSelection/TestsSelection.styled.ts
@@ -40,6 +40,9 @@ export const ItemListContainer = styled.ul`
 export const TestLink = styled(Link)`
   && {
     color: ${({theme}) => theme.color.text};
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
 
     &:hover,
     &:visited,
@@ -48,3 +51,7 @@ export const TestLink = styled(Link)`
     }
   }
 `;
+
+export const TestNameContainer = styled.div`
+  overflow: hidden;
+`;
diff --git a/web/src/components/RunDetailTrigger/RunDetailTrigger.tsx b/web/src/components/RunDetailTrigger/RunDetailTrigger.tsx
index 0267c6baa1..7fb8eef3cb 100644
--- a/web/src/components/RunDetailTrigger/RunDetailTrigger.tsx
+++ b/web/src/components/RunDetailTrigger/RunDetailTrigger.tsx
@@ -14,7 +14,7 @@ import TestRun, {isRunStateFinished} from 'models/TestRun.model';
 import TestRunEvent from 'models/TestRunEvent.model';
 import {useTest} from 'providers/Test/Test.provider';
 import {useTestRun} from 'providers/TestRun/TestRun.provider';
-import {useMemo, useState} from 'react';
+import {useEffect, useMemo, useState} from 'react';
 import TestService from 'services/Test.service';
 import {TDraftTest} from 'types/Test.types';
 import * as S from './RunDetailTrigger.styled';
@@ -47,6 +47,10 @@ const RunDetailTrigger = ({test, run: {id, state, triggerResult, triggerTime}, r
 
   useShortcutWithDefault(form);
 
+  useEffect(() => {
+    form.setFieldsValue(initialValues);
+  }, [form, initialValues]);
+
   return (
     <S.Container>
       <Form<TDraftTest>
diff --git a/web/src/components/SkipTraceCollectionInfo/SkipTraceCollectionInfo.tsx b/web/src/components/SkipTraceCollectionInfo/SkipTraceCollectionInfo.tsx
index 006d6b74ba..f16856cd2c 100644
--- a/web/src/components/SkipTraceCollectionInfo/SkipTraceCollectionInfo.tsx
+++ b/web/src/components/SkipTraceCollectionInfo/SkipTraceCollectionInfo.tsx
@@ -1,6 +1,6 @@
 import {InfoCircleOutlined} from '@ant-design/icons';
 import {Typography} from 'antd';
-import {Link} from 'react-router-dom';
+import Link from 'components/Link';
 import * as S from './SkipTraceCollectionInfo.styled';
 
 interface IProps {