diff --git a/src/features/HeaderFilters/store/hooks/index.tsx b/src/features/HeaderFilters/store/hooks/index.tsx index a588597f..0caa7a59 100644 --- a/src/features/HeaderFilters/store/hooks/index.tsx +++ b/src/features/HeaderFilters/store/hooks/index.tsx @@ -53,6 +53,7 @@ export const useFilters = () => { const [selectedMatchStatus, setSelectedMatchStatus] = useState(MatchStatuses.Live) const [selectedSportTypeId, setSelectedSportTypeId] = useState(null) const [selectedTournamentId, setSelectedTournamentId] = useState(null) + const [teamId, setTeamId] = useState(null) const [matches, setMatches] = useState({ broadcast: [], features: [], @@ -68,6 +69,7 @@ export const useFilters = () => { date: formattedDate, matchStatus: selectedMatchStatus, sportType: selectedSportTypeId, + teamId, tournamentId: selectedTournamentId, }).then(setMatches) }, [ @@ -75,6 +77,7 @@ export const useFilters = () => { selectedMatchStatus, selectedSportTypeId, selectedTournamentId, + teamId, ]) const prepareMatches = useCallback((content: Array) => pipe( @@ -132,12 +135,14 @@ export const useFilters = () => { setSelectedMatchStatus, setSelectedSportTypeId, setSelectedTournamentId, + setTeamId, }), [ selectedDate, selectedMatchStatus, selectedSportTypeId, selectedTournamentId, setSelectedTournamentId, + setTeamId, preparedMatches, ]) diff --git a/src/features/TeamPage/hooks.tsx b/src/features/TeamPage/hooks.tsx new file mode 100644 index 00000000..99d0d441 --- /dev/null +++ b/src/features/TeamPage/hooks.tsx @@ -0,0 +1,29 @@ +import { useEffect } from 'react' + +import { useHeaderFiltersStore } from 'features/HeaderFilters' +import { useSportNameParam, usePageId } from 'hooks' + +export const useTeamPage = () => { + const { sportType } = useSportNameParam() + const teamId = usePageId() + + const { + setSelectedSportTypeId, + setTeamId, + } = useHeaderFiltersStore() + + useEffect(() => { + setSelectedSportTypeId(sportType) + setTeamId(teamId) + + return () => { + setSelectedSportTypeId(null) + setTeamId(null) + } + }, [ + setSelectedSportTypeId, + setTeamId, + sportType, + teamId, + ]) +} diff --git a/src/features/TeamPage/index.tsx b/src/features/TeamPage/index.tsx index 8c8193f4..a0c6bb7a 100644 --- a/src/features/TeamPage/index.tsx +++ b/src/features/TeamPage/index.tsx @@ -1,12 +1,21 @@ import React from 'react' -import styled from 'styled-components' -const TempPageTitle = styled.span` - padding: 20px; - font-size: 20px; - color: white; -` +import { UserFavorites } from 'features/UserFavorites' +import { Matches } from 'features/Matches' +import { UserFavoritesStore } from 'features/UserFavorites/store' -export const TeamPage = () => ( - TEAM PAGE -) +import { useTeamPage } from './hooks' +import { Content } from './styled' + +export const TeamPage = () => { + useTeamPage() + + return ( + + + + + + + ) +} diff --git a/src/features/TeamPage/styled.tsx b/src/features/TeamPage/styled.tsx new file mode 100644 index 00000000..fcd79930 --- /dev/null +++ b/src/features/TeamPage/styled.tsx @@ -0,0 +1,5 @@ +import styled from 'styled-components/macro' + +export const Content = styled.main` + padding: 0 16px; +` diff --git a/src/features/TournamentPage/hooks.tsx b/src/features/TournamentPage/hooks.tsx index 67f4384c..6be5caab 100644 --- a/src/features/TournamentPage/hooks.tsx +++ b/src/features/TournamentPage/hooks.tsx @@ -22,9 +22,6 @@ export const useTournamentPage = () => { setSelectedTournamentId, } = useHeaderFiltersStore() - setSelectedSportTypeId(sportType) - setSelectedTournamentId(pageId) - const { [`name_${suffix}` as Name]: name = '', } = tournamentProfile || {} @@ -36,7 +33,18 @@ export const useTournamentPage = () => { useEffect(() => { getTournamentInfo(sportType, pageId) .then(setTournamentProfile) - }, [pageId, sportType]) + setSelectedSportTypeId(sportType) + setSelectedTournamentId(pageId) + + return () => { + setSelectedSportTypeId(null) + setSelectedTournamentId(null) + } + }, [pageId, + setSelectedSportTypeId, + setSelectedTournamentId, + sportType, + ]) return { infoItems: [country], diff --git a/src/requests/getMatches.tsx b/src/requests/getMatches.tsx index ab0bd5b2..efabec69 100644 --- a/src/requests/getMatches.tsx +++ b/src/requests/getMatches.tsx @@ -53,6 +53,7 @@ type Args = { date: string, matchStatus: MatchStatuses, sportType: SportTypes | null, + teamId: number | null, tournamentId: number | null, } @@ -67,6 +68,7 @@ export const getMatches = async ({ date, matchStatus, sportType, + teamId, tournamentId, }: Args) => { const config = { @@ -75,6 +77,7 @@ export const getMatches = async ({ _p_date: date, _p_sport: sportType, _p_stream_status: matchStatus, + _p_team_id: teamId, _p_tournament_id: tournamentId, }, proc,