Skip to content

Commit

Permalink
Merge pull request #1111 from 42organization/feat/토너먼트-게임-정보-mock-api-#…
Browse files Browse the repository at this point in the history
…1102

Feat/토너먼트 게임 정보 mock api #1102
  • Loading branch information
greatSweetMango authored Nov 24, 2023
2 parents 2dcc2a9 + 6268187 commit af667fc
Show file tree
Hide file tree
Showing 14 changed files with 277 additions and 159 deletions.
29 changes: 10 additions & 19 deletions components/admin/tournament/TournamentList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import {
ITournamentTable,
} from 'types/admin/adminTournamentTypes';
import { TournamentInfo } from 'types/tournamentTypes';
import { mockInstance } from 'utils/mockAxios';
import { modalState } from 'utils/recoil/modal';
import { tableFormat } from 'constants/admin/table';
import {
Expand All @@ -32,22 +33,13 @@ const Quill = dynamic(() => import('react-quill'), {

const tableTitle: { [key: string]: string } = {
title: '토너먼트 이름',
content: '토너먼트 내용',
contents: '토너먼트 내용',
startTime: '시작 시간',
endTime: '종료 시간',
tournamentType: '토너먼트 타입',
type: '토너먼트 타입',
edit: '수정하기',
};

const smapleTournamentList: ITournament[] = Array.from({ length: 10 }, () => ({
title: '샘플토너먼트제목',
content: '샘플내용',
startTime: new Date(),
endTime: new Date(),
tournamentType: 'CUSTOM',
count: 7,
}));

export default function TournamentList() {
const setModal = useSetRecoilState(modalState);
const [tournamentInfo, setTournamentInfo] = useState<ITournamentTable>({
Expand All @@ -58,14 +50,12 @@ export default function TournamentList() {

const [currentPage, setCurrentPage] = useState<number>(1);

const getTournaments = useCallback(async () => {
const fetchTournaments = useCallback(async () => {
try {
// const res = await instanceInManage.get(
// `/announcement?page=${currentPage}&size=3`
// );
const res = await mockInstance.get(`/tournament?page=${currentPage}`);
setTournamentInfo({
tournamentList: smapleTournamentList, //res.data.tournamentList,
totalPage: 10, //res.data.totalPage,
tournamentList: res.data.tournaments,
totalPage: res.data.totalPage,
currentPage: currentPage,
});
} catch (e) {
Expand All @@ -74,8 +64,8 @@ export default function TournamentList() {
}, [currentPage]);

useEffect(() => {
getTournaments();
}, [getTournaments]);
fetchTournaments();
}, [fetchTournaments]);

return (
<div className={styles.container}>
Expand Down Expand Up @@ -109,6 +99,7 @@ export default function TournamentList() {
onClick={() => {
setModal({
modalName: 'ADMIN-TOURNAMENT_BRAKET_EDIT',
tournament: tournament,
});
}}
>
Expand Down
148 changes: 27 additions & 121 deletions components/modal/admin/AdminEditTournamentBraket.tsx
Original file line number Diff line number Diff line change
@@ -1,131 +1,37 @@
import { Match } from '@g-loot/react-tournament-brackets/dist/src/types';
import { useCallback, useEffect, useState } from 'react';
import { ITournament } from 'types/admin/adminTournamentTypes';
import { TournamentGame, TournamentInfo } from 'types/tournamentTypes';
import { convertTournamentGamesToBracketMatchs } from 'utils/handleTournamentGame';
import { mockInstance } from 'utils/mockAxios';
import TournamentBraket from 'components/tournament/TournamentBraket';
import styles from 'styles/admin/modal/AdminEditTournamentBraket.module.scss';

export const simpleSmallBracket: Match[] = [
{
id: 19753,
nextMatchId: null,
tournamentRoundText: '3',
startTime: '2021-05-30',
state: 'SCHEDULED',
participants: [],
},
{
id: 19754,
nextMatchId: 19753,
tournamentRoundText: '2',
startTime: '2021-05-30',
state: 'SCHEDULED',
participants: [
{
id: '14754a1a-932c-4992-8dec-f7f94a339960',
resultText: null,
isWinner: false,
status: null,
name: 'CoKe BoYz',
picture: 'https://avatars.githubusercontent.com/u/93255519?v=4',
},
],
},
{
id: 19755,
nextMatchId: 19754,
tournamentRoundText: '1',
startTime: '2021-05-30',
state: 'SCORE_DONE',
participants: [
{
id: '14754a1a-932c-4992-8dec-f7f94a339960',
resultText: 'Won',
isWinner: true,
status: 'PLAYED',
name: 'CoKe BoYz',
picture: 'https://avatars.githubusercontent.com/u/93255519?v=4',
},
{
id: 'd16315d4-7f2d-427b-ae75-63a1ae82c0a8',
resultText: 'Lost',
isWinner: false,
status: 'PLAYED',
name: 'Aids Team',
picture: 'https://avatars.githubusercontent.com/u/93255519?v=4',
},
],
},
{
id: 19756,
nextMatchId: 19754,
tournamentRoundText: '1',
startTime: '2021-05-30',
state: 'RUNNING',
participants: [
{
id: 'd8b9f00a-0ffa-4527-8316-da701894768e',
resultText: null,
isWinner: false,
status: null,
name: 'Art of kill',
picture: 'https://avatars.githubusercontent.com/u/93255519?v=4',
},
],
},
{
id: 19757,
nextMatchId: 19753,
tournamentRoundText: '2',
startTime: '2021-05-30',
state: 'SCHEDULED',
participants: [],
},
{
id: 19758,
nextMatchId: 19757,
tournamentRoundText: '1',
startTime: '2021-05-30',
state: 'SCHEDULED',
participants: [
{
id: '9397971f-4b2f-44eb-a094-722eb286c59b',
resultText: null,
isWinner: false,
status: null,
name: 'Crazy Pepes',
picture: 'https://avatars.githubusercontent.com/u/93255519?v=4',
},
],
},
{
id: 19759,
nextMatchId: 19757,
tournamentRoundText: '1',
startTime: '2021-05-30',
state: 'SCHEDULED',
participants: [
{
id: '42fecd89-dc83-4821-80d3-718acb50a30c',
resultText: null,
isWinner: false,
status: null,
name: 'BLUEJAYS',
picture: 'https://avatars.githubusercontent.com/u/93255519?v=4',
},
{
id: 'df01fe2c-18db-4190-9f9e-aa63364128fe',
resultText: null,
isWinner: false,
status: null,
name: 'Bosphorus',
picture: 'teamlogos/r7zn4gr8eajivapvjyzd',
},
],
},
];
export default function AdminEditTournamentBraket({
tournamentId,
}: ITournament) {
const [bracketMatchs, setBracketMatchs] = useState<Match[]>([]);

const fetchTournamentGames = useCallback(async () => {
console.log('Fetching more data...');
try {
const res = await mockInstance.get(`/tournament/${tournamentId}/games`);
const data: TournamentGame[] = res.data.games;
const bracketMatchs = convertTournamentGamesToBracketMatchs(data);
setBracketMatchs(bracketMatchs);
return data;
} catch (error) {
console.error('Error fetching data:', error);
}
}, []);

useEffect(() => {
fetchTournamentGames();
}, [fetchTournamentGames]);

export default function AdminEditTournamentBraket() {
return (
<div className={styles['whole']}>
<TournamentBraket singleEliminationBracketMatchs={simpleSmallBracket} />
<TournamentBraket singleEliminationBracketMatchs={bracketMatchs} />
</div>
);
}
6 changes: 4 additions & 2 deletions components/modal/modalType/AdminModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ export default function AdminModal() {
profile,
item,
coinPolicy,
tournamentInfo,
tournament,
} = useRecoilValue(modalState);

const content: { [key: string]: JSX.Element | null } = {
Expand Down Expand Up @@ -78,7 +78,9 @@ export default function AdminModal() {
'ADMIN-COINPOLICY_EDIT': coinPolicy ? (
<AdminEditCoinPolicyModal {...coinPolicy} />
) : null,
'ADMIN-TOURNAMENT_BRAKET_EDIT': <AdminEditTournamentBraket />,
'ADMIN-TOURNAMENT_BRAKET_EDIT': tournament ? (
<AdminEditTournamentBraket {...tournament} />
) : null,
};

if (!modalName) return null;
Expand Down
2 changes: 1 addition & 1 deletion components/tournament-record/WinnerSwiper.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -93,4 +93,4 @@ const WinnerSwiper = forwardRef(
// forwardRef에 들어가는 익명함수에 대한 name
WinnerSwiper.displayName = 'WinnerSwiper';

export default WinnerSwiper;
export default WinnerSwiper;
2 changes: 2 additions & 0 deletions components/tournament/TournamentBraket.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,8 @@ interface TournamentBraketProps {
export default function TournamentBraket({
singleEliminationBracketMatchs,
}: TournamentBraketProps) {
if (singleEliminationBracketMatchs.length === 0)
return <h1 style={{ color: 'white' }}>Loading...</h1>;
// const [width, height] = useWindowSize();
const finalWidth = 500; //Math.max(width - 50, 500);
const finalHeight = 500; //Math.max(height - 100, 500);
Expand Down
1 change: 0 additions & 1 deletion components/tournament/TournamentMatch.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,6 @@ function TournamentMatchParty({
<div className={styles.partyName}>{party.name || teamNameFallback}</div>
<div className={styles.score}>
{party.resultText ?? resultFallback(party)}
{/* <input value={topParty.resultText ?? resultFallback(topParty)} /> */}
</div>
</div>
);
Expand Down
9 changes: 1 addition & 8 deletions constants/admin/table.ts
Original file line number Diff line number Diff line change
Expand Up @@ -152,14 +152,7 @@ export const tableFormat: TableFormat = {
},
tournament: {
name: '토너먼트',
columns: [
'title',
'content',
'startTime',
'endTime',
'tournamentType',
'edit',
],
columns: ['title', 'contents', 'startTime', 'endTime', 'type', 'edit'],
},
tournamentCreate: {
name: '토너먼트 생성',
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,102 @@
import { TournamentGame } from 'types/tournamentTypes';

export const dummyLiveTournamentGames = {
games: [
{
tournamentGameId: 19753,
game: null,
status: 'SCHEDULED',
nextTournamentGameId: null,
},
{
tournamentGameId: 19754,
game: null,
status: 'SCHEDULED',
nextTournamentGameId: 19753,
},
{
tournamentGameId: 19755,
game: {
gameId: 1,
status: 'END',
mode: 'TOURNAMENT',
time: '13',
team1: {
players: [
{
intraId: 'CoKe BoYz',
userImageUri:
'https://avatars.githubusercontent.com/u/93255519?v=4',
level: 3,
},
],
isWin: true,
score: 2,
},
team2: {
players: [
{
intraId: 'Aids Team',
userImageUri:
'https://avatars.githubusercontent.com/u/93255519?v=4',
level: 3,
},
],
isWin: false,
score: 1,
},
},
status: 'SCORE_DONE',
nextTournamentGameId: 19754,
},
{
tournamentGameId: 19756,
nextTournamentGameId: 19754,
status: 'RUNNING',
game: null,
},
{
tournamentGameId: 19757,
nextTournamentGameId: 19753,
status: 'SCHEDULED',
game: null,
},
{
tournamentGameId: 19758,
nextTournamentGameId: 19757,
status: 'SCHEDULED',
game: null,
},
{
tournamentGameId: 19759,
nextTournamentGameId: 19757,
status: 'SCHEDULED',
game: {
gameId: 1,
status: 'LIVE',
mode: 'TOURNAMENT',
time: '13',
team1: {
players: [
{
intraId: 'BLUEJAYS',
userImageUri:
'https://avatars.githubusercontent.com/u/93255519?v=4',
level: 3,
},
],
},
team2: {
players: [
{
intraId: 'Bosphorus',
userImageUri:
'https://avatars.githubusercontent.com/u/93255519?v=4',
level: 3,
},
],
},
},
},
],
};
Loading

0 comments on commit af667fc

Please sign in to comment.