yellowadmin/pp-tcms
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: view customize on run and runCases pane

Browse Source
This commit is contained in:
Takeshi Kimata
2024-06-08 11:10:36 +09:00
parent 2b5a806aee
commit 37f97f97b5
4 changed files with 60 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
frontend/src/app/[locale]/projects/[projectId]/runs/RunsTable.tsx
View File

@@ -1,4 +1,4 @@
import { useState, useMemo, useCallback } from 'react';
import { useState, useEffect, useMemo } from 'react';
import {
Table,
TableHeader,
@@ -28,6 +28,15 @@ type Props = {
};
export default function RunsTable({ projectId, isDisabled, runs, onDeleteRun, messages, locale }: Props) {
const [disabledKeys, setDisabledKeys] = useState<string[]>([]);
useEffect(() => {
if (isDisabled) {
setDisabledKeys(['delete']);
} else {
setDisabledKeys([]);
}
}, [isDisabled]);
const headerColumns = [
{ name: messages.id, uid: 'id', sortable: true },
{ name: messages.name, uid: 'name', sortable: true },
@@ -54,7 +63,7 @@ export default function RunsTable({ projectId, isDisabled, runs, onDeleteRun, me
return text.length > maxLength ? text.slice(0, maxLength) + '...' : text;
};
const renderCell = useCallback((run: RunType, columnKey: Key) => {
const renderCell = (run: RunType, columnKey: Key) => {
const cellValue = run[columnKey as keyof RunType];
switch (columnKey) {
@@ -83,8 +92,8 @@ export default function RunsTable({ projectId, isDisabled, runs, onDeleteRun, me
<MoreVertical size={16} />
</Button>
</DropdownTrigger>
<DropdownMenu aria-label="run actions">
<DropdownItem className="text-danger" isDisabled={isDisabled} onClick={() => onDeleteRun(run.id)}>
<DropdownMenu aria-label="run actions" disabledKeys={disabledKeys}>
<DropdownItem className="text-danger" key="delete" onClick={() => onDeleteRun(run.id)}>
{messages.deleteRun}
</DropdownItem>
</DropdownMenu>
@@ -93,7 +102,7 @@ export default function RunsTable({ projectId, isDisabled, runs, onDeleteRun, me
default:
return cellValue;
}
}, []);
};
const classNames = useMemo(
() => ({

9
frontend/src/app/[locale]/projects/[projectId]/runs/[runId]/RunEditor.tsx
View File

@@ -221,6 +221,7 @@ export default function RunEditor({ projectId, runId, messages, locale }: Props)
<Button
startContent={<Save size={16} />}
size="sm"
isDisabled={!context.isProjectReporter(Number(projectId))}
color="primary"
isLoading={isUpdating}
onPress={async () => {
@@ -310,7 +311,12 @@ export default function RunEditor({ projectId, runId, messages, locale }: Props)
{(selectedKeys.size > 0 || selectedKeys === 'all') && (
<Dropdown>
<DropdownTrigger>
<Button size="sm" color="primary" endContent={<ChevronDown size={16} />}>
<Button
size="sm"
isDisabled={!context.isProjectReporter(Number(projectId))}
color="primary"
endContent={<ChevronDown size={16} />}
>
{messages.testCaseSelection}
</Button>
</DropdownTrigger>
@@ -351,6 +357,7 @@ export default function RunEditor({ projectId, runId, messages, locale }: Props)
<div className="w-9/12">
<TestCaseSelector
cases={testcases}
isDisabled={!context.isProjectReporter(Number(projectId))}
selectedKeys={selectedKeys}
onSelectionChange={setSelectedKeys}
onStatusChange={handleChangeStatus}

44
frontend/src/app/[locale]/projects/[projectId]/runs/[runId]/TestCaseSelector.tsx
View File

@@ -1,4 +1,4 @@
import { useState, useMemo } from 'react';
import { useState, useEffect, useMemo } from 'react';
import {
Table,
TableHeader,
@@ -31,6 +31,7 @@ import { RunsMessages } from '@/types/run';
type Props = {
cases: CaseType[];
isDisabled: boolean;
selectedKeys: Selection;
onSelectionChange: React.Dispatch<React.SetStateAction<Selection>>;
onStatusChange: (changeCaseId: number, status: number) => {};
@@ -41,6 +42,7 @@ type Props = {
export default function TestCaseSelector({
cases,
isDisabled,
selectedKeys,
onSelectionChange,
onStatusChange,
@@ -56,6 +58,22 @@ export default function TestCaseSelector({
{ name: messages.actions, uid: 'actions' },
];
const [disabledStatusKeys, setDisabledStatusKeys] = useState<string[]>([]);
const [disabledIncludeExcludeKeys, setDisabledIncludeExcludeKeys] = useState<string[]>([]);
useEffect(() => {
if (isDisabled) {
setDisabledStatusKeys(
testRunCaseStatus.map((entry) => {
return entry.uid;
})
);
setDisabledIncludeExcludeKeys(['include', 'exclude']);
} else {
setDisabledStatusKeys([]);
setDisabledIncludeExcludeKeys([]);
}
}, [isDisabled]);
const [sortDescriptor, setSortDescriptor] = useState<SortDescriptor>({
column: 'id',
direction: 'ascending',
@@ -118,10 +136,10 @@ export default function TestCaseSelector({
<span className="w-12">{isIncluded && messages[testRunCaseStatus[cellValue].uid]}</span>
</Button>
</DropdownTrigger>
<DropdownMenu aria-label="test case actions">
<DropdownMenu disabledKeys={disabledStatusKeys} aria-label="test case actions">
{testRunCaseStatus.map((runCaseStatus, index) => (
<DropdownItem
key={index}
key={runCaseStatus.uid}
startContent={renderStatusIcon(runCaseStatus.uid)}
onPress={() => onStatusChange(testCase.id, index)}
>
@@ -139,18 +157,28 @@ export default function TestCaseSelector({
<MoreVertical size={16} />
</Button>
</DropdownTrigger>
<DropdownMenu aria-label="include or exclude actions">
<DropdownMenu disabledKeys={disabledIncludeExcludeKeys} aria-label="include or exclude actions">
<DropdownItem
key="include"
startContent={<CopyPlus size={16} />}
isDisabled={testCase.isIncluded}
onPress={() => onIncludeCase(testCase.id)}
onPress={() => {
if (testCase.isIncluded) {
return;
}
onIncludeCase(testCase.id);
}}
>
{messages.includeInRun}
</DropdownItem>
<DropdownItem
key="exclude"
startContent={<CopyMinus size={16} />}
isDisabled={!testCase.isIncluded}
onPress={() => onExcludeCase(testCase.id)}
onPress={() => {
if (!testCase.isIncluded) {
return;
}
onExcludeCase(testCase.id);
}}
>
{messages.excludeFromRun}
</DropdownItem>