From 2571e40eb7c50599405f3db896cc703d332bf184 Mon Sep 17 00:00:00 2001 From: Lee sang Yeop Date: Wed, 25 Oct 2023 23:49:47 +0900 Subject: [PATCH 1/3] =?UTF-8?q?Fix:=20=EC=B1=84=EB=84=90=20=EB=B3=B4?= =?UTF-8?q?=EB=93=9C(=EA=B3=B5=EC=A7=80=EC=82=AC=ED=95=AD)=20=EA=B4=80?= =?UTF-8?q?=EB=A6=AC=EC=9E=90=EA=B0=80=20=EB=93=9C=EB=9E=98=EA=B7=B8?= =?UTF-8?q?=EC=95=A4=EB=93=9C=EB=9E=8D=EC=9C=BC=EB=A1=9C=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD=ED=95=98=EC=A7=80=20=EB=AA=BB=ED=96=88=EB=8D=98=20?= =?UTF-8?q?=EC=97=90=EB=9F=AC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Sidebar/BoardBar/BoardBody.tsx | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/src/components/Sidebar/BoardBar/BoardBody.tsx b/src/components/Sidebar/BoardBar/BoardBody.tsx index 485e0f7..956b10e 100644 --- a/src/components/Sidebar/BoardBar/BoardBody.tsx +++ b/src/components/Sidebar/BoardBar/BoardBody.tsx @@ -97,7 +97,7 @@ const BoardBody = ({ channelLink }: Props) => { method: 'post', url: `/api/channel/${channelLink}/order`, data: { - channelBoardLoadDtoList: boards, + channelBoardLoadDtoList: customedBoards, }, }); @@ -117,7 +117,7 @@ const BoardBody = ({ channelLink }: Props) => { const [removed] = newBoards.splice(source.index, 1); newBoards.splice(destination.index, 0, removed); for (let i = 0; i < newBoards.length; i++) { - newBoards[i].boardIndex = i; + newBoards[i].boardIndex = i + 1; } postCustomBoard(newBoards); }; @@ -171,7 +171,7 @@ const BoardBody = ({ channelLink }: Props) => { )}
- 보드 목록 + 대회 관리 {channelPermission === 0 && ( { 대진표 + 공지사항 {boards && boards.map((board, index) => channelPermission === 0 ? ( - + {(provided) => ( { data-id={board.boardId} data-board-title={board.boardTitle} onClick={onClickBoard} - isSelected={board.boardId === selected} + isSelected={board.boardId.toString() === selected} > {board.boardTitle} From 0141553fb16e7f6aeb44f2b40ab0d4b15bd5d219 Mon Sep 17 00:00:00 2001 From: Lee sang Yeop Date: Wed, 25 Oct 2023 23:50:34 +0900 Subject: [PATCH 2/3] =?UTF-8?q?Style:=20=ED=98=84=EC=9E=AC=20=EC=84=A0?= =?UTF-8?q?=ED=83=9D=EB=90=9C=20=EB=B3=B4=EB=93=9C=20=EC=83=89=EC=83=81=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Sidebar/BoardBar/BoardBody.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/components/Sidebar/BoardBar/BoardBody.tsx b/src/components/Sidebar/BoardBar/BoardBody.tsx index 956b10e..a7379ee 100644 --- a/src/components/Sidebar/BoardBar/BoardBody.tsx +++ b/src/components/Sidebar/BoardBar/BoardBody.tsx @@ -254,11 +254,13 @@ const Wrapper = styled.li<{ isSelected: boolean }>` align-items: center; cursor: pointer; &:hover { - background-color: #39587e; + background: linear-gradient(90deg, rgba(211, 250, 255, 0.3) 0%, rgba(211, 250, 255, 0) 128.25%); } color: white; - ${({ isSelected }) => isSelected && `background-color: #39587E`}; + ${({ isSelected }) => + isSelected && + `background: linear-gradient(90deg, rgba(211, 250, 255, 0.30) 0%, rgba(211, 250, 255, 0.00) 128.25%)`}; `; const CurrentRound = styled.div` From 82b6559509f3a6296e32775bb99e2a52ec332837 Mon Sep 17 00:00:00 2001 From: Lee sang Yeop Date: Thu, 26 Oct 2023 01:33:27 +0900 Subject: [PATCH 3/3] =?UTF-8?q?Fix:=20=EC=B1=84=EB=84=90=20=EB=B3=B4?= =?UTF-8?q?=EB=93=9C=20=EC=95=84=EC=9D=B4=EB=94=94=20=ED=83=80=EC=9E=85?= =?UTF-8?q?=EC=9D=84=20string=20=EC=97=90=EC=84=9C=20number=20=EB=A1=9C=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- __mocks__/handlers/boardHandlers.ts | 26 +++++++++---------- src/@types/board.ts | 2 +- src/components/Sidebar/BoardBar/BoardBody.tsx | 23 +++++++++++----- 3 files changed, 31 insertions(+), 20 deletions(-) diff --git a/__mocks__/handlers/boardHandlers.ts b/__mocks__/handlers/boardHandlers.ts index ef06f7d..24ef140 100644 --- a/__mocks__/handlers/boardHandlers.ts +++ b/__mocks__/handlers/boardHandlers.ts @@ -10,7 +10,7 @@ interface BoardsInfo { [key: string]: { myMatchRound: number; myMatchId: number; - channelBoardLoadDtdList: Channels[]; + channelBoardLoadDtoList: Channels[]; }; } @@ -45,19 +45,19 @@ const boardsInfo: BoardsInfo = { '123': { myMatchRound: 0, myMatchId: 0, - channelBoardLoadDtdList: [ + channelBoardLoadDtoList: [ { - boardId: 'aaa', + boardId: 111, boardTitle: '공지사항', boardIndex: 0, }, { - boardId: 'bbb', + boardId: 222, boardTitle: '게임 룰', boardIndex: 1, }, { - boardId: 'ccc', + boardId: 333, boardTitle: '커뮤니티', boardIndex: 2, }, @@ -66,19 +66,19 @@ const boardsInfo: BoardsInfo = { '234': { myMatchRound: 1, myMatchId: 1, - channelBoardLoadDtdList: [ + channelBoardLoadDtoList: [ { - boardId: 'bbb', + boardId: 222, boardTitle: '리그 공지사항', boardIndex: 0, }, { - boardId: 'ccc', + boardId: 333, boardTitle: '참여자 규칙', boardIndex: 1, }, { - boardId: 'ddd', + boardId: 444, boardTitle: '참여하기', boardIndex: 2, }, @@ -87,19 +87,19 @@ const boardsInfo: BoardsInfo = { '456': { myMatchRound: 2, myMatchId: 2, - channelBoardLoadDtdList: [ + channelBoardLoadDtoList: [ { - boardId: 'eee', + boardId: 333, boardTitle: '리그 공지사항', boardIndex: 0, }, { - boardId: 'fff', + boardId: 444, boardTitle: '참여자 규칙', boardIndex: 1, }, { - boardId: 'ggg', + boardId: 555, boardTitle: '참여하기', boardIndex: 2, }, diff --git a/src/@types/board.ts b/src/@types/board.ts index d1cf010..bcdf1e3 100644 --- a/src/@types/board.ts +++ b/src/@types/board.ts @@ -8,7 +8,7 @@ export interface BoardInfo { } export interface Channels { - boardId: string; + boardId: number; boardTitle: string; boardIndex: number; } diff --git a/src/components/Sidebar/BoardBar/BoardBody.tsx b/src/components/Sidebar/BoardBar/BoardBody.tsx index a7379ee..10c79e2 100644 --- a/src/components/Sidebar/BoardBar/BoardBody.tsx +++ b/src/components/Sidebar/BoardBar/BoardBody.tsx @@ -83,13 +83,13 @@ const BoardBody = ({ channelLink }: Props) => { if (boards === undefined) return; const res = await postData(channelLink); const newBoard: Channels = { - boardId: res.boardId.toString(), + boardId: res.boardId, boardTitle: res.boardTitle, boardIndex: res.boardIndex, }; setBoards((prevBoards) => [...prevBoards, newBoard]); - selectBoardId(newBoard.boardId); - handleBoard(channelLink, newBoard.boardId, res.boardTitle); + selectBoardId(newBoard.boardId.toString()); + handleBoard(channelLink, newBoard.boardId.toString(), res.boardTitle); }; const postCustomBoard = async (customedBoards: Channels[]) => { @@ -116,6 +116,7 @@ const BoardBody = ({ channelLink }: Props) => { const newBoards = [...boards]; const [removed] = newBoards.splice(source.index, 1); newBoards.splice(destination.index, 0, removed); + console.log(newBoards); for (let i = 0; i < newBoards.length; i++) { newBoards[i].boardIndex = i + 1; } @@ -135,11 +136,17 @@ const BoardBody = ({ channelLink }: Props) => { if (isSuccess) { const tmpBoards = data.channelBoardLoadDtoList; - selectBoardId(tmpBoards[0].boardId); - handleBoard(channelLink, tmpBoards[0].boardId, tmpBoards[0].boardTitle); + selectBoardId(tmpBoards[0].boardId.toString()); + handleBoard(channelLink, tmpBoards[0].boardId.toString(), tmpBoards[0].boardTitle); } }, [channelLink, isSuccess]); + useEffect(() => { + if (!boards.length || !data?.channelBoardLoadDtoList) return; + if (JSON.stringify(boards) === JSON.stringify(data.channelBoardLoadDtoList)) return; + setBoards(data.channelBoardLoadDtoList); + }, [data?.channelBoardLoadDtoList]); + return ( @@ -196,7 +203,11 @@ const BoardBody = ({ channelLink }: Props) => { {boards && boards.map((board, index) => channelPermission === 0 ? ( - + {(provided) => (