Introduce prettier

2024-05-19 21:06:49 +09:00
parent 75eeebefda
commit c5ba3b9a00
52 changed files with 884 additions and 1509 deletions
--- a/frontend/src/app/[locale]/projects/[projectId]/home/TestPriorityDonutChart.tsx
+++ b/frontend/src/app/[locale]/projects/[projectId]/home/TestPriorityDonutChart.tsx
@@ -1,10 +1,10 @@
-import React from "react";
-import { useState, useEffect } from "react";
-import dynamic from "next/dynamic";
-import { priorities } from "@/config/selection";
-import { CasePriorityCountType } from "@/types/case";
-import { HomeMessages } from "./page";
-const Chart = dynamic(() => import("react-apexcharts"), { ssr: false });
+import React from 'react';
+import { useState, useEffect } from 'react';
+import dynamic from 'next/dynamic';
+import { priorities } from '@/config/selection';
+import { CasePriorityCountType } from '@/types/case';
+import { HomeMessages } from './page';
+const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });

 type Props = {
  priorityCounts: CasePriorityCountType[];
@@ -12,11 +12,7 @@ type Props = {
  theme: string;
 };

-export default function TestPriorityDonutChart({
-  priorityCounts,
-  messages,
-  theme,
-}: Props) {
+export default function TestPriorityDonutChart({ priorityCounts, messages, theme }: Props) {
  const [chartData, setChartData] = useState({
    series: [],
    options: {
@@ -38,10 +34,10 @@ export default function TestPriorityDonutChart({
        const legend = {
          labels: {
            colors: priorities.map((entry) => {
-              if (theme === "light") {
-                return "black";
+              if (theme === 'light') {
+                return 'black';
              } else {
-                return "white";
+                return 'white';
              }
            }),
          },
@@ -57,13 +53,5 @@ export default function TestPriorityDonutChart({
    updateChartDate();
  }, [priorityCounts, theme]);

-  return (
-    <Chart
-      options={chartData.options}
-      series={chartData.series}
-      type="donut"
-      width={"100%"}
-      height={"100%"}
-    />
-  );
+  return <Chart options={chartData.options} series={chartData.series} type="donut" width={'100%'} height={'100%'} />;
 }
--- a/frontend/src/app/[locale]/projects/[projectId]/home/TestProgressColumnChart.tsx
+++ b/frontend/src/app/[locale]/projects/[projectId]/home/TestProgressColumnChart.tsx
@@ -1,9 +1,9 @@
-import React from "react";
-import { useState, useEffect } from "react";
-import dynamic from "next/dynamic";
-import { ProgressSeriesType } from "@/types/run";
-import { testRunCaseStatus } from "@/config/selection";
-const Chart = dynamic(() => import("react-apexcharts"), { ssr: false });
+import React from 'react';
+import { useState, useEffect } from 'react';
+import dynamic from 'next/dynamic';
+import { ProgressSeriesType } from '@/types/run';
+import { testRunCaseStatus } from '@/config/selection';
+const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });

 type Props = {
  progressSeries: ProgressSeriesType[];
@@ -11,11 +11,7 @@ type Props = {
  theme: string;
 };

-export default function TestProgressBarChart({
-  progressSeries,
-  progressCategories,
-  theme,
-}: Props) {
+export default function TestProgressBarChart({ progressSeries, progressCategories, theme }: Props) {
  const [chartData, setChartData] = useState({
    series: [],
    options: {
@@ -28,14 +24,14 @@ export default function TestProgressBarChart({
    const updateChartDate = () => {
      if (progressSeries) {
        const legendsLabelColors = testRunCaseStatus.map((itr) => {
-          if (theme === "light") {
-            return "black";
+          if (theme === 'light') {
+            return 'black';
          } else {
-            return "white";
+            return 'white';
          }
        });

-        const xaxisLabelColor = theme === "light" ? "black" : "white";
+        const xaxisLabelColor = theme === 'light' ? 'black' : 'white';

        setChartData({
          series: progressSeries,
@@ -47,7 +43,7 @@ export default function TestProgressBarChart({
              stacked: true,
            },
            legend: {
-              position: "right",
+              position: 'right',
              labels: {
                colors: legendsLabelColors,
              },
@@ -56,7 +52,7 @@ export default function TestProgressBarChart({
              return itr.chartColor;
            }),
            xaxis: {
-              type: "datetime",
+              type: 'datetime',
              categories: progressCategories,
              labels: {
                style: {
@@ -75,13 +71,5 @@ export default function TestProgressBarChart({
    updateChartDate();
  }, [progressSeries, progressCategories, theme]);

-  return (
-    <Chart
-      options={chartData.options}
-      series={chartData.series}
-      type="bar"
-      width={"100%"}
-      height={"100%"}
-    />
-  );
+  return <Chart options={chartData.options} series={chartData.series} type="bar" width={'100%'} height={'100%'} />;
 }
--- a/frontend/src/app/[locale]/projects/[projectId]/home/TestTypesDonutChart.tsx
+++ b/frontend/src/app/[locale]/projects/[projectId]/home/TestTypesDonutChart.tsx
@@ -1,10 +1,10 @@
-import React from "react";
-import { useState, useEffect } from "react";
-import dynamic from "next/dynamic";
-import { testTypes } from "@/config/selection";
-import { CaseTypeCountType } from "@/types/case";
-import { HomeMessages } from "./page";
-const Chart = dynamic(() => import("react-apexcharts"), { ssr: false });
+import React from 'react';
+import { useState, useEffect } from 'react';
+import dynamic from 'next/dynamic';
+import { testTypes } from '@/config/selection';
+import { CaseTypeCountType } from '@/types/case';
+import { HomeMessages } from './page';
+const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });

 type Props = {
  typesCounts: CaseTypeCountType[];
@@ -12,11 +12,7 @@ type Props = {
  theme: string;
 };

-export default function TestTypesDonutChart({
-  typesCounts,
-  messages,
-  theme,
-}: Props) {
+export default function TestTypesDonutChart({ typesCounts, messages, theme }: Props) {
  const [chartData, setChartData] = useState({
    series: [],
    options: {
@@ -38,10 +34,10 @@ export default function TestTypesDonutChart({
        const legend = {
          labels: {
            colors: testTypes.map((entry) => {
-              if (theme === "light") {
-                return "black";
+              if (theme === 'light') {
+                return 'black';
              } else {
-                return "white";
+                return 'white';
              }
            }),
          },
@@ -57,13 +53,5 @@ export default function TestTypesDonutChart({
    updateChartDate();
  }, [typesCounts, theme]);

-  return (
-    <Chart
-      options={chartData.options}
-      series={chartData.series}
-      type="donut"
-      width={"100%"}
-      height={"100%"}
-    />
-  );
+  return <Chart options={chartData.options} series={chartData.series} type="donut" width={'100%'} height={'100%'} />;
 }
--- a/frontend/src/app/[locale]/projects/[projectId]/home/home.tsx
+++ b/frontend/src/app/[locale]/projects/[projectId]/home/home.tsx
@@ -1,31 +1,26 @@
-"use client";
-import { useState, useEffect } from "react";
-import { Divider } from "@nextui-org/react";
-import { title, subtitle } from "@/components/primitives";
-import { Card, CardBody, Chip } from "@nextui-org/react";
-import { Folder, Clipboard, FlaskConical } from "lucide-react";
-import { CaseTypeCountType, CasePriorityCountType } from "@/types/case";
-import { ProgressSeriesType } from "@/types/run";
-import { HomeMessages } from "./page";
-import {
-  aggregateBasicInfo,
-  aggregateTestPriority,
-  aggregateTestType,
-  aggregateProgress,
-} from "./aggregate";
-import TestTypesChart from "./TestTypesDonutChart";
-import TestPriorityChart from "./TestPriorityDonutChart";
-import TestProgressBarChart from "./TestProgressColumnChart";
-import Config from "@/config/config";
-import { useTheme } from "next-themes";
+'use client';
+import { useState, useEffect } from 'react';
+import { Divider } from '@nextui-org/react';
+import { title, subtitle } from '@/components/primitives';
+import { Card, CardBody, Chip } from '@nextui-org/react';
+import { Folder, Clipboard, FlaskConical } from 'lucide-react';
+import { CaseTypeCountType, CasePriorityCountType } from '@/types/case';
+import { ProgressSeriesType } from '@/types/run';
+import { HomeMessages } from './page';
+import { aggregateBasicInfo, aggregateTestPriority, aggregateTestType, aggregateProgress } from './aggregate';
+import TestTypesChart from './TestTypesDonutChart';
+import TestPriorityChart from './TestPriorityDonutChart';
+import TestProgressBarChart from './TestProgressColumnChart';
+import Config from '@/config/config';
+import { useTheme } from 'next-themes';
 const apiServer = Config.apiServer;

 async function fetchProject(url) {
  try {
    const response = await fetch(url, {
-      method: "GET",
+      method: 'GET',
      headers: {
-        "Content-Type": "application/json",
+        'Content-Type': 'application/json',
      },
    });

@@ -36,7 +31,7 @@ async function fetchProject(url) {
    const data = await response.json();
    return data;
  } catch (error: any) {
-    console.error("Error fetching data:", error.message);
+    console.error('Error fetching data:', error.message);
  }
 }

@@ -48,8 +43,8 @@ type Props = {
 export function Home({ projectId, messages }: Props) {
  const { theme, setTheme } = useTheme();
  const [project, setProject] = useState({
-    name: "",
-    detail: "",
+    name: '',
+    detail: '',
    Folders: [{ Cases: [] }],
    Runs: [{ RunCases: [] }],
  });
@@ -57,8 +52,7 @@ export function Home({ projectId, messages }: Props) {
  const [caseNum, setCaseNum] = useState(0);
  const [runNum, setRunNum] = useState(0);
  const [typesCounts, setTypesCounts] = useState<CaseTypeCountType[]>();
-  const [priorityCounts, setPriorityCounts] =
-    useState<CasePriorityCountType[]>();
+  const [priorityCounts, setPriorityCounts] = useState<CasePriorityCountType[]>();
  const [progressCategories, setProgressCategories] = useState<string[]>();
  const [progressSeries, setProgressSeries] = useState<ProgressSeriesType[]>();
  const url = `${apiServer}/home/${projectId}`;
@@ -69,7 +63,7 @@ export function Home({ projectId, messages }: Props) {
        const data = await fetchProject(url);
        setProject(data);
      } catch (error: any) {
-        console.error("Error in effect:", error.message);
+        console.error('Error in effect:', error.message);
      }
    }

@@ -99,68 +93,41 @@ export function Home({ projectId, messages }: Props) {

  return (
    <div className="container mx-auto max-w-5xl pt-6 px-6 flex-grow">
-      <h1 className={title({ size: "sm" })}>{project.name}</h1>
+      <h1 className={title({ size: 'sm' })}>{project.name}</h1>
      <div className="mt-4">
-        <Chip
-          variant="flat"
-          startContent={<Folder size={16} />}
-          className="px-3"
-        >
+        <Chip variant="flat" startContent={<Folder size={16} />} className="px-3">
          {folderNum} {messages.folders}
        </Chip>
-        <Chip
-          variant="flat"
-          startContent={<Clipboard size={16} />}
-          className="px-3 ms-2"
-        >
+        <Chip variant="flat" startContent={<Clipboard size={16} />} className="px-3 ms-2">
          {caseNum} {messages.testCases}
        </Chip>
-        <Chip
-          variant="flat"
-          startContent={<FlaskConical size={16} />}
-          className="px-3 ms-2"
-        >
+        <Chip variant="flat" startContent={<FlaskConical size={16} />} className="px-3 ms-2">
          {runNum} {messages.testRuns}
        </Chip>
      </div>

      {project.detail && (
-        <Card
-          className="mt-3 bg-neutral-100 dark:bg-neutral-700 dark:text-white"
-          shadow="none"
-        >
+        <Card className="mt-3 bg-neutral-100 dark:bg-neutral-700 dark:text-white" shadow="none">
          <CardBody>{project.detail}</CardBody>
        </Card>
      )}

      <Divider className="my-8" />
      <h2 className={subtitle()}>{messages.progress}</h2>
-      <div style={{ height: "18rem" }}>
-        <TestProgressBarChart
-          progressSeries={progressSeries}
-          progressCategories={progressCategories}
-          theme={theme}
-        />
+      <div style={{ height: '18rem' }}>
+        <TestProgressBarChart progressSeries={progressSeries} progressCategories={progressCategories} theme={theme} />
      </div>

      <Divider className="my-12" />
      <h2 className={subtitle()}>{messages.testClassification}</h2>
      <div className="flex pb-20">
-        <div style={{ width: "32rem", height: "18rem" }}>
+        <div style={{ width: '32rem', height: '18rem' }}>
          <h3>{messages.byType}</h3>
-          <TestTypesChart
-            typesCounts={typesCounts}
-            messages={messages}
-            theme={theme}
-          />
+          <TestTypesChart typesCounts={typesCounts} messages={messages} theme={theme} />
        </div>
-        <div style={{ width: "30rem", height: "18rem" }}>
+        <div style={{ width: '30rem', height: '18rem' }}>
          <h3>{messages.byPriority}</h3>
-          <TestPriorityChart
-            priorityCounts={priorityCounts}
-            messages={messages}
-            theme={theme}
-          />
+          <TestPriorityChart priorityCounts={priorityCounts} messages={messages} theme={theme} />
        </div>
      </div>
    </div>
--- a/frontend/src/app/[locale]/projects/[projectId]/home/page.tsx
+++ b/frontend/src/app/[locale]/projects/[projectId]/home/page.tsx
@@ -1,5 +1,5 @@
-import { Home } from "./home";
-import { useTranslations } from "next-intl";
+import { Home } from './home';
+import { useTranslations } from 'next-intl';

 export type HomeMessages = {
  folders: string;
@@ -35,37 +35,37 @@ export type HomeMessages = {
 };

 export default function Page({ params }: { params: { projectId: string } }) {
-  const t = useTranslations("Home");
+  const t = useTranslations('Home');
  const messages = {
-    folders: t("Folders"),
-    testCases: t("test_cases"),
-    testRuns: t("test_runs"),
-    progress: t("progress"),
-    untested: t("untested"),
-    passed: t("passed"),
-    failed: t("failed"),
-    retest: t("retest"),
-    skipped: t("skipped"),
-    testClassification: t("test_classification"),
-    byType: t("by_type"),
-    byPriority: t("by_priority"),
-    other: t("other"),
-    security: t("security"),
-    performance: t("performance"),
-    accessibility: t("accessibility"),
-    functional: t("functional"),
-    acceptance: t("acceptance"),
-    usability: t("usability"),
-    smokeSanity: t("smoke_sanity"),
-    compatibility: t("compatibility"),
-    destructive: t("destructive"),
-    regression: t("regression"),
-    automated: t("automated"),
-    manual: t("manual"),
-    critical: t("critical"),
-    high: t("high"),
-    medium: t("medium"),
-    low: t("low"),
+    folders: t('Folders'),
+    testCases: t('test_cases'),
+    testRuns: t('test_runs'),
+    progress: t('progress'),
+    untested: t('untested'),
+    passed: t('passed'),
+    failed: t('failed'),
+    retest: t('retest'),
+    skipped: t('skipped'),
+    testClassification: t('test_classification'),
+    byType: t('by_type'),
+    byPriority: t('by_priority'),
+    other: t('other'),
+    security: t('security'),
+    performance: t('performance'),
+    accessibility: t('accessibility'),
+    functional: t('functional'),
+    acceptance: t('acceptance'),
+    usability: t('usability'),
+    smokeSanity: t('smoke_sanity'),
+    compatibility: t('compatibility'),
+    destructive: t('destructive'),
+    regression: t('regression'),
+    automated: t('automated'),
+    manual: t('manual'),
+    critical: t('critical'),
+    high: t('high'),
+    medium: t('medium'),
+    low: t('low'),
  };
  return (
    <>