From 07e84febf975c8db5b14e5100402c29a19455637 Mon Sep 17 00:00:00 2001 From: araaki12345 <74499464+araaki12345@users.noreply.github.com> Date: Thu, 4 Apr 2024 19:11:02 +0900 Subject: [PATCH 01/13] =?UTF-8?q?feat:api=E3=81=8B=E3=82=89=E3=83=A9?= =?UTF-8?q?=E3=83=B3=E3=82=AD=E3=83=B3=E3=82=B0=E3=81=AE=E5=AE=9F=E3=83=87?= =?UTF-8?q?=E3=83=BC=E3=82=BF=E3=82=92=E8=AA=AD=E3=81=BF=E8=BE=BC=E3=82=80?= =?UTF-8?q?=E6=A9=9F=E8=83=BD=E3=82=92=E5=AE=9F=E8=A3=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/organism/RankingTabs.tsx | 98 +++++++++++-------- 1 file changed, 58 insertions(+), 40 deletions(-) diff --git a/typing-app/src/components/organism/RankingTabs.tsx b/typing-app/src/components/organism/RankingTabs.tsx index b5aaea83..4f50b61b 100644 --- a/typing-app/src/components/organism/RankingTabs.tsx +++ b/typing-app/src/components/organism/RankingTabs.tsx @@ -5,48 +5,76 @@ import { Pagination } from "../molecules/Pagination"; //import { CustomButton } from "../atoms/CustomButton"; import RefreshButton from "../atoms/RefreshButton"; import { useEffect, useState } from "react"; -// import { client } from "@/libs/api"; +import { client } from "@/libs/api"; +//import { error } from "console"; + +export interface User { + id: string; + studentNumber: string; + handleName: string; +} + +export interface ScoreRanking { + rank: number; + user: User; + keystrokes: number; + accuracy: number; + createdAt: Date; +} const RankingTabs = () => { - const [scoreRankings, setScoreRankings] = useState(demoAccuracyRankings); + const [scoreRankings, setScoreRankings] = useState([]); const [rankingStartFrom, setRankingStartFrom] = useState(0); const [sortBy, setSortBy] = useState<"accuracy" | "keystrokes">("accuracy"); + const [isLoading, setIsLoading] = useState(false); + const [error, setError] = useState(null); const LIMIT = 10; - const MAXIMUM = 100; // TODO: MAXIMUMをAPIから取得する + + const fetchData = async () => { + setIsLoading(true); + try { + // APIからデータを取得するためのパラメータを含むGETリクエスト + const { data, error } = await client.GET("/scores/ranking", { + params: { + sort_by: sortBy, + start: rankingStartFrom, + limit: LIMIT, + }, + }); + if (error) { + setError("データの取得中にエラーが発生しました。"); + } else { + setScoreRankings(data.rankings); + } + } catch (err) { + setError("データの取得中に予期せぬエラーが発生しました。"); + } finally { + setIsLoading(false); + } + }; useEffect(() => { // ページが読み込まれたときにデータを取得 fetchData(); - }); + }, [sortBy, rankingStartFrom]); const handleTabChange = (index: number) => { - if (index === 0) { - setSortBy("accuracy"); - } else if (index === 1) { - setSortBy("keystrokes"); - } - - fetchData; + const sortOption = index === 0 ? "accuracy" : "keystrokes"; + setSortBy(sortOption); + fetchData(); }; // 演算子を引数にとる、ボタンを押したときのハンドラ関数 const handlePaginationClick = (direction: "next" | "prev") => { - const newStartFrom = - direction === "prev" ? Math.max(rankingStartFrom - LIMIT, 0) : Math.min(rankingStartFrom + LIMIT, MAXIMUM); + const newStartFrom = direction === "prev" ? Math.max(rankingStartFrom - LIMIT, 0) : Math.min(rankingStartFrom - LIMIT, 0); setRankingStartFrom(newStartFrom); - - fetchData; + fetchData(); }; - const fetchData = async () => { - // TODO: APIを使ってデータをフェッチ - if (sortBy == "accuracy") { - setScoreRankings(demoAccuracyRankings); - } else if (sortBy == "keystrokes") { - setScoreRankings(demoKeyStrokeRankings); - } - }; + if(error) { + return
Error loading rankings
; + } return ( @@ -60,7 +88,10 @@ const RankingTabs = () => { fetchData()} isDisabled={false} /> - + {error &&
Error: {error}
} + {isLoading ? ( +
Loading...
+ ) : ( @@ -69,6 +100,7 @@ const RankingTabs = () => { + )}
handlePaginationClick("prev")} @@ -82,21 +114,7 @@ const RankingTabs = () => { }; export default RankingTabs; -export interface User { - id: string; - studentNumber: string; - handleName: string; -} - -export interface ScoreRanking { - rank: Number; - user: User; - keystrokes: Number; - accuracy: Number; - createdAt: Date; -} - -const demoUsers: User[] = [ +/*const demoUsers: User[] = [ { id: "1", studentNumber: "70310000", @@ -216,4 +234,4 @@ const demoAccuracyRankings: ScoreRanking[] = [ accuracy: 60, createdAt: new Date(), }, -]; +]; */ From d9713fbb265e4742fbd134fd73ec576e059591d0 Mon Sep 17 00:00:00 2001 From: araaki12345 <74499464+araaki12345@users.noreply.github.com> Date: Thu, 4 Apr 2024 21:38:08 +0900 Subject: [PATCH 02/13] =?UTF-8?q?feat:API=E3=81=8B=E3=82=89=E3=83=87?= =?UTF-8?q?=E3=83=BC=E3=82=BF=E3=82=92=E5=8F=96=E5=BE=97=E3=81=99=E3=82=8B?= =?UTF-8?q?=E6=A9=9F=E8=83=BD=E3=82=92=E5=AE=9F=E8=A3=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- typing-app/src/components/organism/RankingTabs.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/typing-app/src/components/organism/RankingTabs.tsx b/typing-app/src/components/organism/RankingTabs.tsx index 4f50b61b..ecf6a7f5 100644 --- a/typing-app/src/components/organism/RankingTabs.tsx +++ b/typing-app/src/components/organism/RankingTabs.tsx @@ -6,6 +6,7 @@ import { Pagination } from "../molecules/Pagination"; import RefreshButton from "../atoms/RefreshButton"; import { useEffect, useState } from "react"; import { client } from "@/libs/api"; +import {paths} from "@/libs/api/v1"; //import { error } from "console"; export interface User { @@ -36,7 +37,7 @@ const RankingTabs = () => { setIsLoading(true); try { // APIからデータを取得するためのパラメータを含むGETリクエスト - const { data, error } = await client.GET("/scores/ranking", { + const { data, error } = await client.GET("/scores/ranking", { params: { sort_by: sortBy, start: rankingStartFrom, From 2400837bfc4b6a851a721df25e7f2ad10a93e217 Mon Sep 17 00:00:00 2001 From: araaki12345 <74499464+araaki12345@users.noreply.github.com> Date: Fri, 5 Apr 2024 00:00:28 +0900 Subject: [PATCH 03/13] =?UTF-8?q?style:=E3=82=B3=E3=83=BC=E3=83=89?= =?UTF-8?q?=E3=81=AE=E6=95=B4=E5=BD=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/organism/RankingTabs.tsx | 38 +++++++++++-------- 1 file changed, 22 insertions(+), 16 deletions(-) diff --git a/typing-app/src/components/organism/RankingTabs.tsx b/typing-app/src/components/organism/RankingTabs.tsx index ecf6a7f5..574c83cb 100644 --- a/typing-app/src/components/organism/RankingTabs.tsx +++ b/typing-app/src/components/organism/RankingTabs.tsx @@ -6,7 +6,7 @@ import { Pagination } from "../molecules/Pagination"; import RefreshButton from "../atoms/RefreshButton"; import { useEffect, useState } from "react"; import { client } from "@/libs/api"; -import {paths} from "@/libs/api/v1"; +import { paths } from "@/libs/api/v1"; //import { error } from "console"; export interface User { @@ -27,12 +27,11 @@ const RankingTabs = () => { const [scoreRankings, setScoreRankings] = useState([]); const [rankingStartFrom, setRankingStartFrom] = useState(0); const [sortBy, setSortBy] = useState<"accuracy" | "keystrokes">("accuracy"); - const [isLoading, setIsLoading] = useState(false); + const [isLoading, setIsLoading] = useState(false); const [error, setError] = useState(null); const LIMIT = 10; const MAXIMUM = 100; // TODO: MAXIMUMをAPIから取得する - const fetchData = async () => { setIsLoading(true); try { @@ -68,13 +67,14 @@ const RankingTabs = () => { // 演算子を引数にとる、ボタンを押したときのハンドラ関数 const handlePaginationClick = (direction: "next" | "prev") => { - const newStartFrom = direction === "prev" ? Math.max(rankingStartFrom - LIMIT, 0) : Math.min(rankingStartFrom - LIMIT, 0); + const newStartFrom = + direction === "prev" ? Math.max(rankingStartFrom - LIMIT, 0) : Math.min(rankingStartFrom - LIMIT, 0); setRankingStartFrom(newStartFrom); fetchData(); }; - if(error) { - return
Error loading rankings
; + if (error) { + return
Error loading rankings
; } return ( @@ -89,18 +89,24 @@ const RankingTabs = () => { fetchData()} isDisabled={false} /> - {error &&
Error: {error}
} + {error && ( +
+ Error: {error} +
+ )} {isLoading ? ( -
Loading...
+
+ Loading... +
) : ( - - - - - - - - + + + + + + + + )}
Date: Fri, 5 Apr 2024 01:03:20 +0900 Subject: [PATCH 04/13] =?UTF-8?q?feat:API=E3=81=8B=E3=82=89=E3=83=87?= =?UTF-8?q?=E3=83=BC=E3=82=BF=E3=82=92=E5=8F=96=E5=BE=97=E3=81=99=E3=82=8B?= =?UTF-8?q?=E3=82=B9=E3=82=AF=E3=83=AA=E3=83=97=E3=83=88=E3=81=AE=E3=83=87?= =?UTF-8?q?=E3=83=90=E3=83=83=E3=82=B0=E6=96=87=E3=82=92=E8=BF=BD=E5=8A=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/organism/RankingTabs.tsx | 23 ++++++++++++------- 1 file changed, 15 insertions(+), 8 deletions(-) diff --git a/typing-app/src/components/organism/RankingTabs.tsx b/typing-app/src/components/organism/RankingTabs.tsx index 574c83cb..7b40bbbd 100644 --- a/typing-app/src/components/organism/RankingTabs.tsx +++ b/typing-app/src/components/organism/RankingTabs.tsx @@ -24,6 +24,7 @@ export interface ScoreRanking { } const RankingTabs = () => { + const [rankings, setRankings] = useState([]); const [scoreRankings, setScoreRankings] = useState([]); const [rankingStartFrom, setRankingStartFrom] = useState(0); const [sortBy, setSortBy] = useState<"accuracy" | "keystrokes">("accuracy"); @@ -36,28 +37,34 @@ const RankingTabs = () => { setIsLoading(true); try { // APIからデータを取得するためのパラメータを含むGETリクエスト - const { data, error } = await client.GET("/scores/ranking", { + const { data, error } = await client.GET("/scores/ranking", { params: { - sort_by: sortBy, - start: rankingStartFrom, - limit: LIMIT, + query: { + startFrom: rankingStartFrom, + limit: LIMIT, + sortBy: sortBy, + }, }, }); - if (error) { - setError("データの取得中にエラーが発生しました。"); + if (error && data) { + setRankings(data); } else { - setScoreRankings(data.rankings); + setError("データの取得中にエラーが発生しました。"); } } catch (err) { + console.log("APIリクエストエラー:", err); setError("データの取得中に予期せぬエラーが発生しました。"); } finally { setIsLoading(false); } }; + useEffect(() => { // ページが読み込まれたときにデータを取得 fetchData(); - }, [sortBy, rankingStartFrom]); + }, []); + if (isLoading) return
Loading...
; + if (error) return
Error: {error}
; const handleTabChange = (index: number) => { const sortOption = index === 0 ? "accuracy" : "keystrokes"; From 7dcee70fee6c6290cc532863118bda8511d2f0f6 Mon Sep 17 00:00:00 2001 From: araaki12345 <74499464+araaki12345@users.noreply.github.com> Date: Fri, 5 Apr 2024 17:55:19 +0900 Subject: [PATCH 05/13] =?UTF-8?q?feat:API=E3=81=8B=E3=82=89=E5=AE=9F?= =?UTF-8?q?=E3=83=87=E3=83=BC=E3=82=BF=E3=82=92=E5=8F=96=E5=BE=97=E3=81=97?= =?UTF-8?q?=E3=80=81=E3=83=A9=E3=83=B3=E3=82=AD=E3=83=B3=E3=82=B0=E3=81=AB?= =?UTF-8?q?=E8=A1=A8=E7=A4=BA=E3=81=99=E3=82=8B=E6=A9=9F=E8=83=BD=E3=82=92?= =?UTF-8?q?=E5=AE=9F=E8=A3=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: かわきん Co-authored-by: KikyoNanakusa --- .../src/components/atoms/RefreshButton.tsx | 6 +- .../components/molecules/RankingTableBody.tsx | 6 +- .../components/molecules/RankingTableRow.tsx | 19 +- .../src/components/organism/RankingTabs.tsx | 245 ++++-------------- typing-server/api/cmd/main.go | 4 +- 5 files changed, 68 insertions(+), 212 deletions(-) diff --git a/typing-app/src/components/atoms/RefreshButton.tsx b/typing-app/src/components/atoms/RefreshButton.tsx index 6f6ad120..3fd399ac 100644 --- a/typing-app/src/components/atoms/RefreshButton.tsx +++ b/typing-app/src/components/atoms/RefreshButton.tsx @@ -8,9 +8,9 @@ const RefreshIcon = () => ( viewBox="0 0 24 24" fill="none" stroke="currentColor" - stroke-width="2" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="2" + strokeLinecap="round" + strokeLinejoin="round" > diff --git a/typing-app/src/components/molecules/RankingTableBody.tsx b/typing-app/src/components/molecules/RankingTableBody.tsx index d8959c7d..ff013dd7 100644 --- a/typing-app/src/components/molecules/RankingTableBody.tsx +++ b/typing-app/src/components/molecules/RankingTableBody.tsx @@ -1,16 +1,16 @@ import { Tbody } from "@chakra-ui/react"; import RankingTableRow from "./RankingTableRow"; -import { ScoreRanking } from "../organism/RankingTabs"; +import { components } from "@/libs/api/v1"; export type RankingTableBodyProps = { - scoreRankings: ScoreRanking[]; + scoreRankings: components["schemas"]["ScoreRanking"][]; }; const RankingTableBody: React.FC = ({ scoreRankings }) => { return ( {scoreRankings.map((scoreRanking) => ( - + ))} ); diff --git a/typing-app/src/components/molecules/RankingTableRow.tsx b/typing-app/src/components/molecules/RankingTableRow.tsx index b45da867..222573a6 100644 --- a/typing-app/src/components/molecules/RankingTableRow.tsx +++ b/typing-app/src/components/molecules/RankingTableRow.tsx @@ -1,23 +1,28 @@ import { Td, Tr } from "@chakra-ui/react"; -import { ScoreRanking } from "../organism/RankingTabs"; +import { components } from "@/libs/api/v1"; -const RankingTableRow: React.FC = (scoreRanking) => { +const RankingTableRow: React.FC = (scoreRanking) => { return ( - + {String(scoreRanking.rank)} - {scoreRanking.user.studentNumber} + {scoreRanking.score?.user?.student_number} - {String(scoreRanking.keystrokes)} + {String(scoreRanking.score?.keystrokes)} - {String(scoreRanking.accuracy)} + {String(scoreRanking.score?.accuracy)} - {scoreRanking.createdAt.toLocaleDateString("ja-JP")} + {scoreRanking.score?.created_at} ); diff --git a/typing-app/src/components/organism/RankingTabs.tsx b/typing-app/src/components/organism/RankingTabs.tsx index 7b40bbbd..3729c191 100644 --- a/typing-app/src/components/organism/RankingTabs.tsx +++ b/typing-app/src/components/organism/RankingTabs.tsx @@ -1,89 +1,65 @@ "use client"; + import { Tabs, TabList, TabPanels, Tab, TabPanel, Flex, Center, Box, Grid } from "@chakra-ui/react"; import RankingTable from "../organism/RankingTable"; import { Pagination } from "../molecules/Pagination"; -//import { CustomButton } from "../atoms/CustomButton"; import RefreshButton from "../atoms/RefreshButton"; import { useEffect, useState } from "react"; import { client } from "@/libs/api"; -import { paths } from "@/libs/api/v1"; -//import { error } from "console"; - -export interface User { - id: string; - studentNumber: string; - handleName: string; -} - -export interface ScoreRanking { - rank: number; - user: User; - keystrokes: number; - accuracy: number; - createdAt: Date; -} +import { components } from "@/libs/api/v1"; const RankingTabs = () => { - const [rankings, setRankings] = useState([]); - const [scoreRankings, setScoreRankings] = useState([]); - const [rankingStartFrom, setRankingStartFrom] = useState(0); + const [scoreRankings, setScoreRankings] = useState([]); + const [rankingStartFrom, setRankingStartFrom] = useState(1); const [sortBy, setSortBy] = useState<"accuracy" | "keystrokes">("accuracy"); - const [isLoading, setIsLoading] = useState(false); - const [error, setError] = useState(null); + const [error, setError] = useState(undefined); + const LIMIT = 10; const MAXIMUM = 100; // TODO: MAXIMUMをAPIから取得する - const fetchData = async () => { - setIsLoading(true); - try { - // APIからデータを取得するためのパラメータを含むGETリクエスト - const { data, error } = await client.GET("/scores/ranking", { - params: { - query: { - startFrom: rankingStartFrom, - limit: LIMIT, - sortBy: sortBy, + useEffect(() => { + const fetchData = async () => { + try { + console.log(sortBy); + console.log(rankingStartFrom); + const { data, error } = await client.GET("/scores/ranking", { + params: { + query: { + sort_by: sortBy, + start: rankingStartFrom, + limit: LIMIT, + }, }, - }, - }); - if (error && data) { - setRankings(data); - } else { - setError("データの取得中にエラーが発生しました。"); + }); + console.log(data); + console.log(error); + if (data) { + setScoreRankings(data); + } else { + setError("データの取得中にエラーが発生しました。"); + } + } catch (err) { + console.log("APIリクエストエラー:", err); + setError("データの取得中に予期せぬエラーが発生しました。"); + } finally { } - } catch (err) { - console.log("APIリクエストエラー:", err); - setError("データの取得中に予期せぬエラーが発生しました。"); - } finally { - setIsLoading(false); - } - }; - - useEffect(() => { - // ページが読み込まれたときにデータを取得 + }; fetchData(); - }, []); - if (isLoading) return
Loading...
; - if (error) return
Error: {error}
; + }, [sortBy, rankingStartFrom]); const handleTabChange = (index: number) => { const sortOption = index === 0 ? "accuracy" : "keystrokes"; setSortBy(sortOption); - fetchData(); }; - // 演算子を引数にとる、ボタンを押したときのハンドラ関数 const handlePaginationClick = (direction: "next" | "prev") => { const newStartFrom = - direction === "prev" ? Math.max(rankingStartFrom - LIMIT, 0) : Math.min(rankingStartFrom - LIMIT, 0); + direction === "prev" + ? Math.max(rankingStartFrom - LIMIT, 0) + : Math.min(rankingStartFrom + LIMIT, MAXIMUM - LIMIT); setRankingStartFrom(newStartFrom); - fetchData(); }; - if (error) { - return
Error loading rankings
; - } - return ( @@ -93,7 +69,7 @@ const RankingTabs = () => { 正打率 入力文字数 - fetchData()} isDisabled={false} /> + {}} isDisabled={false} /> {error && ( @@ -101,151 +77,26 @@ const RankingTabs = () => { Error: {error}
)} - {isLoading ? ( -
- Loading... -
- ) : ( - - - - - - - - - )} + ( + + + + + + + + + )
handlePaginationClick("prev")} onNext={() => handlePaginationClick("next")} - isPrevDisabled={rankingStartFrom <= 0} + isPrevDisabled={rankingStartFrom <= 1} isNextDisabled={rankingStartFrom + LIMIT >= MAXIMUM} />
); }; -export default RankingTabs; - -/*const demoUsers: User[] = [ - { - id: "1", - studentNumber: "70310000", - handleName: "X", - }, - { - id: "2", - studentNumber: "70310000", - handleName: "Y", - }, - { - id: "3", - studentNumber: "70310000", - handleName: "Z", - }, - { - id: "4", - studentNumber: "70310000", - handleName: "A", - }, - { - id: "5", - studentNumber: "70310000", - handleName: "B", - }, -]; -const demoKeyStrokeRankings: ScoreRanking[] = [ - { - rank: 1, - user: { - id: "1", - studentNumber: "70310000", - handleName: "X", - }, - keystrokes: 100, - accuracy: 100, - createdAt: new Date(), - }, - { - rank: 2, - user: { - id: "2", - studentNumber: "70310000", - handleName: "Y", - }, - keystrokes: 90, - accuracy: 90, - createdAt: new Date(), - }, - { - rank: 3, - user: { - id: "3", - studentNumber: "70310000", - handleName: "Z", - }, - keystrokes: 80, - accuracy: 80, - createdAt: new Date(), - }, -]; - -const demoAccuracyRankings: ScoreRanking[] = [ - { - rank: 1, - user: { - id: "1", - studentNumber: "70310000", - handleName: "X", - }, - keystrokes: 100, - accuracy: 100, - createdAt: new Date(), - }, - { - rank: 2, - user: { - id: "2", - studentNumber: "70310000", - handleName: "Y", - }, - keystrokes: 90, - accuracy: 90, - createdAt: new Date(), - }, - { - rank: 3, - user: { - id: "3", - studentNumber: "70310000", - handleName: "Z", - }, - keystrokes: 80, - accuracy: 80, - createdAt: new Date(), - }, - { - rank: 4, - user: { - id: "4", - studentNumber: "70310000", - handleName: "A", - }, - keystrokes: 70, - accuracy: 70, - createdAt: new Date(), - }, - { - rank: 5, - user: { - id: "5", - studentNumber: "70310000", - handleName: "B", - }, - keystrokes: 60, - accuracy: 60, - createdAt: new Date(), - }, -]; */ +export default RankingTabs; diff --git a/typing-server/api/cmd/main.go b/typing-server/api/cmd/main.go index 58265038..7210d23e 100644 --- a/typing-server/api/cmd/main.go +++ b/typing-server/api/cmd/main.go @@ -127,7 +127,7 @@ func main() { func seedData(ctx context.Context, client *ent.Client, logger *slog.Logger) error { // シードデータの作成 - for i := 0; i < 10; i++ { + for i := 0; i < 1000; i++ { studentNumber := fmt.Sprintf("user%d", i+1) handleName := fmt.Sprintf("handle%d", i+1) @@ -152,7 +152,7 @@ func seedData(ctx context.Context, client *ent.Client, logger *slog.Logger) erro var maxKeystrokesScore, maxAccuracyScore *ent.Score - for j := 0; j < 5; j++ { + for j := 0; j < 10; j++ { keystrokes := rand.Intn(200) + 100 accuracy := rand.Float64() From e5b21a61f013379f3a62e6e4fe213e50ecdeaf38 Mon Sep 17 00:00:00 2001 From: araaki12345 <74499464+araaki12345@users.noreply.github.com> Date: Fri, 5 Apr 2024 20:56:08 +0900 Subject: [PATCH 06/13] =?UTF-8?q?chore:main.go=E3=81=AE=E6=95=B0=E5=80=A4?= =?UTF-8?q?=E3=82=92=E5=85=83=E3=81=AB=E6=88=BB=E3=81=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- typing-server/api/cmd/main.go | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/typing-server/api/cmd/main.go b/typing-server/api/cmd/main.go index 7210d23e..58265038 100644 --- a/typing-server/api/cmd/main.go +++ b/typing-server/api/cmd/main.go @@ -127,7 +127,7 @@ func main() { func seedData(ctx context.Context, client *ent.Client, logger *slog.Logger) error { // シードデータの作成 - for i := 0; i < 1000; i++ { + for i := 0; i < 10; i++ { studentNumber := fmt.Sprintf("user%d", i+1) handleName := fmt.Sprintf("handle%d", i+1) @@ -152,7 +152,7 @@ func seedData(ctx context.Context, client *ent.Client, logger *slog.Logger) erro var maxKeystrokesScore, maxAccuracyScore *ent.Score - for j := 0; j < 10; j++ { + for j := 0; j < 5; j++ { keystrokes := rand.Intn(200) + 100 accuracy := rand.Float64() From 17a65179a8385a24d57bbafb6fdd7f528cefa853 Mon Sep 17 00:00:00 2001 From: araaki12345 <74499464+araaki12345@users.noreply.github.com> Date: Fri, 5 Apr 2024 21:06:52 +0900 Subject: [PATCH 07/13] =?UTF-8?q?fix:=20RefreshButton=E3=82=92=E5=8B=95?= =?UTF-8?q?=E3=81=8F=E3=82=88=E3=81=86=E3=81=AB=E4=BF=AE=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/organism/RankingTabs.tsx | 54 +++++++++---------- 1 file changed, 27 insertions(+), 27 deletions(-) diff --git a/typing-app/src/components/organism/RankingTabs.tsx b/typing-app/src/components/organism/RankingTabs.tsx index 3729c191..a55e1d8a 100644 --- a/typing-app/src/components/organism/RankingTabs.tsx +++ b/typing-app/src/components/organism/RankingTabs.tsx @@ -17,33 +17,27 @@ const RankingTabs = () => { const LIMIT = 10; const MAXIMUM = 100; // TODO: MAXIMUMをAPIから取得する - useEffect(() => { - const fetchData = async () => { - try { - console.log(sortBy); - console.log(rankingStartFrom); - const { data, error } = await client.GET("/scores/ranking", { - params: { - query: { - sort_by: sortBy, - start: rankingStartFrom, - limit: LIMIT, - }, + const fetchData = async () => { + try { + const { data, error } = await client.GET("/scores/ranking", { + params: { + query: { + sort_by: sortBy, + start: rankingStartFrom, + limit: LIMIT, }, - }); - console.log(data); - console.log(error); - if (data) { - setScoreRankings(data); - } else { - setError("データの取得中にエラーが発生しました。"); - } - } catch (err) { - console.log("APIリクエストエラー:", err); - setError("データの取得中に予期せぬエラーが発生しました。"); - } finally { + }, + }); + if (data) { + setScoreRankings(data); + } else { + setError("データの取得中にエラーが発生しました。"); } - }; + } catch (err) { + setError("データの取得中に予期せぬエラーが発生しました。"); + } + }; + useEffect(() => { fetchData(); }, [sortBy, rankingStartFrom]); @@ -55,7 +49,7 @@ const RankingTabs = () => { const handlePaginationClick = (direction: "next" | "prev") => { const newStartFrom = direction === "prev" - ? Math.max(rankingStartFrom - LIMIT, 0) + ? Math.max(rankingStartFrom - LIMIT, 1) : Math.min(rankingStartFrom + LIMIT, MAXIMUM - LIMIT); setRankingStartFrom(newStartFrom); }; @@ -69,7 +63,13 @@ const RankingTabs = () => { 正打率 入力文字数 - {}} isDisabled={false} /> + { + setRankingStartFrom(1); + fetchData(); + }} + isDisabled={false} + /> {error && ( From 174e52c9b1de77a5904dd932f8d4c71c0e03f872 Mon Sep 17 00:00:00 2001 From: araaki12345 <74499464+araaki12345@users.noreply.github.com> Date: Fri, 5 Apr 2024 21:23:38 +0900 Subject: [PATCH 08/13] =?UTF-8?q?fix:=20try,catch=E6=96=87=E3=82=92?= =?UTF-8?q?=E5=89=8A=E9=99=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/organism/RankingTabs.tsx | 28 ++++++++----------- 1 file changed, 12 insertions(+), 16 deletions(-) diff --git a/typing-app/src/components/organism/RankingTabs.tsx b/typing-app/src/components/organism/RankingTabs.tsx index a55e1d8a..edde59e2 100644 --- a/typing-app/src/components/organism/RankingTabs.tsx +++ b/typing-app/src/components/organism/RankingTabs.tsx @@ -18,23 +18,19 @@ const RankingTabs = () => { const MAXIMUM = 100; // TODO: MAXIMUMをAPIから取得する const fetchData = async () => { - try { - const { data, error } = await client.GET("/scores/ranking", { - params: { - query: { - sort_by: sortBy, - start: rankingStartFrom, - limit: LIMIT, - }, + const { data, error } = await client.GET("/scores/ranking", { + params: { + query: { + sort_by: sortBy, + start: rankingStartFrom, + limit: LIMIT, }, - }); - if (data) { - setScoreRankings(data); - } else { - setError("データの取得中にエラーが発生しました。"); - } - } catch (err) { - setError("データの取得中に予期せぬエラーが発生しました。"); + }, + }); + if (data) { + setScoreRankings(data); + } else { + setError("データの取得中にエラーが発生しました。"); } }; useEffect(() => { From 2147e685b7dd4974432adb0107925a90dca5293e Mon Sep 17 00:00:00 2001 From: araaki12345 <74499464+araaki12345@users.noreply.github.com> Date: Fri, 5 Apr 2024 21:55:51 +0900 Subject: [PATCH 09/13] =?UTF-8?q?fix:=20API=5FURL=E3=81=ABNEXT=5FPUBLIC?= =?UTF-8?q?=E3=82=92=E8=BF=BD=E5=8A=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- typing-app/.env | 2 +- typing-app/src/libs/api/index.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/typing-app/.env b/typing-app/.env index 15f92054..cc536606 100644 --- a/typing-app/.env +++ b/typing-app/.env @@ -1 +1 @@ -API_URL=http://localhost:8080 \ No newline at end of file +NEXT_PUBLIC_API_URL=http://localhost:8080 \ No newline at end of file diff --git a/typing-app/src/libs/api/index.ts b/typing-app/src/libs/api/index.ts index 1ff62cd4..d4cc0a9c 100644 --- a/typing-app/src/libs/api/index.ts +++ b/typing-app/src/libs/api/index.ts @@ -1,4 +1,4 @@ import createClient from "openapi-fetch"; import { paths } from "./v1"; -export const client = createClient({ baseUrl: process.env.API_URL }); +export const client = createClient({ baseUrl: process.env.NEXT_PUBLIC_API_URL }); From 5f8bd7697437a8594a1ae1cb4918032c45f06ba2 Mon Sep 17 00:00:00 2001 From: h-takeyeah <61489178+h-takeyeah@users.noreply.github.com> Date: Fri, 5 Apr 2024 21:59:45 +0900 Subject: [PATCH 10/13] style: add new line to env file --- typing-app/.env | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/typing-app/.env b/typing-app/.env index cc536606..966485d8 100644 --- a/typing-app/.env +++ b/typing-app/.env @@ -1 +1 @@ -NEXT_PUBLIC_API_URL=http://localhost:8080 \ No newline at end of file +NEXT_PUBLIC_API_URL=http://localhost:8080 From d3746852b893f76e42a9f27ab8e6231c03886bf1 Mon Sep 17 00:00:00 2001 From: araaki12345 <74499464+araaki12345@users.noreply.github.com> Date: Sat, 6 Apr 2024 17:16:29 +0900 Subject: [PATCH 11/13] =?UTF-8?q?feat:=20API=E3=81=8B=E3=82=89=E5=8F=96?= =?UTF-8?q?=E5=BE=97=E3=81=97=E3=81=9F=E3=83=A9=E3=83=B3=E3=82=AD=E3=83=B3?= =?UTF-8?q?=E3=82=B0=E3=81=AE=E6=9C=80=E5=A4=A7=E6=95=B0=E3=82=92=E3=82=82?= =?UTF-8?q?=E3=81=A8=E3=81=AB=E3=80=81=E3=83=9A=E3=83=BC=E3=82=B8=E3=83=8D?= =?UTF-8?q?=E3=83=BC=E3=82=B7=E3=83=A7=E3=83=B3=E3=81=AE=E5=8B=95=E4=BD=9C?= =?UTF-8?q?=E3=82=92=E5=88=B6=E5=BE=A1=E3=81=99=E3=82=8B=E6=A9=9F=E8=83=BD?= =?UTF-8?q?=E3=82=92=E5=AE=9F=E8=A3=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- typing-app/src/components/organism/RankingTabs.tsx | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/typing-app/src/components/organism/RankingTabs.tsx b/typing-app/src/components/organism/RankingTabs.tsx index edde59e2..c02e63e4 100644 --- a/typing-app/src/components/organism/RankingTabs.tsx +++ b/typing-app/src/components/organism/RankingTabs.tsx @@ -13,12 +13,13 @@ const RankingTabs = () => { const [rankingStartFrom, setRankingStartFrom] = useState(1); const [sortBy, setSortBy] = useState<"accuracy" | "keystrokes">("accuracy"); const [error, setError] = useState(undefined); + const [totalRankingCount, setTotalRankingCount] = useState(0); const LIMIT = 10; - const MAXIMUM = 100; // TODO: MAXIMUMをAPIから取得する + const MAXIMUM = totalRankingCount; const fetchData = async () => { - const { data, error } = await client.GET("/scores/ranking", { + const { data } = await client.GET("/scores/ranking", { params: { query: { sort_by: sortBy, @@ -28,7 +29,8 @@ const RankingTabs = () => { }, }); if (data) { - setScoreRankings(data); + setScoreRankings(data.rankings); + setTotalRankingCount(data.total_count); } else { setError("データの取得中にエラーが発生しました。"); } @@ -40,6 +42,7 @@ const RankingTabs = () => { const handleTabChange = (index: number) => { const sortOption = index === 0 ? "accuracy" : "keystrokes"; setSortBy(sortOption); + setRankingStartFrom(1); }; const handlePaginationClick = (direction: "next" | "prev") => { From 2046f219e980126d3649c197d97f878f10169d58 Mon Sep 17 00:00:00 2001 From: araaki12345 <74499464+araaki12345@users.noreply.github.com> Date: Sat, 6 Apr 2024 18:18:57 +0900 Subject: [PATCH 12/13] =?UTF-8?q?fix:=20accuracy=E3=81=AE=E8=A1=A8?= =?UTF-8?q?=E7=A4=BA=E3=82=92=E5=B0=8F=E6=95=B0=E7=AC=AC2=E4=BD=8D?= =?UTF-8?q?=E3=81=BE=E3=81=A7=E3=81=AE=E3=83=91=E3=83=BC=E3=82=BB=E3=83=B3?= =?UTF-8?q?=E3=83=86=E3=83=BC=E3=82=B8=E5=BD=A2=E5=BC=8F=E3=81=AB=E5=A4=89?= =?UTF-8?q?=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- typing-app/src/components/molecules/RankingTableRow.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/typing-app/src/components/molecules/RankingTableRow.tsx b/typing-app/src/components/molecules/RankingTableRow.tsx index 222573a6..8c1648a2 100644 --- a/typing-app/src/components/molecules/RankingTableRow.tsx +++ b/typing-app/src/components/molecules/RankingTableRow.tsx @@ -2,6 +2,10 @@ import { Td, Tr } from "@chakra-ui/react"; import { components } from "@/libs/api/v1"; const RankingTableRow: React.FC = (scoreRanking) => { + const accuracy = scoreRanking.score?.accuracy ?? 0; + const formattedAccuracy = new Intl.NumberFormat("en-US", { style: "percent", maximumFractionDigits: 2 }).format( + accuracy + ); return ( = (scoreR {String(scoreRanking.score?.keystrokes)} - {String(scoreRanking.score?.accuracy)} + {formattedAccuracy} {scoreRanking.score?.created_at} From 0d2323c7d58394fb9b4803fae2e5f7a978648ec2 Mon Sep 17 00:00:00 2001 From: araaki12345 <74499464+araaki12345@users.noreply.github.com> Date: Sat, 6 Apr 2024 18:45:51 +0900 Subject: [PATCH 13/13] =?UTF-8?q?feat:=20created=5Fat=E3=81=AE=E8=A1=A8?= =?UTF-8?q?=E7=A4=BA=E5=BD=A2=E5=BC=8F=E3=82=92YYYY-MM-DD=E3=81=AB?= =?UTF-8?q?=E5=A4=89=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- typing-app/src/components/molecules/RankingTableRow.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/typing-app/src/components/molecules/RankingTableRow.tsx b/typing-app/src/components/molecules/RankingTableRow.tsx index 8c1648a2..da1cf2a4 100644 --- a/typing-app/src/components/molecules/RankingTableRow.tsx +++ b/typing-app/src/components/molecules/RankingTableRow.tsx @@ -6,6 +6,9 @@ const RankingTableRow: React.FC = (scoreR const formattedAccuracy = new Intl.NumberFormat("en-US", { style: "percent", maximumFractionDigits: 2 }).format( accuracy ); + const formattedCreatedAt = scoreRanking.score?.created_at + ? new Date(scoreRanking.score.created_at).toISOString().split("T")[0] + : ""; return ( = (scoreR {formattedAccuracy} - {scoreRanking.score?.created_at} + {formattedCreatedAt} );