diff --git a/packages/client/index.html b/packages/client/index.html
index d21d5a52..4f56c098 100644
--- a/packages/client/index.html
+++ b/packages/client/index.html
@@ -2,7 +2,7 @@
-
+
You-Quiz 실시간 퀴즈 플랫폼
diff --git a/packages/client/src/index.css b/packages/client/src/index.css
index 1de9b074..55ed1e84 100644
--- a/packages/client/src/index.css
+++ b/packages/client/src/index.css
@@ -6,21 +6,21 @@
font-family: "Pretendard";
font-weight: 400;
font-style: normal;
- src: url("./assets/fonts/Pretendard-Regular.woff2") format("woff2");
+ src: url("/src/shared/assets/fonts/Pretendard-Regular.woff2") format("woff2");
}
@font-face {
font-family: "Pretendard";
font-weight: 500;
font-style: normal;
- src: url("./assets/fonts/Pretendard-Medium.woff2") format("woff2");
+ src: url("/src/shared/assets/fonts/Pretendard-Medium.woff2") format("woff2");
}
@font-face {
font-family: "Pretendard";
font-weight: 700;
font-style: normal;
- src: url("./assets/fonts/Pretendard-Bold.woff2") format("woff2");
+ src: url("/src/shared/assets/fonts/Pretendard-Bold.woff2") format("woff2");
}
body {
diff --git a/packages/client/src/pages/quiz-list/ui/ClassItem.tsx b/packages/client/src/pages/quiz-list/ui/ClassItem.tsx
index 67f8ab55..4d31b731 100644
--- a/packages/client/src/pages/quiz-list/ui/ClassItem.tsx
+++ b/packages/client/src/pages/quiz-list/ui/ClassItem.tsx
@@ -81,7 +81,7 @@ export default function ClassItem({ index, quizList }: ClassItemProps) {
{quizList.quizzes.length === 0 && 퀴즈가 없습니다.}
{quizList.quizzes.map((quizData, quizIndex) => (
- Q {quizIndex + 1} :
+ Q{quizIndex + 1}:
{quizData.content}
))}
diff --git a/packages/client/src/pages/quiz-master-session/index.tsx b/packages/client/src/pages/quiz-master-session/index.tsx
index 363b7a6e..157ce51b 100644
--- a/packages/client/src/pages/quiz-master-session/index.tsx
+++ b/packages/client/src/pages/quiz-master-session/index.tsx
@@ -24,6 +24,7 @@ interface HistoryItem {
user: string;
submitTime: number;
elapsedTime: number;
+ displayTime: string;
}
export default function QuizMasterSession() {
@@ -109,8 +110,7 @@ export default function QuizMasterSession() {
-
-
+
+
({
- answer,
- count,
- }));
+const calculateTickCount = (maxValue: number): number => {
+ const maxTicks = 5;
+
+ const divisors = Array.from({ length: maxValue }, (_, i) => i + 1).filter(
+ (num) => maxValue % num === 0,
+ );
+ return Math.max(divisors[Math.min(divisors.length - 1, maxTicks - 1)], 2);
+};
+
+export default function AnswerGraph({ answerStats, quizData, participantCount }: AnswerStatProps) {
+ const [answerStatsArray, setAnswerStatsArray] = useState<{ answer: string; count: number }[]>([]);
+ const [loading, setLoading] = useState(true);
+
+ useEffect(() => {
+ if (quizData?.choices) {
+ const formattedData = Object.entries(answerStats).map(([key, count]) => ({
+ answer:
+ `${parseInt(key) + 1}번: ${quizData.choices[parseInt(key)].content}` || `답변 ${key}`,
+ count,
+ }));
+ setAnswerStatsArray(formattedData);
+ setLoading(false);
+ }
+ }, [quizData, answerStats]);
+
+ const tickCount = calculateTickCount(participantCount);
+ if (loading) {
+ return (
+
+
+
+ );
+ }
return (
-
-
-
+
+ [`${value}명`, '참여자 수']} />
+
diff --git a/packages/client/src/pages/quiz-master-session/ui/EmojiChart.tsx b/packages/client/src/pages/quiz-master-session/ui/EmojiChart.tsx
index 883df8f0..ffba5674 100644
--- a/packages/client/src/pages/quiz-master-session/ui/EmojiChart.tsx
+++ b/packages/client/src/pages/quiz-master-session/ui/EmojiChart.tsx
@@ -15,7 +15,7 @@ export default function EmojiChart({ reactionStats }: EmojiChartProps) {
const calculatePercentage = (count: number) => {
if (totalVotes === 0) return 50;
- return Number(((count / totalVotes) * 100).toFixed(1));
+ return Number(((count / totalVotes) * 100).toFixed(0));
};
const results = [
diff --git a/packages/client/src/pages/quiz-master-session/ui/RecentSubmittedAnswers.tsx b/packages/client/src/pages/quiz-master-session/ui/RecentSubmittedAnswers.tsx
index d4d731e5..8dc67aa3 100644
--- a/packages/client/src/pages/quiz-master-session/ui/RecentSubmittedAnswers.tsx
+++ b/packages/client/src/pages/quiz-master-session/ui/RecentSubmittedAnswers.tsx
@@ -1,9 +1,11 @@
+import { formatElapsedTime } from '@/shared/utils/formatElapsedTime';
import { useEffect } from 'react';
interface HistoryItem {
user: string;
submitTime: number;
elapsedTime: number;
+ displayTime: string;
}
interface RecentSubmittedAnswersProps {
@@ -29,6 +31,7 @@ export default function RecentSubmittedAnswers({
user,
submitTime,
elapsedTime: existedHistory ? existedHistory.elapsedTime : 0,
+ displayTime: existedHistory ? existedHistory.displayTime : '',
};
});
@@ -49,6 +52,7 @@ export default function RecentSubmittedAnswers({
prev.map((item) => ({
...item,
elapsedTime: item.elapsedTime + 1,
+ displayTime: formatElapsedTime(item.elapsedTime + 1),
})),
);
}, 1000);
@@ -79,7 +83,7 @@ export default function RecentSubmittedAnswers({
{item.user}님
-
{item.elapsedTime}초 전 제출
+
{item.displayTime || '방금 전'}
diff --git a/packages/client/src/pages/quiz-wait/ui/UserGridItem.tsx b/packages/client/src/pages/quiz-wait/ui/UserGridItem.tsx
index 5220e143..4b4f9fa4 100644
--- a/packages/client/src/pages/quiz-wait/ui/UserGridItem.tsx
+++ b/packages/client/src/pages/quiz-wait/ui/UserGridItem.tsx
@@ -89,7 +89,7 @@ export default function UserGridItem({ participant, isMine, otherMessage }: User
onChange={handleMessageChange}
onKeyDown={handleEnterKeyDown}
maxLength={MAX_MESSAGE_LENGTH}
- className="absolute -top-7 rounded-md shadow-sm outline-none px-2 w-40 h-6 text-sm"
+ className="absolute -top-7 rounded-md shadow-sm outline-none px-2 w-32 h-6 text-sm"
/>