feat: show submission date on ranking

1 files changed, 2 insertions, 42 deletions

diff --git a/frontend/app/components/GolfWatchApps/GolfWatchAppGamingMultiplayer.tsx b/frontend/app/components/GolfWatchApps/GolfWatchAppGamingMultiplayer.tsx
index a2b2d21..f3a377b 100644
--- a/frontend/app/components/GolfWatchApps/GolfWatchAppGamingMultiplayer.tsx
+++ b/frontend/app/components/GolfWatchApps/GolfWatchAppGamingMultiplayer.tsx
@@ -3,6 +3,7 @@ import type { components } from "../../api/schema";
 import { gamingLeftTimeSecondsAtom } from "../../states/watch";
 import LeftTime from "../Gaming/LeftTime";
 import Problem from "../Gaming/Problem";
+import RankingTable from "../Gaming/RankingTable";
 
 type RankingEntry = components["schemas"]["RankingEntry"];
 
@@ -41,48 +42,7 @@ export default function GolfWatchAppGamingMultiplayer({
 				/>
 				<div className="p-4 flex flex-col gap-4">
 					<div className="text-center text-xl font-bold">順位表</div>
-					<div className="overflow-hidden border-2 border-blue-600 rounded-xl">
-						<table className="min-w-full divide-y divide-gray-400 border-collapse">
-							<thead className="bg-gray-50">
-								<tr>
-									<th
-										scope="col"
-										className="px-6 py-3 text-left font-medium text-gray-800"
-									>
-										順位
-									</th>
-									<th
-										scope="col"
-										className="px-6 py-3 text-left font-medium text-gray-800"
-									>
-										プレイヤー
-									</th>
-									<th
-										scope="col"
-										className="px-6 py-3 text-left font-medium text-gray-800"
-									>
-										スコア
-									</th>
-								</tr>
-							</thead>
-							<tbody className="bg-white divide-y divide-gray-300">
-								{ranking.map((entry, index) => (
-									<tr key={entry.player.user_id}>
-										<td className="px-6 py-4 whitespace-nowrap text-gray-900">
-											{index + 1}
-										</td>
-										<td className="px-6 py-4 whitespace-nowrap text-gray-900">
-											{entry.player.display_name}
-											{entry.player.label && ` (${entry.player.label})`}
-										</td>
-										<td className="px-6 py-4 whitespace-nowrap text-gray-900">
-											{entry.score}
-										</td>
-									</tr>
-								))}
-							</tbody>
-						</table>
-					</div>
+					<RankingTable ranking={ranking} />
 				</div>
 			</div>
 		</div>