aboutsummaryrefslogtreecommitdiffhomepage
path: root/frontend
diff options
context:
space:
mode:
Diffstat (limited to 'frontend')
-rw-r--r--frontend/app/.server/api/schema.d.ts41
-rw-r--r--frontend/app/components/ExecStatusIndicatorIcon.tsx45
-rw-r--r--frontend/app/components/GolfWatchApp.client.tsx128
-rw-r--r--frontend/app/components/GolfWatchApps/GolfWatchAppGaming.tsx191
-rw-r--r--frontend/app/components/GolfWatchApps/GolfWatchAppStarting.tsx6
-rw-r--r--frontend/app/components/GolfWatchApps/GolfWatchAppWaiting.tsx8
-rw-r--r--frontend/app/root.tsx2
-rw-r--r--frontend/app/routes/_index.tsx4
-rw-r--r--frontend/package-lock.json50
-rw-r--r--frontend/package.json3
10 files changed, 423 insertions, 55 deletions
diff --git a/frontend/app/.server/api/schema.d.ts b/frontend/app/.server/api/schema.d.ts
index 9a96f19..719babb 100644
--- a/frontend/app/.server/api/schema.d.ts
+++ b/frontend/app/.server/api/schema.d.ts
@@ -112,6 +112,14 @@ export interface components {
/** @example 946684800 */
started_at?: number;
problem?: components["schemas"]["Problem"];
+ players: components["schemas"]["User"][];
+ verification_steps: components["schemas"]["VerificationStep"][];
+ };
+ VerificationStep: {
+ /** @example 1 */
+ testcase_id: number | null;
+ /** @example Test case 1 */
+ label: string;
};
Problem: {
/** @example 1 */
@@ -182,7 +190,7 @@ export interface components {
code: string;
};
GameWatcherMessage: components["schemas"]["GameWatcherMessageS2C"];
- GameWatcherMessageS2C: components["schemas"]["GameWatcherMessageS2CStart"] | components["schemas"]["GameWatcherMessageS2CCode"] | components["schemas"]["GameWatcherMessageS2CExecResult"];
+ GameWatcherMessageS2C: components["schemas"]["GameWatcherMessageS2CStart"] | components["schemas"]["GameWatcherMessageS2CCode"] | components["schemas"]["GameWatcherMessageS2CSubmit"] | components["schemas"]["GameWatcherMessageS2CExecResult"] | components["schemas"]["GameWatcherMessageS2CSubmitResult"];
GameWatcherMessageS2CStart: {
/** @constant */
type: "watcher:s2c:start";
@@ -203,6 +211,17 @@ export interface components {
/** @example print('Hello, world!') */
code: string;
};
+ GameWatcherMessageS2CSubmit: {
+ /** @constant */
+ type: "watcher:s2c:submit";
+ data: components["schemas"]["GameWatcherMessageS2CSubmitPayload"];
+ };
+ GameWatcherMessageS2CSubmitPayload: {
+ /** @example 1 */
+ player_id: number;
+ /** @example 100 */
+ preliminary_score: number;
+ };
GameWatcherMessageS2CExecResult: {
/** @constant */
type: "watcher:s2c:execresult";
@@ -211,18 +230,32 @@ export interface components {
GameWatcherMessageS2CExecResultPayload: {
/** @example 1 */
player_id: number;
+ /** @example 1 */
+ testcase_id: number | null;
/**
* @example success
* @enum {string}
*/
- status: "success";
- /** @example 100 */
- score: number | null;
+ status: "success" | "wrong_answer" | "timeout" | "runtime_error" | "internal_error" | "compile_error";
/** @example Hello, world! */
stdout: string;
/** @example */
stderr: string;
};
+ GameWatcherMessageS2CSubmitResult: {
+ /** @constant */
+ type: "watcher:s2c:submitresult";
+ data: components["schemas"]["GameWatcherMessageS2CSubmitResultPayload"];
+ };
+ GameWatcherMessageS2CSubmitResultPayload: {
+ /** @example 1 */
+ player_id: number;
+ /**
+ * @example success
+ * @enum {string}
+ */
+ status: "success" | "wrong_answer" | "timeout" | "runtime_error" | "internal_error" | "compile_error";
+ };
};
responses: {
/** @description Bad request */
diff --git a/frontend/app/components/ExecStatusIndicatorIcon.tsx b/frontend/app/components/ExecStatusIndicatorIcon.tsx
new file mode 100644
index 0000000..a76e957
--- /dev/null
+++ b/frontend/app/components/ExecStatusIndicatorIcon.tsx
@@ -0,0 +1,45 @@
+import {
+ faBan,
+ faCircleCheck,
+ faCircleExclamation,
+ faRotate,
+} from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+type Props = {
+ status: string;
+};
+
+export default function ExecStatusIndicatorIcon({ status }: Props) {
+ switch (status) {
+ case "running":
+ return (
+ <FontAwesomeIcon
+ icon={faRotate}
+ spin
+ fixedWidth
+ className="text-gray-700"
+ />
+ );
+ case "success":
+ return (
+ <FontAwesomeIcon
+ icon={faCircleCheck}
+ fixedWidth
+ className="text-green-500"
+ />
+ );
+ case "canceled":
+ return (
+ <FontAwesomeIcon icon={faBan} fixedWidth className="text-gray-400" />
+ );
+ default:
+ return (
+ <FontAwesomeIcon
+ icon={faCircleExclamation}
+ fixedWidth
+ className="text-red-500"
+ />
+ );
+ }
+}
diff --git a/frontend/app/components/GolfWatchApp.client.tsx b/frontend/app/components/GolfWatchApp.client.tsx
index 829f709..a9c9989 100644
--- a/frontend/app/components/GolfWatchApp.client.tsx
+++ b/frontend/app/components/GolfWatchApp.client.tsx
@@ -3,7 +3,9 @@ import useWebSocket, { ReadyState } from "react-use-websocket";
import type { components } from "../.server/api/schema";
import GolfWatchAppConnecting from "./GolfWatchApps/GolfWatchAppConnecting";
import GolfWatchAppFinished from "./GolfWatchApps/GolfWatchAppFinished";
-import GolfWatchAppGaming from "./GolfWatchApps/GolfWatchAppGaming";
+import GolfWatchAppGaming, {
+ PlayerInfo,
+} from "./GolfWatchApps/GolfWatchAppGaming";
import GolfWatchAppStarting from "./GolfWatchApps/GolfWatchAppStarting";
import GolfWatchAppWaiting from "./GolfWatchApps/GolfWatchAppWaiting";
@@ -34,12 +36,12 @@ export default function GolfWatchApp({
const [startedAt, setStartedAt] = useState<number | null>(null);
- const [timeLeftSeconds, setTimeLeftSeconds] = useState<number | null>(null);
+ const [leftTimeSeconds, setLeftTimeSeconds] = useState<number | null>(null);
useEffect(() => {
if (gameState === "starting" && startedAt !== null) {
const timer1 = setInterval(() => {
- setTimeLeftSeconds((prev) => {
+ setLeftTimeSeconds((prev) => {
if (prev === null) {
return null;
}
@@ -68,10 +70,23 @@ export default function GolfWatchApp({
}
}, [gameState, startedAt, game.duration_seconds]);
- const [scoreA, setScoreA] = useState<number | null>(null);
- const [scoreB, setScoreB] = useState<number | null>(null);
- const [codeA, setCodeA] = useState<string>("");
- const [codeB, setCodeB] = useState<string>("");
+ const playerA = game.players[0];
+ const playerB = game.players[1];
+
+ const [playerInfoA, setPlayerInfoA] = useState<PlayerInfo>({
+ displayName: playerA?.display_name ?? null,
+ iconPath: playerA?.icon_path ?? null,
+ score: null,
+ code: "",
+ submissionResult: undefined,
+ });
+ const [playerInfoB, setPlayerInfoB] = useState<PlayerInfo>({
+ displayName: playerB?.display_name ?? null,
+ iconPath: playerB?.icon_path ?? null,
+ score: null,
+ code: "",
+ submissionResult: undefined,
+ });
if (readyState === ReadyState.UNINSTANTIATED) {
throw new Error("WebSocket is not connected");
@@ -96,38 +111,113 @@ export default function GolfWatchApp({
const { start_at } = lastJsonMessage.data;
setStartedAt(start_at);
const nowSec = Math.floor(Date.now() / 1000);
- setTimeLeftSeconds(start_at - nowSec);
+ setLeftTimeSeconds(start_at - nowSec);
setGameState("starting");
}
} else if (lastJsonMessage.type === "watcher:s2c:code") {
const { player_id, code } = lastJsonMessage.data;
- setCodeA(code);
+ const setter =
+ player_id === playerA?.user_id ? setPlayerInfoA : setPlayerInfoB;
+ setter((prev) => ({ ...prev, code }));
+ } else if (lastJsonMessage.type === "watcher:s2c:submit") {
+ const { player_id, preliminary_score } = lastJsonMessage.data;
+ const setter =
+ player_id === playerA?.user_id ? setPlayerInfoA : setPlayerInfoB;
+ setter((prev) => ({
+ ...prev,
+ submissionResult: {
+ status: "running",
+ preliminaryScore: preliminary_score,
+ verificationResults: game.verification_steps.map((v) => ({
+ testcase_id: v.testcase_id,
+ status: "running",
+ label: v.label,
+ stdout: "",
+ stderr: "",
+ })),
+ },
+ }));
} else if (lastJsonMessage.type === "watcher:s2c:execresult") {
- const { score } = lastJsonMessage.data;
- if (score !== null && (scoreA === null || score < scoreA)) {
- setScoreA(score);
- }
+ const { player_id, testcase_id, status, stdout, stderr } =
+ lastJsonMessage.data;
+ const setter =
+ player_id === playerA?.user_id ? setPlayerInfoA : setPlayerInfoB;
+ setter((prev) => {
+ const ret = { ...prev };
+ if (ret.submissionResult === undefined) {
+ return ret;
+ }
+ ret.submissionResult = {
+ ...ret.submissionResult,
+ verificationResults: ret.submissionResult.verificationResults.map(
+ (v) =>
+ v.testcase_id === testcase_id && v.status === "running"
+ ? {
+ ...v,
+ status,
+ stdout,
+ stderr,
+ }
+ : v,
+ ),
+ };
+ return ret;
+ });
+ } else if (lastJsonMessage.type === "watcher:s2c:submitresult") {
+ const { player_id, status } = lastJsonMessage.data;
+ const setter =
+ player_id === playerA?.user_id ? setPlayerInfoA : setPlayerInfoB;
+ setter((prev) => {
+ const ret = { ...prev };
+ if (ret.submissionResult === undefined) {
+ return ret;
+ }
+ ret.submissionResult = {
+ ...ret.submissionResult,
+ status,
+ };
+ if (status === "success") {
+ if (
+ ret.score === null ||
+ ret.submissionResult.preliminaryScore < ret.score
+ ) {
+ ret.score = ret.submissionResult.preliminaryScore;
+ }
+ } else {
+ ret.submissionResult.verificationResults =
+ ret.submissionResult.verificationResults.map((v) =>
+ v.status === "running" ? { ...v, status: "canceled" } : v,
+ );
+ }
+ return ret;
+ });
}
} else {
setGameState("waiting");
}
}
- }, [lastJsonMessage, readyState, gameState, scoreA]);
+ }, [
+ game.verification_steps,
+ lastJsonMessage,
+ readyState,
+ gameState,
+ playerA?.user_id,
+ playerB?.user_id,
+ ]);
if (gameState === "connecting") {
return <GolfWatchAppConnecting />;
} else if (gameState === "waiting") {
return <GolfWatchAppWaiting />;
} else if (gameState === "starting") {
- return <GolfWatchAppStarting timeLeft={timeLeftSeconds!} />;
+ return <GolfWatchAppStarting leftTimeSeconds={leftTimeSeconds!} />;
} else if (gameState === "gaming") {
return (
<GolfWatchAppGaming
problem={game.problem!.description}
- codeA={codeA}
- scoreA={scoreA}
- codeB={codeB}
- scoreB={scoreB}
+ playerInfoA={playerInfoA}
+ playerInfoB={playerInfoB}
+ leftTimeSeconds={leftTimeSeconds!}
/>
);
} else if (gameState === "finished") {
diff --git a/frontend/app/components/GolfWatchApps/GolfWatchAppGaming.tsx b/frontend/app/components/GolfWatchApps/GolfWatchAppGaming.tsx
index 22277f8..53d5bce 100644
--- a/frontend/app/components/GolfWatchApps/GolfWatchAppGaming.tsx
+++ b/frontend/app/components/GolfWatchApps/GolfWatchAppGaming.tsx
@@ -1,41 +1,184 @@
+import ExecStatusIndicatorIcon from "../ExecStatusIndicatorIcon";
+
type Props = {
problem: string;
- codeA: string;
- scoreA: number | null;
- codeB: string;
- scoreB: number | null;
+ playerInfoA: PlayerInfo;
+ playerInfoB: PlayerInfo;
+ leftTimeSeconds: number;
+};
+
+export type PlayerInfo = {
+ displayName: string | null;
+ iconPath: string | null;
+ score: number | null;
+ code: string | null;
+ submissionResult?: SubmissionResult;
+};
+
+type SubmissionResult = {
+ status:
+ | "running"
+ | "success"
+ | "wrong_answer"
+ | "timeout"
+ | "compile_error"
+ | "runtime_error"
+ | "internal_error";
+ preliminaryScore: number;
+ verificationResults: VerificationResult[];
};
+type VerificationResult = {
+ testcase_id: number | null;
+ status:
+ | "running"
+ | "success"
+ | "wrong_answer"
+ | "timeout"
+ | "compile_error"
+ | "runtime_error"
+ | "internal_error"
+ | "canceled";
+ label: string;
+ stdout: string;
+ stderr: string;
+};
+
+function submissionResultStatusToLabel(
+ status: SubmissionResult["status"] | null,
+) {
+ switch (status) {
+ case null:
+ return "-";
+ case "running":
+ return "Running...";
+ case "success":
+ return "Accepted";
+ case "wrong_answer":
+ return "Wrong Answer";
+ case "timeout":
+ return "Time Limit Exceeded";
+ case "compile_error":
+ return "Compile Error";
+ case "runtime_error":
+ return "Runtime Error";
+ case "internal_error":
+ return "Internal Error";
+ }
+}
+
export default function GolfWatchAppGaming({
problem,
- codeA,
- scoreA,
- codeB,
- scoreB,
+ playerInfoA,
+ playerInfoB,
+ leftTimeSeconds,
}: Props) {
+ const leftTime = (() => {
+ const m = Math.floor(leftTimeSeconds / 60);
+ const s = leftTimeSeconds % 60;
+ return `${m.toString().padStart(2, "0")}:${s.toString().padStart(2, "0")}`;
+ })();
+ const scoreRatio = (() => {
+ const scoreA = playerInfoA.score ?? 0;
+ const scoreB = playerInfoB.score ?? 0;
+ const totalScore = scoreA + scoreB;
+ return totalScore === 0 ? 50 : (scoreB / totalScore) * 100;
+ })();
+
return (
- <div style={{ display: "flex", flexDirection: "column" }}>
- <div style={{ display: "flex", flex: 1, justifyContent: "center" }}>
- <div>{problem}</div>
+ <div className="grid h-full w-full grid-rows-[auto_auto_1fr_auto]">
+ <div className="grid grid-cols-[1fr_auto_1fr]">
+ <div className="grid justify-start bg-red-500 p-2 text-white">
+ {playerInfoA.displayName}
+ </div>
+ <div className="grid justify-center p-2">{leftTime}</div>
+ <div className="grid justify-end bg-blue-500 p-2 text-white">
+ {playerInfoB.displayName}
+ </div>
+ </div>
+ <div className="grid grid-cols-[auto_1fr_auto]">
+ <div className="grid justify-start bg-red-500 p-2 text-lg font-bold text-white">
+ {playerInfoA.score ?? "-"}
+ </div>
+ <div className="w-full bg-blue-500">
+ <div
+ className="h-full bg-red-500"
+ style={{ width: `${scoreRatio}%` }}
+ ></div>
+ </div>
+ <div className="grid justify-end bg-blue-500 p-2 text-lg font-bold text-white">
+ {playerInfoB.score ?? "-"}
+ </div>
</div>
- <div style={{ display: "flex", flex: 3 }}>
- <div style={{ display: "flex", flex: 3, flexDirection: "column" }}>
- <div style={{ flex: 1, justifyContent: "center" }}>{scoreA}</div>
- <div style={{ flex: 3 }}>
- <pre>
- <code>{codeA}</code>
- </pre>
+ <div className="grid grid-cols-[3fr_2fr_3fr_2fr] p-2">
+ <div>
+ <pre>
+ <code>{playerInfoA.code}</code>
+ </pre>
+ </div>
+ <div>
+ <div>
+ {submissionResultStatusToLabel(
+ playerInfoA.submissionResult?.status ?? null,
+ )}{" "}
+ ({playerInfoA.submissionResult?.preliminaryScore})
+ </div>
+ <div>
+ <ol>
+ {playerInfoA.submissionResult?.verificationResults.map(
+ (result, idx) => (
+ <li key={idx}>
+ <div>
+ <div>
+ <ExecStatusIndicatorIcon status={result.status} />{" "}
+ {result.label}
+ </div>
+ <div>
+ {result.stdout}
+ {result.stderr}
+ </div>
+ </div>
+ </li>
+ ),
+ )}
+ </ol>
</div>
</div>
- <div style={{ display: "flex", flex: 3, flexDirection: "column" }}>
- <div style={{ flex: 1, justifyContent: "center" }}>{scoreB}</div>
- <div style={{ flex: 3 }}>
- <pre>
- <code>{codeB}</code>
- </pre>
+ <div>
+ <pre>
+ <code>{playerInfoB.code}</code>
+ </pre>
+ </div>
+ <div>
+ <div>
+ {submissionResultStatusToLabel(
+ playerInfoB.submissionResult?.status ?? null,
+ )}{" "}
+ ({playerInfoB.submissionResult?.preliminaryScore ?? "-"})
+ </div>
+ <div>
+ <ol>
+ {playerInfoB.submissionResult?.verificationResults.map(
+ (result, idx) => (
+ <li key={idx}>
+ <div>
+ <div>
+ <ExecStatusIndicatorIcon status={result.status} />{" "}
+ {result.label}
+ </div>
+ <div>
+ {result.stdout}
+ {result.stderr}
+ </div>
+ </div>
+ </li>
+ ),
+ )}
+ </ol>
</div>
</div>
</div>
+ <div className="grid justify-center p-2 bg-slate-300">{problem}</div>
</div>
);
}
diff --git a/frontend/app/components/GolfWatchApps/GolfWatchAppStarting.tsx b/frontend/app/components/GolfWatchApps/GolfWatchAppStarting.tsx
index ef72cec..8282fb4 100644
--- a/frontend/app/components/GolfWatchApps/GolfWatchAppStarting.tsx
+++ b/frontend/app/components/GolfWatchApps/GolfWatchAppStarting.tsx
@@ -1,8 +1,10 @@
type Props = {
- timeLeft: number;
+ leftTimeSeconds: number;
};
-export default function GolfWatchAppStarting({ timeLeft }: Props) {
+export default function GolfWatchAppStarting({
+ leftTimeSeconds: timeLeft,
+}: Props) {
return (
<div className="min-h-screen bg-gray-100 flex items-center justify-center">
<div className="text-center">
diff --git a/frontend/app/components/GolfWatchApps/GolfWatchAppWaiting.tsx b/frontend/app/components/GolfWatchApps/GolfWatchAppWaiting.tsx
index d58ec19..17ef2b9 100644
--- a/frontend/app/components/GolfWatchApps/GolfWatchAppWaiting.tsx
+++ b/frontend/app/components/GolfWatchApps/GolfWatchAppWaiting.tsx
@@ -1,3 +1,9 @@
export default function GolfWatchAppWaiting() {
- return <div>Waiting...</div>;
+ return (
+ <div className="min-h-screen bg-gray-100 flex items-center justify-center">
+ <div className="text-center">
+ <h1 className="text-4xl font-bold text-black-600 mb-4">Waiting...</h1>
+ </div>
+ </div>
+ );
}
diff --git a/frontend/app/root.tsx b/frontend/app/root.tsx
index 054474a..4d7a661 100644
--- a/frontend/app/root.tsx
+++ b/frontend/app/root.tsx
@@ -21,7 +21,7 @@ export function Layout({ children }: { children: React.ReactNode }) {
<Meta />
<Links />
</head>
- <body>
+ <body className="h-screen">
{children}
<ScrollRestoration />
<Scripts />
diff --git a/frontend/app/routes/_index.tsx b/frontend/app/routes/_index.tsx
index 2fcf1f2..25b9c81 100644
--- a/frontend/app/routes/_index.tsx
+++ b/frontend/app/routes/_index.tsx
@@ -1,7 +1,11 @@
+import { config } from "@fortawesome/fontawesome-svg-core";
import type { LoaderFunctionArgs, MetaFunction } from "@remix-run/node";
import { Link } from "@remix-run/react";
+import "@fortawesome/fontawesome-svg-core/styles.css";
import { ensureUserNotLoggedIn } from "../.server/auth";
+config.autoAddCss = false;
+
export const meta: MetaFunction = () => [
{ title: "iOSDC Japan 2024 Albatross.swift" },
];
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index d5c12fe..b706788 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -6,6 +6,9 @@
"": {
"name": "iosdc-japan-2024-albatross-frontend",
"dependencies": {
+ "@fortawesome/fontawesome-svg-core": "^6.6.0",
+ "@fortawesome/free-solid-svg-icons": "^6.6.0",
+ "@fortawesome/react-fontawesome": "^0.2.2",
"@remix-run/node": "^2.10.3",
"@remix-run/react": "^2.10.3",
"@remix-run/serve": "^2.10.3",
@@ -1306,6 +1309,48 @@
"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
}
},
+ "node_modules/@fortawesome/fontawesome-common-types": {
+ "version": "6.6.0",
+ "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.6.0.tgz",
+ "integrity": "sha512-xyX0X9mc0kyz9plIyryrRbl7ngsA9jz77mCZJsUkLl+ZKs0KWObgaEBoSgQiYWAsSmjz/yjl0F++Got0Mdp4Rw==",
+ "engines": {
+ "node": ">=6"
+ }
+ },
+ "node_modules/@fortawesome/fontawesome-svg-core": {
+ "version": "6.6.0",
+ "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.6.0.tgz",
+ "integrity": "sha512-KHwPkCk6oRT4HADE7smhfsKudt9N/9lm6EJ5BVg0tD1yPA5hht837fB87F8pn15D8JfTqQOjhKTktwmLMiD7Kg==",
+ "dependencies": {
+ "@fortawesome/fontawesome-common-types": "6.6.0"
+ },
+ "engines": {
+ "node": ">=6"
+ }
+ },
+ "node_modules/@fortawesome/free-solid-svg-icons": {
+ "version": "6.6.0",
+ "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.6.0.tgz",
+ "integrity": "sha512-IYv/2skhEDFc2WGUcqvFJkeK39Q+HyPf5GHUrT/l2pKbtgEIv1al1TKd6qStR5OIwQdN1GZP54ci3y4mroJWjA==",
+ "dependencies": {
+ "@fortawesome/fontawesome-common-types": "6.6.0"
+ },
+ "engines": {
+ "node": ">=6"
+ }
+ },
+ "node_modules/@fortawesome/react-fontawesome": {
+ "version": "0.2.2",
+ "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.2.2.tgz",
+ "integrity": "sha512-EnkrprPNqI6SXJl//m29hpaNzOp1bruISWaOiRtkMi/xSvHJlzc2j2JAYS7egxt/EbjSNV/k6Xy0AQI6vB2+1g==",
+ "dependencies": {
+ "prop-types": "^15.8.1"
+ },
+ "peerDependencies": {
+ "@fortawesome/fontawesome-svg-core": "~1 || ~6",
+ "react": ">=16.3"
+ }
+ },
"node_modules/@humanwhocodes/config-array": {
"version": "0.11.14",
"resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.14.tgz",
@@ -8087,7 +8132,6 @@
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
"integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
- "dev": true,
"engines": {
"node": ">=0.10.0"
}
@@ -8953,7 +8997,6 @@
"version": "15.8.1",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
"integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
- "dev": true,
"dependencies": {
"loose-envify": "^1.4.0",
"object-assign": "^4.1.1",
@@ -9102,8 +9145,7 @@
"node_modules/react-is": {
"version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
- "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
- "dev": true
+ "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
},
"node_modules/react-refresh": {
"version": "0.14.2",
diff --git a/frontend/package.json b/frontend/package.json
index 44af089..4c630a0 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -14,6 +14,9 @@
"start": "remix-serve ./build/server/index.js"
},
"dependencies": {
+ "@fortawesome/fontawesome-svg-core": "^6.6.0",
+ "@fortawesome/free-solid-svg-icons": "^6.6.0",
+ "@fortawesome/react-fontawesome": "^0.2.2",
"@remix-run/node": "^2.10.3",
"@remix-run/react": "^2.10.3",
"@remix-run/serve": "^2.10.3",
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-12-02 00:23:14 +0000