Add TeamList ui component and teamList selectors

src/pages/Teams/TeamsPage.tsx

@@ -7,6 +7,8 @@ import { AppState, AppThunk, EntitiesRequest } from "../../store"
 import { Team } from "../../services/teams"
 import { fetchTeamListIfNeed } from "../../store/teamList"
 import styles from "./styles.module.scss"
+import TeamList from "../../components/Teams/TeamList"
+import TeamIntro from "../../components/Teams/TeamIntro"
 
 export type Props = RouteComponentProps
 
@@ -52,6 +54,9 @@ const TeamsPage: FC<Props> = (): JSX.Element => (
     <div className={styles.teamsPage}>
         <div className={styles.teamsContent}>
             <Helmet title="TeamsPage" />
+            <TeamIntro />
+            <TeamList />
+            <hr />
             {useList((state: AppState) => state.teamList, fetchTeamListIfNeed)()}
         </div>
     </div>

src/pages/Teams/index.tsx

@@ -1,9 +1,9 @@
 import loadable from "@loadable/component"
 
 import { Loading, ErrorBoundary } from "../../components"
-import { Props, loadData } from "./Teams"
+import { Props, loadData } from "./TeamsPage"
 
-const Teams = loadable(() => import("./Teams"), {
+const Teams = loadable(() => import("./TeamsPage"), {
     fallback: <Loading />,
 })
 

src/pages/Teams/styles.module.scss

@@ -5,5 +5,5 @@
 }
 
 .teamsContent {
-    @include page-content-wrapper(600px);
+    @include page-content-wrapper(700px);
 }