Apply i18n

frontend/config/selection.ts

@@ -31,12 +31,12 @@ const automationStatus = [
 const templates = [{ uid: "text" }, { uid: "step" }];
 
 const testRunStatus = [
-  { name: "New", uid: "new" },
+  { uid: "new" },
-  { name: "In progress", uid: "in-progress" },
+  { uid: "inProgress" },
-  { name: "Under review", uid: "under-review" },
+  { uid: "underReview" },
-  { name: "Rejected", uid: "rejected" },
+  { uid: "rejected" },
-  { name: "Done", uid: "done" },
+  { uid: "done" },
-  { name: "Closed", uid: "closed" },
+  { uid: "closed" },
 ];
 
 const testRunCaseStatus = [

frontend/messages/en.json

@@ -100,8 +100,31 @@
     "max_file_size": "Max. file size"
   },
   "Runs": {
+    "runs": "Test Runs",
+    "id": "ID",
+    "name": "Name",
+    "description": "Description",
+    "last_update": "Last update",
+    "actions": "Actions",
+    "new_run": "New Run",
+    "delete_run": "Delete Run",
+    "no_runs_found": "No runs found"
+  },
+  "Run": {
+    "back_to_runs": "Back to test runs",
+    "updating": "Updating...",
+    "update": "Update",
+    "progress": "Progress",
     "id": "ID",
     "title": "Title",
+    "please_enter": "Please enter run name",
+    "description": "Description",
+    "new": "New",
+    "inProgress": "In progress",
+    "underReview": "Under review",
+    "rejected": "Rejected",
+    "done": "Done",
+    "closed": "Closed",
     "priority": "Priority",
     "status": "Status",
     "actions": "Actions",
@@ -114,6 +137,8 @@
     "failed": "Failed",
     "retest": "Retest",
     "skipped": "Skipped",
+    "select_test_case": "Select test cases",
+    "test_case_selection": "Test case selection",
     "include_in_run": "Include in run",
     "exclude_from_run": "Exclude from run",
     "no_cases_found": "No cases found"

frontend/messages/ja.json

@@ -100,8 +100,31 @@
     "max_file_size": "最大ファイルサイズ"
   },
   "Runs": {
+    "runs": "テストラン",
+    "id": "ID",
+    "name": "名前",
+    "description": "詳細",
+    "last_update": "最終更新",
+    "actions": "アクション",
+    "new_run": "新規テストラン",
+    "delete_run": "テストランを削除",
+    "no_runs_found": "テストランがありません"
+  },
+  "Run": {
+    "back_to_runs": "テストラン一覧に戻る",
+    "updating": "更新中...",
+    "update": "更新",
+    "progress": "進捗",
     "id": "ID",
     "title": "タイトル",
+    "description": "詳細",
+    "new": "新規",
+    "inProgress": "進行中",
+    "underReview": "レビュー中",
+    "rejected": "却下",
+    "done": "完了",
+    "closed": "クローズ",
+    "please_enter": "タイトルを入力してください",
     "priority": "優先度",
     "status": "ステータス",
     "actions": "アクション",
@@ -114,6 +137,8 @@
     "failed": "失敗",
     "retest": "再テスト",
     "skipped": "スキップ",
+    "select_test_case": "テストケースを選択",
+    "test_case_selection": "テストケース選択",
     "include_in_run": "テストランに含める",
     "exclude_from_run": "テストランから除外する",
     "no_cases_found": "テストケースが見つかりません"

frontend/src/app/[locale]/projects/[projectId]/runs/RunsPage.tsx

@@ -4,13 +4,15 @@ import { Button } from "@nextui-org/react";
 import { Plus } from "lucide-react";
 import RunsTable from "./RunsTable";
 import { fetchRuns, createRun, deleteRun } from "./runsControl";
+import { RunsMessages } from "@/types/run";
 
 type Props = {
   projectId: string;
   locale: string;
+  messages: RunsMessages;
 };
 
-export default function RunsPage({ projectId, locale }: Props) {
+export default function RunsPage({ projectId, locale, messages }: Props) {
   const [runs, setRuns] = useState([]);
 
   useEffect(() => {
@@ -50,7 +52,7 @@ export default function RunsPage({ projectId, locale }: Props) {
   return (
     <div className="container mx-auto max-w-3xl pt-6 px-6 flex-grow">
       <div className="w-full p-3 flex items-center justify-between">
-        <h3 className="font-bold">Runs</h3>
+        <h3 className="font-bold">{messages.runs}</h3>
         <div>
           <Button
             startContent={<Plus size={16} />}
@@ -58,7 +60,7 @@ export default function RunsPage({ projectId, locale }: Props) {
             color="primary"
             onClick={onCreateClick}
           >
-            New Run
+            {messages.newRun}
           </Button>
         </div>
       </div>
@@ -67,6 +69,7 @@ export default function RunsPage({ projectId, locale }: Props) {
         projectId={projectId}
         runs={runs}
         onDeleteRun={onDeleteClick}
+        messages={messages}
         locale={locale}
       />
     </div>

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

@@ -15,21 +15,14 @@ import {
 } from "@nextui-org/react";
 import { Link, NextUiLinkClasses } from "@/src/navigation";
 import { MoreVertical } from "lucide-react";
-import { RunType } from "@/types/run";
+import { RunsMessages, RunType } from "@/types/run";
 import dayjs from "dayjs";
 
-const headerColumns = [
-  { name: "ID", uid: "id", sortable: true },
-  { name: "Name", uid: "name", sortable: true },
-  { name: "Description", uid: "description", sortable: true },
-  { name: "Last update", uid: "updatedAt", sortable: true },
-  { name: "Actions", uid: "actions" },
-];
-
 type Props = {
   projectId: string;
   runs: RunType[];
   onDeleteRun: (runId: number) => void;
+  messages: RunsMessages;
   locale: string;
 };
 
@@ -37,8 +30,17 @@ export default function RunsTable({
   projectId,
   runs,
   onDeleteRun,
+  messages,
   locale,
 }: Props) {
+  const headerColumns = [
+    { name: messages.id, uid: "id", sortable: true },
+    { name: messages.name, uid: "name", sortable: true },
+    { name: messages.description, uid: "description", sortable: true },
+    { name: messages.lastUpdate, uid: "updatedAt", sortable: true },
+    { name: messages.actions, uid: "actions" },
+  ];
+
   const [sortDescriptor, setSortDescriptor] = useState<SortDescriptor>({
     column: "id",
     direction: "ascending",
@@ -97,7 +99,7 @@ export default function RunsTable({
                 className="text-danger"
                 onClick={() => onDeleteRun(run.id)}
               >
-                Delete run
+                {messages.deleteRun}
               </DropdownItem>
             </DropdownMenu>
           </Dropdown>
@@ -146,7 +148,7 @@ export default function RunsTable({
             </TableColumn>
           )}
         </TableHeader>
-        <TableBody emptyContent={"No runs found"} items={sortedItems}>
+        <TableBody emptyContent={messages.noRunsFound} items={sortedItems}>
           {(item) => (
             <TableRow key={item.id}>
               {(columnKey) => (

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

@@ -35,7 +35,7 @@ import {
   RunCaseType,
   RunCaseInfoType,
   RunStatusCountType,
-  RunsMessages,
+  RunMessages,
 } from "@/types/run";
 import { CaseType } from "@/types/case";
 import { FolderType } from "@/types/folder";
@@ -64,11 +64,16 @@ const defaultTestRun = {
 type Props = {
   projectId: string;
   runId: string;
-  messages: RunsMessages;
+  messages: RunMessages;
   locale: string;
 };
 
-export default function RunEditor({ projectId, runId, messages, locale }: Props) {
+export default function RunEditor({
+  projectId,
+  runId,
+  messages,
+  locale,
+}: Props) {
   const [testRun, setTestRun] = useState<RunType>(defaultTestRun);
   const [folders, setFolders] = useState([]);
   const [runCases, setRunCases] = useState<RunCaseType[]>([]);
@@ -218,7 +223,7 @@ export default function RunEditor({ projectId, runId, messages, locale }: Props)
     <>
       <div className="border-b-1 dark:border-neutral-700 w-full p-3 flex items-center justify-between">
         <div className="flex items-center">
-          <Tooltip content="Back to runs">
+          <Tooltip content={messages.backToRuns}>
             <Button
               isIconOnly
               size="sm"
@@ -243,7 +248,7 @@ export default function RunEditor({ projectId, runId, messages, locale }: Props)
             setIsUpdating(false);
           }}
         >
-          {isUpdating ? "Updating..." : "Update"}
+          {isUpdating ? messages.updating : messages.update}
         </Button>
       </div>
 
@@ -252,7 +257,7 @@ export default function RunEditor({ projectId, runId, messages, locale }: Props)
           <div>
             <div className="w-96 h-72">
               <div className="flex items-center">
-                <h4 className="font-bold">Progress</h4>
+                <h4 className="font-bold">{messages.progress}</h4>
                 <Tooltip content="Refresh">
                   <Button
                     isIconOnly
@@ -273,10 +278,10 @@ export default function RunEditor({ projectId, runId, messages, locale }: Props)
               size="sm"
               type="text"
               variant="bordered"
-              label="Name"
+              label={messages.title}
               value={testRun.name}
               isInvalid={isNameInvalid}
-              errorMessage={isNameInvalid ? "please enter name" : ""}
+              errorMessage={isNameInvalid ? messages.pleaseEnter : ""}
               onChange={(e) => {
                 setTestRun({ ...testRun, name: e.target.value });
               }}
@@ -286,8 +291,7 @@ export default function RunEditor({ projectId, runId, messages, locale }: Props)
             <Textarea
               size="sm"
               variant="bordered"
-              label="Description"
+              label={messages.description}
-              placeholder="Test run description"
               value={testRun.description}
               onValueChange={(changeValue) => {
                 setTestRun({ ...testRun, description: changeValue });
@@ -307,12 +311,12 @@ export default function RunEditor({ projectId, runId, messages, locale }: Props)
                   );
                   setTestRun({ ...testRun, state: index });
                 }}
-                label="status"
+                label={messages.status}
                 className="mt-3 max-w-xs"
               >
-                {testRunStatus.map((state, index) => (
+                {testRunStatus.map((status, index) => (
-                  <SelectItem key={state.uid} value={index}>
+                  <SelectItem key={status.uid} value={index}>
-                    {state.name}
+                    {messages[status.uid]}
                   </SelectItem>
                 ))}
               </Select>
@@ -322,7 +326,7 @@ export default function RunEditor({ projectId, runId, messages, locale }: Props)
 
         <Divider className="my-6" />
         <div className="flex items-center justify-between">
-          <h6 className="h-8 font-bold">Select test cases</h6>
+          <h6 className="h-8 font-bold">{messages.selectTestCase}</h6>
           <div>
             {(selectedKeys.size > 0 || selectedKeys === "all") && (
               <Dropdown>
@@ -332,7 +336,7 @@ export default function RunEditor({ projectId, runId, messages, locale }: Props)
                     color="primary"
                     endContent={<ChevronDown size={16} />}
                   >
-                    Test case selection
+                    {messages.testCaseSelection}
                   </Button>
                 </DropdownTrigger>
                 <DropdownMenu aria-label="test case select actions">

frontend/src/app/[locale]/projects/[projectId]/runs/[runId]/page.tsx

@@ -6,10 +6,22 @@ export default function Page({
 }: {
   params: { projectId: string; runId: string; locale: string };
 }) {
-  const t = useTranslations("Runs");
+  const t = useTranslations("Run");
   const messages = {
+    backToRuns: t("back_to_runs"),
+    updating: t("updating"),
+    update: t("update"),
+    progress: t("progress"),
     id: t("id"),
     title: t("title"),
+    pleaseEnter: t("please_enter"),
+    description: t("description"),
+    new: t("new"),
+    inProgress: t("inProgress"),
+    underReview: t("underReview"),
+    rejected: t("rejected"),
+    done: t("done"),
+    closed: t("closed"),
     priority: t("priority"),
     actions: t("actions"),
     status: t("status"),
@@ -22,6 +34,8 @@ export default function Page({
     failed: t("failed"),
     retest: t("retest"),
     skipped: t("skipped"),
+    selectTestCase: t("select_test_case"),
+    testCaseSelection: t("test_case_selection"),
     includeInRun: t("include_in_run"),
     excludeFromRun: t("exclude_from_run"),
     noCasesFound: t("no_cases_found"),

frontend/src/app/[locale]/projects/[projectId]/runs/page.tsx

@@ -1,13 +1,31 @@
 import RunsPage from "./RunsPage";
+import { useTranslations } from "next-intl";
 
 export default function Page({
   params,
 }: {
   params: { projectId: string; locale: string };
 }) {
+  const t = useTranslations("Runs");
+  const messages = {
+    runs: t("runs"),
+    id: t("id"),
+    name: t("name"),
+    description: t("description"),
+    lastUpdate: t("last_update"),
+    actions: t("actions"),
+    newRun: t("new_run"),
+    deleteRun: t("delete_run"),
+    noRunsFound: t("no_runs_found"),
+  };
+
   return (
     <>
-      <RunsPage projectId={params.projectId} locale={params.locale} />
+      <RunsPage
+        projectId={params.projectId}
+        locale={params.locale}
+        messages={messages}
+      />
     </>
   );
 }

frontend/types/run.ts

@@ -26,9 +26,33 @@ type RunStatusCountType = {
   count: number;
 };
 
-export type RunsMessages = {
+type RunsMessages = {
+  runs: string,
+  id: string;
+  name: string;
+  description: string;
+  lastUpdate: string;
+  actions: string;
+  newRun: string;
+  deleteRun: string;
+  noRunsFound: string;
+};
+
+type RunMessages = {
+  backToRuns: string,
+  updating: string;
+  update: string;
+  progress: string,
   id: string;
   title: string;
+  pleaseEnter: string;
+  description: string;
+  new: string;
+  inProgress: string;
+  underReview: string;
+  rejected: string;
+  done: string;
+  closed: string;
   priority: string;
   status: string;
   actions: string;
@@ -41,6 +65,8 @@ export type RunsMessages = {
   failed: string;
   retest: string;
   skipped: string;
+  selectTestCase: string;
+  testCaseSelection: string;
   includeInRun: string;
   excludeFromRun: string;
   noCasesFound: string;
@@ -52,4 +78,5 @@ export {
   RunCaseInfoType,
   RunStatusCountType,
   RunsMessages,
+  RunMessages,
 };