From 1bab8702396f58a13b8b85ee8e334f7566196ff9 Mon Sep 17 00:00:00 2001
From: Takeshi Kimata <117462761+kimatata@users.noreply.github.com>
Date: Sun, 26 May 2024 21:17:41 +0900
Subject: [PATCH] Create delete run confirm dialog
---
frontend/components/DeleteConfirmDialog.tsx | 34 ++++++++++++++
frontend/messages/en.json | 5 ++-
frontend/messages/ja.json | 23 +++++-----
.../[locale]/projects/ProjectDeleteDialog.tsx | 35 ---------------
.../app/[locale]/projects/ProjectsPage.tsx | 33 +++++++-------
.../projects/[projectId]/runs/RunsPage.tsx | 45 ++++++++++++++++---
.../projects/[projectId]/runs/page.tsx | 3 ++
frontend/types/run.ts | 3 ++
8 files changed, 113 insertions(+), 68 deletions(-)
create mode 100644 frontend/components/DeleteConfirmDialog.tsx
delete mode 100644 frontend/src/app/[locale]/projects/ProjectDeleteDialog.tsx
diff --git a/frontend/components/DeleteConfirmDialog.tsx b/frontend/components/DeleteConfirmDialog.tsx
new file mode 100644
index 0000000..ce2fdb1
--- /dev/null
+++ b/frontend/components/DeleteConfirmDialog.tsx
@@ -0,0 +1,34 @@
+import { Button, Modal, ModalContent, ModalHeader, ModalBody, ModalFooter } from '@nextui-org/react';
+
+type Props = {
+ isOpen: boolean;
+ onCancel: () => void;
+ onConfirm: () => void;
+ closeText: string;
+ confirmText: string;
+ deleteText: string;
+};
+
+export default function ProjectDialog({ isOpen, onCancel, onConfirm, closeText, confirmText, deleteText }: Props) {
+ return (
+ {
+ onCancel();
+ }}
+ >
+
+ {deleteText}
+ {confirmText}
+
+
+
+
+
+
+ );
+}
diff --git a/frontend/messages/en.json b/frontend/messages/en.json
index f368e4c..400e0f9 100644
--- a/frontend/messages/en.json
+++ b/frontend/messages/en.json
@@ -207,7 +207,10 @@
"actions": "Actions",
"new_run": "New Run",
"delete_run": "Delete Run",
- "no_runs_found": "No runs found"
+ "no_runs_found": "No runs found",
+ "close": "Close",
+ "are_you_sure": "Are you sure you want to delete the run?",
+ "delete": "Delete"
},
"Run": {
"back_to_runs": "Back to test runs",
diff --git a/frontend/messages/ja.json b/frontend/messages/ja.json
index 5c4e63e..5d4bf36 100644
--- a/frontend/messages/ja.json
+++ b/frontend/messages/ja.json
@@ -16,7 +16,7 @@
"organize_test_cases": "テストケースを整理とグラフィカルなテスト管理",
"case_edit": "テストケース",
"case_home": "ダッシュボード",
- "case_run": "テスト実行"
+ "case_run": "テストラン"
},
"Header": {
"title": "オープンソーステストケース管理ツール",
@@ -89,12 +89,12 @@
"Project": {
"home": "ホーム",
"test_cases": "テストケース",
- "test_runs": "テストの実行"
+ "test_runs": "テストラン"
},
"Home": {
"Folders": "フォルダー",
"test_cases": "テストケース",
- "test_runs": "テスト実行",
+ "test_runs": "テストラン",
"progress": "進捗",
"untested": "未実行",
"passed": "成功",
@@ -198,18 +198,21 @@
"max_file_size": "最大ファイルサイズ"
},
"Runs": {
- "run_list": "テストの実行一覧",
+ "run_list": "テストラン一覧",
"id": "ID",
"name": "名前",
"description": "詳細",
"last_update": "最終更新",
"actions": "アクション",
- "new_run": "新規テストの実行",
- "delete_run": "テストの実行を削除",
- "no_runs_found": "テストの実行がありません"
+ "new_run": "新規テストラン",
+ "delete_run": "テストランを削除",
+ "no_runs_found": "テストランがありません",
+ "close": "閉じる",
+ "are_you_sure": "テストランを削除してもよろしいですか?",
+ "delete": "削除"
},
"Run": {
- "back_to_runs": "テストの実行一覧に戻る",
+ "back_to_runs": "テストラン一覧に戻る",
"updating": "更新中...",
"update": "更新",
"progress": "進捗",
@@ -238,8 +241,8 @@
"skipped": "スキップ",
"select_test_case": "テストケースを選択",
"test_case_selection": "テストケース選択",
- "include_in_run": "テストの実行に含める",
- "exclude_from_run": "テストの実行から除外する",
+ "include_in_run": "テストランに含める",
+ "exclude_from_run": "テストランから除外する",
"no_cases_found": "テストケースが見つかりません"
}
}
diff --git a/frontend/src/app/[locale]/projects/ProjectDeleteDialog.tsx b/frontend/src/app/[locale]/projects/ProjectDeleteDialog.tsx
deleted file mode 100644
index 43dd5a5..0000000
--- a/frontend/src/app/[locale]/projects/ProjectDeleteDialog.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-'use client';
-import { Button, Modal, ModalContent, ModalHeader, ModalBody, ModalFooter } from '@nextui-org/react';
-import { ProjectsMessages } from '@/types/project';
-
-type Props = {
- isOpen: boolean;
- deleteProjectId: number | null;
- onCancel: () => void;
- onConfirm: (projectId: number | number) => {};
- messages: ProjectsMessages;
-};
-
-export default function ProjectDialog({ isOpen, deleteProjectId, onCancel, onConfirm, messages }: Props) {
- return (
- {
- onCancel();
- }}
- >
-
- {messages.delete}
- {messages.areYouSure}
-
-
-
-
-
-
- );
-}
diff --git a/frontend/src/app/[locale]/projects/ProjectsPage.tsx b/frontend/src/app/[locale]/projects/ProjectsPage.tsx
index ddfadd9..6df4a76 100644
--- a/frontend/src/app/[locale]/projects/ProjectsPage.tsx
+++ b/frontend/src/app/[locale]/projects/ProjectsPage.tsx
@@ -7,7 +7,7 @@ import { ProjectType, ProjectsMessages } from '@/types/project';
import ProjectsTable from './ProjectsTable';
import ProjectDialog from './ProjectDialog';
import { fetchProjects, createProject, updateProject, deleteProject } from './projectsControl';
-import ProjectDeleteDialog from './ProjectDeleteDialog';
+import DeleteConfirmDialog from '@/components/DeleteConfirmDialog';
export type Props = {
messages: ProjectsMessages;
@@ -47,11 +47,11 @@ export default function ProjectsPage({ messages, locale }: Props) {
setEditingProject(null);
};
- // delete dialog
- const [isDeleteProjectDialogOpen, setIsDeleteProjectDialogOpen] = useState(false);
+ // delete confirm dialog
+ const [isDeleteConfirmDialogOpen, setIsDeleteConfirmDialogOpen] = useState(false);
const [deleteProjectId, setDeleteProjectId] = useState(null);
- const closeDeleteDialog = () => {
- setIsDeleteProjectDialogOpen(false);
+ const closeDeleteConfirmDialog = () => {
+ setIsDeleteConfirmDialogOpen(false);
setDeleteProjectId(null);
};
@@ -74,13 +74,15 @@ export default function ProjectsPage({ messages, locale }: Props) {
const onDeleteClick = (projectId: number) => {
setDeleteProjectId(projectId);
- setIsDeleteProjectDialogOpen(true);
+ setIsDeleteConfirmDialogOpen(true);
};
- const onConfirm = async (projectId: number) => {
- await deleteProject(context.token.access_token, projectId);
- setProjects(projects.filter((project) => project.id !== projectId));
- closeDeleteDialog();
+ const onConfirm = async () => {
+ if (deleteProjectId) {
+ await deleteProject(context.token.access_token, deleteProjectId);
+ setProjects(projects.filter((project) => project.id !== deleteProjectId));
+ closeDeleteConfirmDialog();
+ }
};
return (
@@ -110,12 +112,13 @@ export default function ProjectsPage({ messages, locale }: Props) {
messages={messages}
/>
-
);
diff --git a/frontend/src/app/[locale]/projects/[projectId]/runs/RunsPage.tsx b/frontend/src/app/[locale]/projects/[projectId]/runs/RunsPage.tsx
index ae978e9..7c1b9da 100644
--- a/frontend/src/app/[locale]/projects/[projectId]/runs/RunsPage.tsx
+++ b/frontend/src/app/[locale]/projects/[projectId]/runs/RunsPage.tsx
@@ -5,6 +5,7 @@ import { Plus } from 'lucide-react';
import RunsTable from './RunsTable';
import { fetchRuns, createRun, deleteRun } from './runsControl';
import { RunsMessages } from '@/types/run';
+import DeleteConfirmDialog from '@/components/DeleteConfirmDialog';
type Props = {
projectId: string;
@@ -15,6 +16,14 @@ type Props = {
export default function RunsPage({ projectId, locale, messages }: Props) {
const [runs, setRuns] = useState([]);
+ // delete confirm dialog
+ const [isDeleteConfirmDialogOpen, setIsDeleteConfirmDialogOpen] = useState(false);
+ const [deleteRunId, setDeleteRunId] = useState(null);
+ const closeDeleteConfirmDialog = () => {
+ setIsDeleteConfirmDialogOpen(false);
+ setDeleteRunId(null);
+ };
+
useEffect(() => {
async function fetchDataEffect() {
try {
@@ -39,13 +48,26 @@ export default function RunsPage({ projectId, locale, messages }: Props) {
}
};
- const onDeleteClick = async (runId: number) => {
- try {
- await deleteRun(runId);
- const data = await fetchRuns(projectId);
- setRuns(data);
- } catch (error: any) {
- console.error('Error deleting run:', error);
+ // const onDeleteClick = async (runId: number) => {
+ // try {
+ // await deleteRun(runId);
+ // const data = await fetchRuns(projectId);
+ // setRuns(data);
+ // } catch (error: any) {
+ // console.error('Error deleting run:', error);
+ // }
+ // };
+
+ const onDeleteClick = (runId: number) => {
+ setDeleteRunId(runId);
+ setIsDeleteConfirmDialogOpen(true);
+ };
+
+ const onConfirm = async () => {
+ if (deleteRunId) {
+ await deleteRun(deleteRunId);
+ setRuns(runs.filter((run) => run.id !== deleteRunId));
+ closeDeleteConfirmDialog();
}
};
@@ -61,6 +83,15 @@ export default function RunsPage({ projectId, locale, messages }: Props) {
+
+
);
}
diff --git a/frontend/src/app/[locale]/projects/[projectId]/runs/page.tsx b/frontend/src/app/[locale]/projects/[projectId]/runs/page.tsx
index e60ca87..1c5e2e0 100644
--- a/frontend/src/app/[locale]/projects/[projectId]/runs/page.tsx
+++ b/frontend/src/app/[locale]/projects/[projectId]/runs/page.tsx
@@ -13,6 +13,9 @@ export default function Page({ params }: { params: { projectId: string; locale:
newRun: t('new_run'),
deleteRun: t('delete_run'),
noRunsFound: t('no_runs_found'),
+ close: t('close'),
+ areYouSure: t('are_you_sure'),
+ delete: t('delete'),
};
return (
diff --git a/frontend/types/run.ts b/frontend/types/run.ts
index 0d6e225..b7f3191 100644
--- a/frontend/types/run.ts
+++ b/frontend/types/run.ts
@@ -41,6 +41,9 @@ type RunsMessages = {
newRun: string;
deleteRun: string;
noRunsFound: string;
+ close: string;
+ areYouSure: string;
+ delete: string;
};
type RunMessages = {