diff --git a/src/assets/img/back.png b/src/assets/img/back.png
new file mode 100644
index 0000000..02acabd
Binary files /dev/null and b/src/assets/img/back.png differ
diff --git a/src/components/AbstractTeam/AbstractTeam.tsx b/src/components/AbstractTeam/AbstractTeam.tsx
index 3eaeb6d..3a67e2e 100644
--- a/src/components/AbstractTeam/AbstractTeam.tsx
+++ b/src/components/AbstractTeam/AbstractTeam.tsx
@@ -487,6 +487,21 @@ export const AbstractTeam = (Component: (props: AbstractTeamType) => any, props:
}
};
+ const onDayChange = (directionNext: boolean) => {
+ if (directionNext) {
+ const upcomingWeekExists = deadlineInfo.weeks.find((week: Week) => !!(state.visibleWeekId && (week.id > state.visibleWeekId)));
+ if (upcomingWeekExists && state.visibleWeekId) {
+ setState({ ...state, visibleWeekId: state.visibleWeekId + 1 });
+ }
+ } else {
+ const previousWeekExists = deadlineInfo.weeks.find((week: Week) => !!(state.visibleWeekId && (week.id < state.visibleWeekId)));
+
+ if (previousWeekExists && state.visibleWeekId) {
+ setState({ ...state, visibleWeekId: state.visibleWeekId - 1 });
+ }
+ }
+ };
+
const onPlayerSwap = (player: Player) => {
if (player && player.id === state.swapPlayerId) {
const pickBackResult = state.validator.pick(player);
@@ -721,6 +736,7 @@ export const AbstractTeam = (Component: (props: AbstractTeamType) => any, props:
onTransfersSubmit={onTransfersSubmit}
onTransfersReset={onTransfersReset}
reloadUserTeams={reloadUserTeams}
+ onDayChange={onDayChange}
teamUser={state.teamUser}
initializedExternally={state.initializedExternally}
visibleWeekId={state.visibleWeekId}
diff --git a/src/components/Calendar/Calendar.tsx b/src/components/Calendar/Calendar.tsx
index 71ca4dc..d792822 100644
--- a/src/components/Calendar/Calendar.tsx
+++ b/src/components/Calendar/Calendar.tsx
@@ -39,6 +39,8 @@ export const Calendar = (props: CalendarProps) => {
weekId: props.weekId
});
+ useEffect(() => setState({...state, weekId: props.weekId}), [props]);
+
const onFilterChange = (name: string, value: string | number) => {
const filters: any = Object.assign({}, state.filters, { [name]: value });
setState({ ...state, filters });
diff --git a/src/components/MatchdaySelector/MatchdaySelector.tsx b/src/components/MatchdaySelector/MatchdaySelector.tsx
new file mode 100644
index 0000000..373f6a2
--- /dev/null
+++ b/src/components/MatchdaySelector/MatchdaySelector.tsx
@@ -0,0 +1,33 @@
+import { useTranslation } from "react-i18next";
+import { ButtonStyle, MatchdaySelectorStyle } from "./MatchdaySelectorStyle";
+
+type MatchdaySelectorProps = {
+ day: number
+ name: string
+ min: number
+ max: number
+ onNext: any
+ onPrev: any
+}
+
+export const MatchdaySelector = (props: MatchdaySelectorProps) => {
+ const [t] = useTranslation();
+ const previousDisabled = props.min && props.day === props.min;
+ const nextDisabled = props.max && props.day === props.max - 1;
+
+ return (
+
+ ({}) : props.onPrev}
+ />
+ {t("general.footballWeek")} {props.day} {props.name ? ` - ${props.name}` : ""}
+ ({}) : props.onNext}
+ />
+
+ );
+};
\ No newline at end of file
diff --git a/src/components/MatchdaySelector/MatchdaySelectorStyle.tsx b/src/components/MatchdaySelector/MatchdaySelectorStyle.tsx
new file mode 100644
index 0000000..93a3e0e
--- /dev/null
+++ b/src/components/MatchdaySelector/MatchdaySelectorStyle.tsx
@@ -0,0 +1,30 @@
+import styled from "@/styles/styled-components";
+
+export const MatchdaySelectorStyle = styled.div`
+ text-align: center;
+ font-weight: bold;
+ padding: 5px;
+ font-size:18px;
+
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+`;
+
+export const ButtonStyle = styled.a`
+ display: block;
+ width: 50px;
+ height: 50px;
+ cursor: pointer;
+ background: url(/src/assets/img/back.png) center center / 20px 20px no-repeat rgb(255,255,255);
+ border-radius: 50%;
+ margin: 0 0 0 5px;
+ &.disabled {
+ cursor: not-allowed;
+ }
+
+ ${({ type }) => type === "next" && `
+ transform: rotate(180deg);
+ margin: 0 5px 0 0;
+ `}
+`;
\ No newline at end of file
diff --git a/src/pages/Points/Points.tsx b/src/pages/Points/Points.tsx
index 8e12637..7c3bd6e 100644
--- a/src/pages/Points/Points.tsx
+++ b/src/pages/Points/Points.tsx
@@ -23,6 +23,7 @@ import { Calendar } from "@/components/Calendar/Calendar";
import { Stats } from "@/components/Stats/Stats";
import { PointsStats } from "@/components/PointsStats/PointsStats";
import teamBackground from "./../../assets/img/fpl-pitch-no-boarding.svg";
+import { MatchdaySelector } from "@/components/MatchdaySelector/MatchdaySelector";
export const _TeamPoints = (props: AbstractTeamType) => {
const { id } = useParams();
@@ -38,12 +39,16 @@ export const _TeamPoints = (props: AbstractTeamType) => {
const application = useSelector((state: StoreState) => state.application);
const location = useLocation();
+ const {
+ visibleWeekId,
+ } = props;
const deadlineWeek = useMemo(() => deadlineInfoSuccess && deadlineInfo.deadlineInfo.deadlineWeek, [deadlineInfo]);
const deadlineDate = useMemo(() => deadlineInfoSuccess && deadlineInfo.deadlineInfo.deadlineDate, [deadlineInfo]);
- const visibleWeekId = useMemo(() => deadlineInfoSuccess && deadlineInfo.deadlineInfo.displayWeek, [deadlineInfo]);
+ // const visibleWeekId = useMemo(() => deadlineInfoSuccess && deadlineInfo.deadlineInfo.displayWeek, [deadlineInfo]);
const currentWeek = useMemo(() => deadlineInfoSuccess && deadlineInfo.weeks.find((week: Week) => week.id === visibleWeekId), [visibleWeekId, deadlineInfo]);
+
const parsePlayerPointsValue = (value: string) => {
try {
return JSON.parse(value);
@@ -146,10 +151,11 @@ export const _TeamPoints = (props: AbstractTeamType) => {
};
useEffect(() => {
+ console.log("EFFECT, visibleweekid", visibleWeekId);
if (deadlineInfoSuccess && clubsSuccess && teamSuccess && matchesSuccess) {
getTeamInfo(visibleWeekId);
}
- }, [clubsSuccess, teamSuccess, matchesSuccess, deadlineInfoSuccess]);
+ }, [clubsSuccess, teamSuccess, matchesSuccess, deadlineInfoSuccess, visibleWeekId]);
const { starting, bench, initializedExternally, teamName, teamUser, captainId, viceCaptainId, teamPointsInfo } = props;
@@ -183,10 +189,14 @@ export const _TeamPoints = (props: AbstractTeamType) => {
(initializedExternally && visibleWeekId &&
- {/* TODO: MATCHDAYSELECTOR */}
-
- Week {visibleWeekId}
-
+ props.onDayChange(false)}
+ onNext={(e: any) => props.onDayChange(true)}
+ />
)
|| null
@@ -291,4 +301,4 @@ export const _TeamPoints = (props: AbstractTeamType) => {
);
};
-export const PointsPage = () => AbstractTeam(_TeamPoints, {});
\ No newline at end of file
+export const PointsPage = () => AbstractTeam(_TeamPoints, {}, { mode: "points" });
\ No newline at end of file
diff --git a/src/types/component_types.tsx b/src/types/component_types.tsx
index bb2bb15..90de89e 100644
--- a/src/types/component_types.tsx
+++ b/src/types/component_types.tsx
@@ -1,51 +1,52 @@
declare type AbstractTeamType = {
- setStarting: (starting: any[]) => void,
- setBench: (bench: any[]) => void,
- setBudget: (budget: number) => void,
- setTeamName: (name: string) => void,
- setCaptainId: (captainId: number) => void,
- setActivePositionFilter: (positionId: number) => void,
- isPickAble: (player: Player, taxForPicking?: boolean, isTransferPick?: boolean) => any,
- isSwapAble: (player: Player) => any,
- onTeamSave: () => Promise,
- onTeamReset: (team: any) => Promise,
- onTeamNameChange: (e: any) => void,
- onCaptainSelect: (player: Player) => void,
- onViceCaptainSelect: (player: Player, captainFirstInList?: boolean) => void,
- removeBenchPlayer: (player: Player) => void,
- removeStartingPlayer: (player: Player) => void,
- removePlayer: (player: Player) => void,
- pickPlayer: (player: Player, taxForPicking?: boolean) => void,
- activePositionFilter?: any,
- starting?: any[],
- bench?: any[],
- captainId?: number ,
- viceCaptainId?: number ,
- teamName?: string,
- budget?: number,
- swapPlayerId?: any,
- swappedFrom?: string | null,
- teamNameChanged?: boolean,
- initTeamState: (starting: any[], bench: any[], teamName: string, captainId: number, budget: number, leagues?: any[] | undefined, visibleWeekId?: number | undefined, teamPointsInfo?: any, rawTransfers?: any[] | undefined, deadlineWeekTransfers?: any[] | undefined, pastTransfers?: any[] | undefined, viceCaptainId?: number, boosters?: Boosters, isTeamOwner?: boolean, teamUser?: any) => void,
- resetTeamName: () => void,
- onTeamNameUpdate: (teamId: number) => void,
- onTeamEdit: (team: any) => void,
- onTeamSelectionsUpdate: (teamId: number, weekId: number) => void,
- onPlayerSwap: (player: Player) => void,
- loadAllMatches: () => void,
- onTransferPlayerOut: (player: Player, extra?: boolean) => void,
- onDraftTransfersClear: () => void,
- onTransferPlayerIn: (player: Player) => void,
- onTransfersSubmit: (teamId: number) => void,
- onTransfersReset: (teamId: number) => void,
- reloadUserTeams: () => void,
- teamUser?: any,
- savingTeamPending?: any,
- visibleWeekId: number | null,
- boosters: Boosters,
- initializedExternally: boolean,
- deadlineWeekTransfers: Transfer[] | null,
+ setStarting: (starting: any[]) => void,
+ setBench: (bench: any[]) => void,
+ setBudget: (budget: number) => void,
+ setTeamName: (name: string) => void,
+ setCaptainId: (captainId: number) => void,
+ setActivePositionFilter: (positionId: number) => void,
+ isPickAble: (player: Player, taxForPicking?: boolean, isTransferPick?: boolean) => any,
+ isSwapAble: (player: Player) => any,
+ onTeamSave: () => Promise,
+ onTeamReset: (team: any) => Promise,
+ onTeamNameChange: (e: any) => void,
+ onCaptainSelect: (player: Player) => void,
+ onViceCaptainSelect: (player: Player, captainFirstInList?: boolean) => void,
+ removeBenchPlayer: (player: Player) => void,
+ removeStartingPlayer: (player: Player) => void,
+ removePlayer: (player: Player) => void,
+ pickPlayer: (player: Player, taxForPicking?: boolean) => void,
+ activePositionFilter?: any,
+ starting?: any[],
+ bench?: any[],
+ captainId?: number,
+ viceCaptainId?: number,
+ teamName?: string,
+ budget?: number,
+ swapPlayerId?: any,
+ swappedFrom?: string | null,
+ teamNameChanged?: boolean,
+ initTeamState: (starting: any[], bench: any[], teamName: string, captainId: number, budget: number, leagues?: any[] | undefined, visibleWeekId?: number | undefined, teamPointsInfo?: any, rawTransfers?: any[] | undefined, deadlineWeekTransfers?: any[] | undefined, pastTransfers?: any[] | undefined, viceCaptainId?: number, boosters?: Boosters, isTeamOwner?: boolean, teamUser?: any) => void,
+ resetTeamName: () => void,
+ onTeamNameUpdate: (teamId: number) => void,
+ onTeamEdit: (team: any) => void,
+ onTeamSelectionsUpdate: (teamId: number, weekId: number) => void,
+ onPlayerSwap: (player: Player) => void,
+ loadAllMatches: () => void,
+ onTransferPlayerOut: (player: Player, extra?: boolean) => void,
+ onDraftTransfersClear: () => void,
+ onTransferPlayerIn: (player: Player) => void,
+ onTransfersSubmit: (teamId: number) => void,
+ onTransfersReset: (teamId: number) => void,
+ reloadUserTeams: () => void,
+ onDayChange: (directionNext: boolean) => void,
+ teamUser?: any,
+ savingTeamPending?: any,
+ visibleWeekId: number | null,
+ boosters: Boosters,
+ initializedExternally: boolean,
+ deadlineWeekTransfers: Transfer[] | null,
draftTransfers: Transfer[] | null,
pastTransfers: Transfer[] | null,
- teamPointsInfo: any,
+ teamPointsInfo: any,
}
\ No newline at end of file