diff --git a/src/pages/Teams/TeamsPage.tsx b/src/pages/Teams/TeamsPage.tsx index f90f3b6..17f24e9 100644 --- a/src/pages/Teams/TeamsPage.tsx +++ b/src/pages/Teams/TeamsPage.tsx @@ -1,10 +1,8 @@ -import { FC, useEffect, memo } from "react" +import { FC, memo } from "react" import { RouteComponentProps } from "react-router-dom" -import { useDispatch, useSelector, shallowEqual } from "react-redux" import { Helmet } from "react-helmet" -import { AppState, AppThunk, EntitiesRequest } from "../../store" -import { Team } from "../../services/teams" +import { AppThunk } from "../../store" import { fetchTeamListIfNeed } from "../../store/teamList" import styles from "./styles.module.scss" import TeamList from "../../components/Teams/TeamList" @@ -12,52 +10,12 @@ import TeamIntro from "../../components/Teams/TeamIntro" export type Props = RouteComponentProps -function useList( - stateToProp: (state: AppState) => EntitiesRequest, - fetchDataIfNeed: () => AppThunk -) { - const dispatch = useDispatch() - const { ids, entities, readyStatus } = useSelector(stateToProp, shallowEqual) - - // Fetch client-side data here - useEffect(() => { - dispatch(fetchDataIfNeed()) - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [dispatch]) - - return () => { - if (!readyStatus || readyStatus === "idle" || readyStatus === "request") - return

Loading...

- - if (readyStatus === "failure") return

Oops, Failed to load!

- - return ids.map((id) => { - const team = entities[id] - return team === undefined ? null : ( -
- {team.name}:{team.description} -
- Avant: {team.before} -
- Pendant: {team.during} -
- Après: {team.after} -
-
-
- ) - }) - } -} - const TeamsPage: FC = (): JSX.Element => (
-
- {useList((state: AppState) => state.teamList, fetchTeamListIfNeed)()}
)