jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui): uxt fixes

Browse source
This commit is contained in:
nick-delirium 2023-12-01 16:27:28 +01:00
parent b5d6d1b5f7
commit 3dedeebdbe
2 changed files with 10 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
frontend/app/components/UsabilityTesting/TestEdit.tsx
View file

@ -54,6 +54,9 @@ function TestEdit() {
setGuidelines(inst.guidelines || ''); setGuidelines(inst.guidelines || '');
} }
}); });
} else {
setConclusion(uxtestingStore.instance!.conclusionMessage)
setGuidelines(uxtestingStore.instance!.guidelines)
} }
}, []); }, []);
if (!uxtestingStore.instance) { if (!uxtestingStore.instance) {

8
frontend/app/components/UsabilityTesting/UsabilityTesting.tsx
View file

@ -1,5 +1,5 @@
import { UxTest, UxTListEntry } from "App/services/UxtestingService";
import React from 'react'; import React from 'react';
import { UxTListEntry } from "App/services/UxtestingService";
import { observer } from 'mobx-react-lite'; import { observer } from 'mobx-react-lite';
import { useStore } from 'App/mstore'; import { useStore } from 'App/mstore';
import { numberWithCommas } from 'App/utils'; import { numberWithCommas } from 'App/utils';
@ -21,6 +21,7 @@ const PER_PAGE = 10;
let debouncedSearch: any = () => null let debouncedSearch: any = () => null
const defaultDescription = `To evaluate the usability of [Feature Name], focusing on user interaction, efficiency, and satisfaction. The aim is to identify any usability issues that users may encounter, understand how they navigate [Feature Name], and gauge the intuitiveness of the workflow.` const defaultDescription = `To evaluate the usability of [Feature Name], focusing on user interaction, efficiency, and satisfaction. The aim is to identify any usability issues that users may encounter, understand how they navigate [Feature Name], and gauge the intuitiveness of the workflow.`
function TestsTable() { function TestsTable() {
const inputRef = React.useRef<HTMLInputElement>(null);
const [newTestTitle, setNewTestTitle] = React.useState(''); const [newTestTitle, setNewTestTitle] = React.useState('');
const [newTestDescription, setNewTestDescription] = React.useState(defaultDescription); const [newTestDescription, setNewTestDescription] = React.useState(defaultDescription);
const [isModalVisible, setIsModalVisible] = React.useState(false); const [isModalVisible, setIsModalVisible] = React.useState(false);
@ -57,6 +58,9 @@ function TestsTable() {
const openModal = () => { const openModal = () => {
setIsModalVisible(true); setIsModalVisible(true);
setTimeout(() => {
inputRef.current?.focus();
}, 10);
}; };
const redirect = (path: string) => { const redirect = (path: string) => {
@ -82,6 +86,8 @@ function TestsTable() {
<Typography.Text strong>Title</Typography.Text> <Typography.Text strong>Title</Typography.Text>
<Input <Input
autoFocus autoFocus
// @ts-ignore
ref={inputRef}
placeholder="E.g. Checkout user journey evaluation" placeholder="E.g. Checkout user journey evaluation"
style={{ marginBottom: '2em' }} style={{ marginBottom: '2em' }}
value={newTestTitle} value={newTestTitle}