fix(ui): some uxt fi

frontend/app/components/UsabilityTesting/TestEdit.tsx

@@ -50,6 +50,11 @@ function TestEdit() {
   const history = useHistory();
   usePageTitle(`Usability Tests | ${uxtestingStore.instance ? 'Edit' : 'Create'}`);
 
+  React.useEffect(() => {
+    if (siteId !== uxtestingStore.instanceCreationSiteId) {
+      history.push(withSiteId(usabilityTesting(), siteId));
+    }
+  }, [siteId]);
   React.useEffect(() => {
     if (testId && testId !== 'new') {
       uxtestingStore.getTestData(testId).then((inst) => {
@@ -76,7 +81,11 @@ function TestEdit() {
     if (testId && testId !== 'new') {
       uxtestingStore.updateTest(uxtestingStore.instance!, isPreview).then((testId) => {
         if (isPreview) {
-          window.open(`${uxtestingStore.instance!.startingPath}?oruxt=${testId}`, '_blank', 'noopener,noreferrer');
+          window.open(
+            `${uxtestingStore.instance!.startingPath}?oruxt=${testId}`,
+            '_blank',
+            'noopener,noreferrer'
+          );
         } else {
           toast.success('The usability test is now live and accessible to participants.');
           history.push(withSiteId(usabilityTestingView(testId!.toString()), siteId));
@@ -421,14 +430,18 @@ export function Step({
   hover?: boolean;
 }) {
   const safeTitle = title.length > 120 ? title.slice(0, 120) + '...' : title;
-  const safeDescription = description && description?.length > 300 ? description.slice(0, 300) + '...' : description;
+  const safeDescription =
+    description && description?.length > 300 ? description.slice(0, 300) + '...' : description;
   return (
     <div
       className={`p-4 rounded border ${
         hover ? 'bg-white hover:' : ''
       }bg-active-blue flex items-start gap-2`}
     >
-      <div style={{ minWidth: '1.5rem' }} className={'w-6 h-6 bg-white rounded-full border flex items-center justify-center'}>
+      <div
+        style={{ minWidth: '1.5rem' }}
+        className={'w-6 h-6 bg-white rounded-full border flex items-center justify-center'}
+      >
         {ind + 1}
       </div>
 
@@ -439,7 +452,7 @@ export function Step({
 
       <div className={'ml-auto'} />
       <div className={'flex items-center gap-2'} style={{ minWidth: '4rem' }}>
-      {buttons}
+        {buttons}
       </div>
     </div>
   );

frontend/app/components/UsabilityTesting/TestOverview.tsx

@@ -59,11 +59,20 @@ function TestOverview() {
   // @ts-ignore
   const { siteId, testId } = useParams();
   const { showModal, hideModal } = useModal();
+  const history = useHistory();
   const { uxtestingStore } = useStore();
 
   React.useEffect(() => {
-    uxtestingStore.getTest(testId);
-  }, [testId]);
+    const getData = async () => {
+      try {
+        await uxtestingStore.getTest(testId);
+      } catch {
+        history.push(withSiteId(usabilityTesting(), siteId));
+      }
+    }
+
+    void getData();
+  }, [testId, siteId]);
 
   if (!uxtestingStore.instance) {
     return <Loader loading={uxtestingStore.isLoading}>No data.</Loader>;
@@ -390,6 +399,7 @@ const Title = observer(({ testId, siteId }: any) => {
   // @ts-ignore
   const getColor = (status) => colors[status];
 
+  const isActive = ['in-progress', 'preview'].includes(uxtestingStore.instance!.status);
   return (
     <div className={'p-4 border-b'}>
       <div className={'flex items-center gap-2'}>
@@ -423,39 +433,41 @@ const Title = observer(({ testId, siteId }: any) => {
             {uxtestingStore.instance!.tasks.length} Tasks <EditOutlined rev={undefined} />{' '}
           </Space>
         </Button>
-        <Popover
-          trigger={'click'}
-          title={'Participants Link'}
-          content={
-            <div style={{ width: '220px' }}>
-              <div className={'text-disabled-text text-sm'}>
-                Distribute following link via email or other methods to share the survey with test
-                participants.
+        {isActive ?
+          <Popover
+            trigger={'click'}
+            title={'Participants Link'}
+            content={
+              <div style={{ width: '220px' }}>
+                <div className={'text-disabled-text text-sm'}>
+                  Distribute following link via email or other methods to share the survey with test
+                  participants.
+                </div>
+                <div
+                  style={{ background: '#E4F6F6' }}
+                  className={'p-2 rounded border shadow break-all my-2'}
+                >
+                  {`${uxtestingStore.instance!.startingPath}?oruxt=${
+                    uxtestingStore.instance!.testId
+                  }`}
+                </div>
+                <CopyButton
+                  variant={'outline'}
+                  content={`${uxtestingStore.instance!.startingPath}?oruxt=${
+                    uxtestingStore.instance!.testId
+                  }`}
+                />
               </div>
-              <div
-                style={{ background: '#E4F6F6' }}
-                className={'p-2 rounded border shadow break-all my-2'}
-              >
-                {`${uxtestingStore.instance!.startingPath}?oruxt=${
-                  uxtestingStore.instance!.testId
-                }`}
-              </div>
-              <CopyButton
-                variant={'outline'}
-                content={`${uxtestingStore.instance!.startingPath}?oruxt=${
-                  uxtestingStore.instance!.testId
-                }`}
-              />
-            </div>
-          }
-        >
-          <Button type={'primary'} ghost>
-            <Space align={'center'}>
-              Distribute
-              <ShareAltOutlined rev={undefined} />
-            </Space>
-          </Button>
-        </Popover>
+            }
+          >
+            <Button type={'primary'} ghost>
+              <Space align={'center'}>
+                Distribute
+                <ShareAltOutlined rev={undefined} />
+              </Space>
+            </Button>
+          </Popover>
+        : null}
         <Dropdown
           menu={{
             items:

frontend/app/components/UsabilityTesting/UsabilityTesting.tsx

@@ -8,7 +8,7 @@ import AnimatedSVG from 'Shared/AnimatedSVG';
 import { ICONS } from 'Shared/AnimatedSVG/AnimatedSVG';
 import { Loader, NoContent, Pagination, Link, Icon } from 'UI';
 import { checkForRecent, getDateFromMill } from 'App/date';
-import { UnorderedListOutlined, ArrowRightOutlined } from '@ant-design/icons';
+import { ArrowRightOutlined } from '@ant-design/icons';
 import { useHistory, useParams } from 'react-router-dom';
 import { withSiteId, usabilityTestingEdit, usabilityTestingView } from 'App/routes';
 import { debounce } from 'App/utils';
@@ -49,7 +49,7 @@ function TestsTable() {
 
   const onClose = (confirmed: boolean) => {
     if (confirmed) {
-      uxtestingStore.initNewTest(newTestTitle, newTestDescription);
+      uxtestingStore.initNewTest(newTestTitle, newTestDescription, siteId);
       setNewTestDescription('');
       setNewTestTitle('');
       redirect('new');
@@ -212,7 +212,6 @@ function Row({ test, siteId }: { test: UxTListEntry; siteId: string }) {
             >
               <Icon name={'list-ul'} color={'tealx'} size={20} />
             </div>
-            {/*<Avatar size={'large'} icon={<UnorderedListOutlined rev={undefined} />} />*/}
           </div>
           <div style={{ maxWidth: 550 }}>
             <Link className="link" to={test.status === 'preview' ? editLink : link}>

frontend/app/mstore/uxtestingStore.ts

@@ -53,6 +53,7 @@ export default class UxtestingStore {
   client = uxtestingService;
   tests: UxTListEntry[] = [];
   instance: UxTestInst | null = null;
+  instanceCreationSiteId = '';
   page: number = 1;
   total: number = 0;
   pageSize: number = 10;
@@ -145,7 +146,8 @@ export default class UxtestingStore {
     }
   };
 
-  initNewTest(title: string, description: string) {
+  initNewTest(title: string, description: string, siteId: string) {
+    this.instanceCreationSiteId = siteId;
     const initialData = {
       title: title,
       startingPath: 'https://',
@@ -265,12 +267,14 @@ export default class UxtestingStore {
       const statsPr = this.client.fetchTestStats(testId);
       const taskStatsPr = this.client.fetchTestTaskStats(testId);
       const sessionsPr = this.client.fetchTestSessions(testId, this.testSessions.page, 10);
-      Promise.allSettled([testPr, statsPr, taskStatsPr, sessionsPr]).then((results) => {
+      return Promise.allSettled([testPr, statsPr, taskStatsPr, sessionsPr]).then((results) => {
         if (results[0].status === 'fulfilled') {
           const test = results[0].value;
           if (test) {
             this.setInstance(new UxTestInst(test));
           }
+        } else {
+          throw 'Test not found'
         }
         if (results[1].status === 'fulfilled') {
           const stats = results[1].value;
@@ -295,9 +299,10 @@ export default class UxtestingStore {
             this.setTestSessions(result);
           }
         }
-      });
+      }).then(() => true)
     } catch (e) {
       console.error(e);
+      return false;
     } finally {
       this.setLoading(false);
     }

tracker/tracker/src/main/modules/userTesting/index.ts

@@ -264,6 +264,7 @@ export default class UserTestManager {
       this.userRecorder.discard()
       void this.signalTest('skipped')
       document.body.removeChild(this.bg)
+      window.close()
     }
     if (!inProgress) {
       this.hideTaskSection()