diff --git a/src/components/MatchCard/MatchCard.tsx b/src/components/MatchCard/MatchCard.tsx index 09a89fc0..c30f789e 100644 --- a/src/components/MatchCard/MatchCard.tsx +++ b/src/components/MatchCard/MatchCard.tsx @@ -23,6 +23,17 @@ type MatchCardProps = { clanId?: string; }; +const matchMode = (match: Match, clanId: string): string => { + let factionRe = /(Allie)s/; + let mode = " (" + if (match?.offensive) { + const side = match?.clans1_ids.includes(clanId) ? match?.side1 : match?.side2; + mode += side ? side.replace(factionRe, "$1d") + " " : "" + return mode + "Offensive)" + } + return mode + "Warfare)" +} + export const MatchCard: FC = ({ match, clanId }) => { const [sortedMatch, setSortedMatch] = useState(); const { getTag } = useClanTags(); @@ -61,7 +72,7 @@ export const MatchCard: FC = ({ match, clanId }) => { friendlyCaps={sortedMatch?.friendlyCaps} enemyCaps={sortedMatch?.enemyCaps} offensive={sortedMatch?.offensive} - attacker={match?.clans1_ids.includes(clanId || "")} + attacker={match?.clans1_ids.includes(clanId)} /> {sortedMatch && ( @@ -119,7 +130,7 @@ export const MatchCard: FC = ({ match, clanId }) => { {match?.map} - {match?.offensive && ` (Offensive ${match.side1})`} + {matchMode(match)} diff --git a/src/components/MatchCard/WinLooseBanner.tsx b/src/components/MatchCard/WinLooseBanner.tsx index d23503f5..6502cee3 100644 --- a/src/components/MatchCard/WinLooseBanner.tsx +++ b/src/components/MatchCard/WinLooseBanner.tsx @@ -23,7 +23,7 @@ export const WinLoseBanner: FC = ({ text = "\u200B"; background = "bg-gray-700"; } else if ( - (offensive && (attacker ? friendlyCaps : enemyCaps) === MAX_CAPS) || + (offensive && (attacker ? friendlyCaps === MAX_CAPS : enemyCaps !== MAX_CAPS)) || (!offensive && friendlyCaps > enemyCaps) ) { text = "VICTORY"; diff --git a/src/components/MatchesTable/MatchesTable.tsx b/src/components/MatchesTable/MatchesTable.tsx index 7b86f6e1..53636ffe 100644 --- a/src/components/MatchesTable/MatchesTable.tsx +++ b/src/components/MatchesTable/MatchesTable.tsx @@ -12,15 +12,19 @@ import { FC, useState } from "react"; import DataTable, { TableColumn } from "react-data-table-component"; const DEFAULT_PER_PAGE = 25; +const CAPS_TO_WIN = 3; export type FormattedMatch = Match & { id: string; allies: string[]; enemies: string[]; side: Factions; + enemy: Factions; caps: number; formattedDate: string; formattedDuration: string; + offensive?: boolean; + attacker?: boolean; }; const matchFormatter = (match: Match, clanId: string): FormattedMatch => { @@ -30,16 +34,21 @@ const matchFormatter = (match: Match, clanId: string): FormattedMatch => { formattedDuration: `${match.duration} min`, ...match, }; + formattedMatch.offensive = match.offensive !== undefined ? match.offensive : false; if (match.clans1_ids.includes(clanId)) { formattedMatch.allies = match.clans1_ids.filter((f) => f !== clanId); formattedMatch.enemies = match.clans2_ids; formattedMatch.side = match.side1; + formattedMatch.enemy = match.side2; formattedMatch.caps = match.caps1; + formattedMatch.attacker = formattedMatch.offensive ? true : false; } else { formattedMatch.allies = match.clans2_ids.filter((f) => f !== clanId); formattedMatch.enemies = match.clans1_ids; formattedMatch.side = match.side2; + formattedMatch.enemy = match.side1; formattedMatch.caps = match.caps2; + formattedMatch.attacker = false; } return formattedMatch as FormattedMatch; }; @@ -88,6 +97,16 @@ export const MatchesTable: FC = ({ } ); const { getTag } = useClanTags(); + const setResult = (match) => { + let result = "Defeat"; + if ( + (match.offensive && (match.attacker ? match.caps == 5 : match.caps >= 0)) || + (!match.offensive && match.caps >= CAPS_TO_WIN) + ) { + result = "Victory" + } + return result; + }; const defaultColumns: TableColumn[] = [ { @@ -108,6 +127,10 @@ export const MatchesTable: FC = ({ ), id: "date", }, + (clanId ? { + name: "Result", + selector: (match) => setResult(match), + } : null), { name: "Side 1", selector: (match) => match.clans1_ids[0], @@ -174,7 +197,24 @@ export const MatchesTable: FC = ({ ), }, - ]; + { + name: "Mode", + selector: (match) => { + let factionRe = /(Allie)s/; + let mode = "Warfare"; + if (match.offensive) { + mode = "Offensive"; + if (match.attacker && match?.side) { + mode = `${match.side.replace(factionRe, "$1d")} Offensive`; + } else if (!match.attacker && match?.enemy) { + mode = `${match.enemy.replace(factionRe, "$1d")} Offensive`; + } + } + return mode; + }, + sortable: true, + }, + ].filter(Boolean); const handlePageChange = (page: number) => { setTableMeta({ ...tableMeta, page });