- {formations[selectedUser]?.players.gk.map((name, idx) => (
-
- ))}
+ {/* 탭 내용 */}
+
+ {activeTab === 'participants' && (
+
+
+ {scoreboard.map((participant, index) => {
+ // 메달 이모티콘 결정
+ const getMedalIcon = (rank) => {
+ switch(rank) {
+ case 1: return '🥇';
+ case 2: return '🥈';
+ case 3: return '🥉';
+ default: return '4️⃣';
+ }
+ };
+
+ const getRankText = (rank) => {
+ return `${rank}위`;
+ };
+
+ return (
+
{
+ handleSelectParticipant(participant.participantId);
+ setActiveTab('formation'); // 선택 후 포메이션 탭으로 자동 이동
+ }}
+ >
+
+ {getMedalIcon(participant.rank)}
+ {getRankText(participant.rank)}
+
+
+
+ {participant.email}
+ {participant.userId === currentUser?.id && ' (나)'}
+
+
{participant.totalPoints}점
+
+
+ );
+ })}
-
- {formations[selectedUser]?.players.df.map((name, idx) => (
-
- ))}
+
+ {/* 최근 골/어시스트 알림 영역 */}
+
+
+ ⚽ 최근 알림
+
+
+ {recentAlerts.length > 0 ? (
+ recentAlerts.map((alert) => (
+
+
{alert.content}
+
{alert.time}
+
+ ))
+ ) : (
+
+ 아직 골/어시스트 알림이 없습니다
+
+ )}
+
-
- {formations[selectedUser]?.players.mf.map((name, idx) => (
-
- ))}
+
+ )}
+
+ {activeTab === 'formation' && (
+
+
+ {currentRoster ? `${scoreboard.find(s => s.participantId === selectedParticipantId)?.email || ''}의 팀` : '팀 선택'}
+ {currentRoster && ` (${currentRoster.formation})`}
-
- {formations[selectedUser]?.players.fw.map((name, idx) => (
-
- ))}
+
+
+
+ {renderFormation()}
+
-
+ )}
-
채팅
+
+ 채팅
+ {unreadCount > 0 && 미읽음 {unreadCount}}
+ {loading && 로딩중...}
+
+
+ {/* 채팅 검색 영역 */}
+
+ setSearchQuery(e.target.value)}
+ onKeyDown={(e) => {
+ if (e.key === 'Enter') {
+ e.preventDefault();
+ handleSearch();
+ }
+ }}
+ placeholder="채팅 메시지 검색..."
+ />
+
+ {showSearchResults && (
+
+ )}
+
- {chatList.map((msg, idx) => (
-
-
{msg.user}
-
{msg.text}
-
{msg.time}
-
- ))}
+ {showSearchResults ? (
+ /* 검색 결과 표시 */
+ <>
+
+ 검색 결과: "{searchQuery}" ({searchResults.length}건)
+
+ {searchResults.length > 0 ? (
+ searchResults.map((msg) => (
+
+
{msg.user}
+
{msg.text}
+
{msg.time}
+
+ ))
+ ) : (
+
+ 검색 결과가 없습니다.
+
+ )}
+
+ ) : (
+ /* 일반 채팅 메시지 표시 */
+ <>
+ {hasMore && (
+
+ {loading &&
이전 메시지를 불러오는 중...
}
+
+ )}
+ {!hasMore && chatList.length > 0 && (
+
채팅의 시작입니다.
+ )}
+ {chatList.map((msg) => (
+
+
{msg.user}
+
{msg.text}
+
{msg.time}
+
+ ))}
+
+ )}
setMessage(e.target.value)}
- onKeyDown={(e) => e.key === 'Enter' && handleSendMessage()}
- placeholder="메시지를 입력하세요..."
+ onCompositionStart={() => setIsComposing(true)}
+ onCompositionEnd={(e) => {
+ // 조합
+ // 종료 시 최종 텍스트 반영(안전)
+ setMessage(e.currentTarget.value);
+ setIsComposing(false);
+ }}
+ onKeyDown={(e) => {
+ // 브라우저별 안전 가드: 로컬 state || native flag 둘 다 확인
+ const composing = isComposing || e.nativeEvent.isComposing;
+ if (e.key === 'Enter' && !e.shiftKey) {
+ if (composing) return; // ⬅️ 조합 중이면 전송 금지
+ e.preventDefault();
+ handleSendMessage();
+ }
+ }}
+ placeholder={isConnected ? "메시지를 입력하세요..." : "연결 중..."}
+ disabled={!isConnected}
/>
-
+
);
-}
+}
\ No newline at end of file
diff --git a/src/pages/Main.jsx b/src/pages/Main.jsx
index 746a70f..0edeab5 100644
--- a/src/pages/Main.jsx
+++ b/src/pages/Main.jsx
@@ -95,7 +95,9 @@ export default function Main() {
const fetchTopUsers = async () => {
try {
setIsLoadingUsers(true);
+
const res = await fetch(`${import.meta.env.VITE_API_BASE_URL}/api/user/seasonBestScore`);
+
const data = res.ok ? await res.json() : [];
setTopUsers(data);
} catch {
@@ -107,7 +109,9 @@ export default function Main() {
const fetchTopPlayers = async () => {
try {
setIsLoadingPlayers(true);
+
const res = await fetch(`${import.meta.env.VITE_API_BASE_URL}/api/player/previousPlayer`);
+
const data = res.ok ? await res.json() : [];
setTopPlayers(data);
} catch {
@@ -119,7 +123,9 @@ export default function Main() {
const fetchTeamTable = async () => {
try {
setIsLoadingTeams(true);
+
const res = await fetch(`${import.meta.env.VITE_API_BASE_URL}/api/team/getTable`);
+
const data = res.ok ? await res.json() : [];
setTeamTable(data);
} catch {
@@ -221,6 +227,35 @@ export default function Main() {
navigate("/waiting");
};
+ // Main.jsx 수정 - draft-btn 아래에 추가
+// handleDraftClick 함수 아래에 이 함수 추가:
+
+ const handleChatroomClick = async () => {
+ if (!isLoggedIn) {
+ const go = window.confirm("로그인이 필요합니다. 로그인 페이지로 이동할까요?");
+ if (go) navigate("/login");
+ return;
+ }
+
+ try {
+ // 사용자의 현재 채팅방 정보 조회
+ const response = await axiosInstance.get("/api/user/current-room");
+ if (response.data && response.data.roomId) {
+ navigate(`/chatroom/${response.data.roomId}`);
+ } else {
+ alert("참가중인 채팅방이 없습니다. 드래프트에 먼저 참가해주세요.");
+ }
+ } catch (error) {
+ console.error("채팅방 정보 조회 실패:", error);
+ if (error.response?.status === 401) {
+ alert("로그인이 만료되었습니다. 다시 로그인해주세요.");
+ navigate("/login");
+ } else {
+ alert("채팅방 정보를 불러올 수 없습니다. 잠시 후 다시 시도해주세요.");
+ }
+ }
+ };
+
const draftDisabled = matchState !== "OPEN";
const getMatchStatusTextJSX = () => {
@@ -461,6 +496,27 @@ export default function Main() {
>
🏆 드래프트 참가
+
+
Top 10 순위
diff --git a/vite.config.js b/vite.config.js
index db2be37..9d87c9b 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -4,8 +4,9 @@ import react from '@vitejs/plugin-react'
// https://vite.dev/config/
export default defineConfig({
plugins: [react()],
-
+
define: {
- global: "window", // 브라우저에서 global → window 로 대체
+ global: 'globalThis',
+
},
})