diff --git a/packages/website/src/components/TierList/Row.tsx b/packages/website/src/components/TierList/Row.tsx index 52eea6978..f05db2fe2 100644 --- a/packages/website/src/components/TierList/Row.tsx +++ b/packages/website/src/components/TierList/Row.tsx @@ -39,7 +39,7 @@ export function TierListRow({ index }: TierListRowProps) { - + {tanks.map((id, tankIndex) => { const tank = tankDefinitions.tanks[id]; return ( diff --git a/packages/website/src/components/TierList/Table/constants.ts b/packages/website/src/components/TierList/Table/constants.ts index c90423b36..dbf4896ff 100644 --- a/packages/website/src/components/TierList/Table/constants.ts +++ b/packages/website/src/components/TierList/Table/constants.ts @@ -15,3 +15,4 @@ export const tierListRowElements = new Set(); export const tierListCardElements = tierListRows.map( () => new Set(), ); +export const placedTanks = new Set(); diff --git a/packages/website/src/components/TierList/Tile.tsx b/packages/website/src/components/TierList/Tile.tsx index 6b4a22447..c8fbe7cb0 100644 --- a/packages/website/src/components/TierList/Tile.tsx +++ b/packages/website/src/components/TierList/Tile.tsx @@ -71,6 +71,7 @@ export function TierListTile(props: TierListTileProps) { const cardRect = card.current.getBoundingClientRect(); const cardX = (cardRect.left + cardRect.right) / 2; const cardY = (cardRect.top + cardRect.bottom) / 2; + let wasPlaced = false; rowLoop: for (const row of tierListRowElements) { const rowRect = row.getBoundingClientRect(); @@ -108,6 +109,8 @@ export function TierListTile(props: TierListTileProps) { draft.tanks[rowIndex].splice(tileIndex, 0, props.tank.id); }); + wasPlaced = true; + break rowLoop; } @@ -119,9 +122,20 @@ export function TierListTile(props: TierListTileProps) { draft.tanks[rowIndex].push(props.tank.id); }); + wasPlaced = true; + break; } + if (!wasPlaced) { + mutateTierList((draft) => { + draft.dragging = false; + draft.tanks = draft.tanks.map((row) => + row.filter((tankId) => tankId !== props.tank.id), + ); + }); + } + card.current.style.position = 'static'; card.current.style.zIndex = 'unset'; card.current.style.cursor = 'grab';