feat: 統計結果出力

src/App.tsx

@@ -10,7 +10,7 @@ import { DefaultLayout } from './layouts/default'
 import { RequireAuth } from './components/atoms/RequireAuth'
 import { SignIn } from './pages/signin'
 import { OpenAPI } from './apis/analysis'
-import { GamesIndex } from './pages/games'
+import { StatisticsIndex } from './pages/statistics'
 
 const SentryRoutes = Sentry.withSentryReactRouterV6Routing(Routes)
 
@@ -33,7 +33,7 @@ function App() {
                 index
                 element={
                   <RequireAuth redirect="/signin">
-                    <GamesIndex />
+                    <StatisticsIndex />
                   </RequireAuth>
                 }
               />

src/apis/analysis/index.ts

@@ -7,13 +7,19 @@ export { CancelablePromise, CancelError } from './core/CancelablePromise';
 export { OpenAPI } from './core/OpenAPI';
 export type { OpenAPIConfig } from './core/OpenAPI';
 
+export type { AverageScore } from './models/AverageScore';
+export type { Dataset } from './models/Dataset';
 export type { Element_int_ } from './models/Element_int_';
 export type { Game } from './models/Game';
 export type { GenericList_int_ } from './models/GenericList_int_';
 export type { HTTPValidationError } from './models/HTTPValidationError';
 export type { Kyoku } from './models/Kyoku';
+export type { NagareCount } from './models/NagareCount';
 export type { ValidationError } from './models/ValidationError';
+export type { YakuCount } from './models/YakuCount';
 
+export { DatasetsService } from './services/DatasetsService';
 export { DefaultService } from './services/DefaultService';
 export { GamesService } from './services/GamesService';
 export { KyokusService } from './services/KyokusService';
+export { StatisticsService } from './services/StatisticsService';

src/apis/analysis/models/AverageScore.ts

@@ -0,0 +1,11 @@
+/* generated using openapi-typescript-codegen -- do no edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+export type AverageScore = {
+    player_name: string;
+    score: number;
+    point: number;
+    game_count: number;
+};
+

src/apis/analysis/models/Dataset.ts

@@ -0,0 +1,9 @@
+/* generated using openapi-typescript-codegen -- do no edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+export type Dataset = {
+    id: string;
+    friendly_name: (string | null);
+};
+

src/apis/analysis/models/NagareCount.ts

@@ -0,0 +1,9 @@
+/* generated using openapi-typescript-codegen -- do no edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+export type NagareCount = {
+    name: string;
+    count: number;
+};
+

src/apis/analysis/models/YakuCount.ts

@@ -0,0 +1,10 @@
+/* generated using openapi-typescript-codegen -- do no edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+export type YakuCount = {
+    name: string;
+    han_count: number;
+    count: number;
+};
+

src/apis/analysis/services/DatasetsService.ts

@@ -0,0 +1,21 @@
+/* generated using openapi-typescript-codegen -- do no edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+import type { Dataset } from '../models/Dataset';
+import type { CancelablePromise } from '../core/CancelablePromise';
+import { OpenAPI } from '../core/OpenAPI';
+import { request as __request } from '../core/request';
+export class DatasetsService {
+    /**
+     * Get Datasets
+     * @returns Dataset Successful Response
+     * @throws ApiError
+     */
+    public static getDatasetsDatasetsGet(): CancelablePromise<Array<Dataset>> {
+        return __request(OpenAPI, {
+            method: 'GET',
+            url: '/datasets',
+        });
+    }
+}

src/apis/analysis/services/StatisticsService.ts

@@ -0,0 +1,90 @@
+/* generated using openapi-typescript-codegen -- do no edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+import type { AverageScore } from '../models/AverageScore';
+import type { NagareCount } from '../models/NagareCount';
+import type { YakuCount } from '../models/YakuCount';
+import type { CancelablePromise } from '../core/CancelablePromise';
+import { OpenAPI } from '../core/OpenAPI';
+import { request as __request } from '../core/request';
+export class StatisticsService {
+    /**
+     * Get Average Score By Player
+     * @param datasetId
+     * @param startDate
+     * @param endDate
+     * @returns AverageScore Successful Response
+     * @throws ApiError
+     */
+    public static getAverageScoreByPlayerStatisticsAverageScoreByPlayerGet(
+        datasetId: string,
+        startDate: string,
+        endDate: string,
+    ): CancelablePromise<Array<AverageScore>> {
+        return __request(OpenAPI, {
+            method: 'GET',
+            url: '/statistics/average_score_by_player',
+            query: {
+                'dataset_id': datasetId,
+                'start_date': startDate,
+                'end_date': endDate,
+            },
+            errors: {
+                422: `Validation Error`,
+            },
+        });
+    }
+    /**
+     * Get Yaku Count
+     * @param datasetId
+     * @param startDate
+     * @param endDate
+     * @returns YakuCount Successful Response
+     * @throws ApiError
+     */
+    public static getYakuCountStatisticsYakuCountGet(
+        datasetId: string,
+        startDate: string,
+        endDate: string,
+    ): CancelablePromise<Array<YakuCount>> {
+        return __request(OpenAPI, {
+            method: 'GET',
+            url: '/statistics/yaku_count',
+            query: {
+                'dataset_id': datasetId,
+                'start_date': startDate,
+                'end_date': endDate,
+            },
+            errors: {
+                422: `Validation Error`,
+            },
+        });
+    }
+    /**
+     * Get Nagare Count
+     * @param datasetId
+     * @param startDate
+     * @param endDate
+     * @returns NagareCount Successful Response
+     * @throws ApiError
+     */
+    public static getNagareCountStatisticsNagareCountGet(
+        datasetId: string,
+        startDate: string,
+        endDate: string,
+    ): CancelablePromise<Array<NagareCount>> {
+        return __request(OpenAPI, {
+            method: 'GET',
+            url: '/statistics/nagare_count',
+            query: {
+                'dataset_id': datasetId,
+                'start_date': startDate,
+                'end_date': endDate,
+            },
+            errors: {
+                422: `Validation Error`,
+            },
+        });
+    }
+}

src/hooks/swr/dataset/index.ts

@@ -0,0 +1,11 @@
+import useSWR, { SWRConfiguration } from 'swr'
+import { DatasetsService } from '../../../apis/analysis'
+import { useAPIToken } from '../../common/useToken'
+
+export const useDatasets = (config?: Partial<SWRConfiguration>) => {
+  const { data: token } = useAPIToken()
+
+  return useSWR(['datasets', token], DatasetsService.getDatasetsDatasetsGet, {
+    ...config,
+  })
+}

src/hooks/swr/statistics/index.ts

@@ -0,0 +1,38 @@
+import { StatisticsService } from '../../../apis/analysis'
+
+// hooksじゃないので本来ここに置くのはおかしいが、あとで移動する
+export const getAverageScoreByPlayer = async (
+  datasetId: string,
+  startDate: string,
+  endDate: string
+) => {
+  return await StatisticsService.getAverageScoreByPlayerStatisticsAverageScoreByPlayerGet(
+    datasetId,
+    startDate,
+    endDate
+  )
+}
+
+export const getYakuCount = async (
+  datasetId: string,
+  startDate: string,
+  endDate: string
+) => {
+  return await StatisticsService.getYakuCountStatisticsYakuCountGet(
+    datasetId,
+    startDate,
+    endDate
+  )
+}
+
+export const getNagareCount = async (
+  datasetId: string,
+  startDate: string,
+  endDate: string
+) => {
+  return await StatisticsService.getNagareCountStatisticsNagareCountGet(
+    datasetId,
+    startDate,
+    endDate
+  )
+}

src/pages/games/index.tsx

@@ -10,14 +10,15 @@ import {
   Stack,
   Table,
   TableBody,
-  TableCell,
   TableContainer,
   TableRow,
 } from '@mui/material'
 import { useGames } from '../../hooks/swr/games'
 import { JsonViewer } from '@textea/json-viewer'
+import { useDatasets } from '../../hooks/swr/dataset'
 
 export const GamesIndex = () => {
+  const { data: datasets } = useDatasets()
   const [startDate, setStartDate] = useState<Dayjs | null>(
     dayjs().subtract(1, 'day')
   )
@@ -47,8 +48,9 @@ export const GamesIndex = () => {
             value={datasetId}
             onChange={handleChangeDatasetId}
           >
-            <MenuItem value="mahjong_etl_tenhou">天鳳牌譜</MenuItem>
-            <MenuItem value="mahjong_etl_soloplay">ソロプレイ牌譜</MenuItem>
+            {datasets?.map((dataset) => (
+              <MenuItem value={dataset.id}>{dataset.friendly_name}</MenuItem>
+            ))}
           </Select>
           <LocalizationProvider dateAdapter={AdapterDayjs}>
             <DatePicker

src/pages/statistics/index.tsx

@@ -0,0 +1,116 @@
+import dayjs, { Dayjs } from 'dayjs'
+import { DatePicker, LocalizationProvider } from '@mui/x-date-pickers'
+import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'
+import { useState } from 'react'
+import Grid from '@mui/material/Unstable_Grid2'
+import {
+  Button,
+  MenuItem,
+  Select,
+  SelectChangeEvent,
+  Stack,
+  Table,
+  TableBody,
+  TableContainer,
+  TableRow,
+} from '@mui/material'
+import { JsonViewer } from '@textea/json-viewer'
+import { useDatasets } from '../../hooks/swr/dataset'
+import {
+  getAverageScoreByPlayer,
+  getNagareCount,
+  getYakuCount,
+} from '../../hooks/swr/statistics'
+
+export const StatisticsIndex = () => {
+  const { data: datasets } = useDatasets()
+  const [startDate, setStartDate] = useState<Dayjs | null>(
+    dayjs().subtract(1, 'day')
+  )
+  const [endDate, setEndDate] = useState<Dayjs | null>(
+    dayjs().subtract(1, 'day')
+  )
+  const [datasetId, setDatasetId] = useState<string>('')
+
+  const handleChangeDatasetId = (event: SelectChangeEvent) => {
+    setDatasetId(event.target.value as string)
+  }
+
+  const [result, setResult] = useState<unknown[] | null>(null)
+
+  const handleGetAverageScoreByPlayer = async () => {
+    const response = await getAverageScoreByPlayer(
+      datasetId,
+      startDate?.format('YYYY-MM-DD') ?? '',
+      endDate?.format('YYYY-MM-DD') ?? ''
+    )
+    setResult(response)
+  }
+
+  const handleGetYakuCount = async () => {
+    const response = await getYakuCount(
+      datasetId,
+      startDate?.format('YYYY-MM-DD') ?? '',
+      endDate?.format('YYYY-MM-DD') ?? ''
+    )
+    setResult(response)
+  }
+
+  const handleGetNagareCount = async () => {
+    const response = await getNagareCount(
+      datasetId,
+      startDate?.format('YYYY-MM-DD') ?? '',
+      endDate?.format('YYYY-MM-DD') ?? ''
+    )
+    setResult(response)
+  }
+
+  return (
+    <Grid container columnSpacing={2}>
+      <Grid xs={4}>
+        {/* フォームをいれる(のちのちcomponent化) */}
+        <Stack spacing={2} direction="column">
+          <Select
+            labelId="datasetId"
+            id="datasetId"
+            value={datasetId}
+            onChange={handleChangeDatasetId}
+          >
+            {datasets?.map((dataset) => (
+              <MenuItem value={dataset.id}>{dataset.friendly_name}</MenuItem>
+            ))}
+          </Select>
+          <LocalizationProvider dateAdapter={AdapterDayjs}>
+            <DatePicker
+              label="start date"
+              value={startDate}
+              onChange={setStartDate}
+            />
+            <DatePicker
+              label="end date"
+              value={endDate}
+              onChange={setEndDate}
+            />
+          </LocalizationProvider>
+          <Button onClick={handleGetAverageScoreByPlayer}>平均スコア</Button>
+          <Button onClick={handleGetYakuCount}>役統計</Button>
+          <Button onClick={handleGetNagareCount}>流局統計</Button>
+        </Stack>
+      </Grid>
+      <Grid xs={8}>
+        {/* APIの結果表示 */}
+        <TableContainer>
+          <Table>
+            <TableBody>
+              {result?.map((r) => (
+                <TableRow>
+                  <JsonViewer value={r} />
+                </TableRow>
+              ))}
+            </TableBody>
+          </Table>
+        </TableContainer>
+      </Grid>
+    </Grid>
+  )
+}