import styled from "styled-components"
import React, { Suspense } from "react"
import { Switch, Route } from "react-router-dom"
import CenteredLoader from "../ui/CenteredLoader"
import RouteTracker from "../tracking/RouteTracker"
type ContentAreaProps = {
profileId: string
}
const ContentAreaRoot = styled.div`
position: relative;
display: flex;
flex-direction: column;
flex-grow: 1;
height: 100%;
overflow: auto;
z-index: 0;
padding-left: 70px;
overflow: hidden;
& > *{
flex-shrink: 0;
}
`
const ReceptionPageContent = React.lazy(() => import("./ReceptionPageContent"))
const NetworkingPageContent = React.lazy(() => import("./NetworkingPageContent"))
const MyProfilePageContent = React.lazy(() => import("./MyProfilePageContent"))
const MyFavoritesPageContent = React.lazy(() => import("./MyFavoritesPageContent"))
const CategoriesPageContent = React.lazy(() => import("./CategoriesPageContent"))
const InfosPageContent = React.lazy(() => import("./InfosPageContent"))
const TestPageContent = React.lazy(() => import("./TestPage"))
const HistoryPageContent = React.lazy(() => import("./HistoryPageContent"))
const OrganizationDetailPageContent = React.lazy(() => import("./detailPages/OrganizationDetailPageContent"))
const PersonDetailPageContent = React.lazy(() => import("./detailPages/PersonDetailPageContent"))
const EventDateDetailPageContent = React.lazy(() => import("./detailPages/EventDateDetailPageContent"))
const ProductDetailPageContent = React.lazy(() => import("./detailPages/ProductDetailPageContent"))
const NewsDetailPageContent = React.lazy(() => import("./detailPages/NewsDetailPageContent"))
const TrademarkDetailPageContent = React.lazy(() => import("./detailPages/TrademarkDetailPageContent"))
const CouponDetailPageContent = React.lazy(() => import("./detailPages/CouponDetailPageContent"))
const ConferenceRoom = React.lazy(() => import("../conference/ConferenceRoom"))
const ConferencePageContent = React.lazy(() => import("../conference/ConferencePageContent"))
const ExhibitorsPageContent = React.lazy(() => import("./ExhibitorsPageContent"))
const SpeakerPageContent = React.lazy(() => import("./SpeakerPageContent"))
const SessionsPageContent = React.lazy(() => import("./sessions/SessionsPageContent"))
const LiveStreamsPageContent = React.lazy(() => import("./LiveStreamsPageContent"))
const ProductsPageContent = React.lazy(() => import("./ProductsPageContent"))
const NewsPageContent = React.lazy(() => import("./NewsPageContent"))
const TrademarksPageContent = React.lazy(() => import("./TrademarksPageContent"))
const CouponsPageContent = React.lazy(() => import("./CouponsPageContent"))
const SponsorsPageContent = React.lazy(() => import("./SponsorsPageContent"))
const VideoPageContent = React.lazy(() => import("./VideoPageContent"))
const SchedulePageContent = React.lazy(() => import("./SchedulePageContent"))
const ExperiencesPageContent = React.lazy(() => import("./ExperiencesPageContent"))
const ProgramPageContent = React.lazy(() => import("./program/ProgramPageContent"))
export const meetingPageRoute = "/meetings/:kind/:roomName"
const ContentArea: React.FunctionComponent<ContentAreaProps> = (props) => (
<ContentAreaRoot>
<Suspense fallback={<CenteredLoader>Loading...</CenteredLoader>}>
<RouteTracker profileId={props.profileId} />
<Switch>
<Route path="/" exact component={ReceptionPageContent} />
<Route path="/networking" component={NetworkingPageContent} />
<Route path="/myprofile" component={MyProfilePageContent} />
<Route path="/favorites" component={MyFavoritesPageContent} />
<Route path="/categories" component={CategoriesPageContent} />
<Route path="/info" component={InfosPageContent} />
<Route path="/test" component={TestPageContent} />
<Route path="/history" component={HistoryPageContent} />
{/** Details */}
<Route path="/organization/:organizationName--:organizationId" component={OrganizationDetailPageContent} />
<Route path="/person/:personName--:personId--:userId" component={PersonDetailPageContent} />
<Route path="/eventdate/:eventdateName--:eventDateId" component={EventDateDetailPageContent} />
<Route path="/product/:productName--:productId" component={ProductDetailPageContent} />
<Route path="/news/:newsName--:newsId" component={NewsDetailPageContent} />
<Route path="/trademark/:trademarkName--:trademarkId" component={TrademarkDetailPageContent} />
<Route path="/coupon/:couponName--:couponId" component={CouponDetailPageContent} />
<Route path={meetingPageRoute} component={ConferenceRoom} />
<Route path="/meetings/:groupId" component={ConferencePageContent} />
<Route path="/meetings" component={ConferencePageContent} />
{/* the entity lists must be places below the detail pages because of the path pattern */}
<Route path="/organization" component={ExhibitorsPageContent} />
<Route path="/companiesFav" component={ExhibitorsPageContent} />
<Route path="/person" component={SpeakerPageContent} />
<Route path="/peopleFav" component={SpeakerPageContent} />
<Route path="/eventdate" component={SessionsPageContent} />
<Route path="/eventdateFav" component={SessionsPageContent} />
<Route path="/livestreams" component={LiveStreamsPageContent} />
<Route path="/product" component={ProductsPageContent} />
<Route path="/productsFav" component={ProductsPageContent} />
<Route path="/news" component={NewsPageContent} />
<Route path="/trademark" component={TrademarksPageContent} />
<Route path="/trademarksFav" component={TrademarksPageContent} />
<Route path="/coupon" component={CouponsPageContent} />
<Route path="/sponsor" component={SponsorsPageContent} />
<Route path="/masterclasses/:roomId" component={VideoPageContent} />
<Route path="/masterclasses/" component={VideoPageContent} />
<Route path="/experiences" component={ExperiencesPageContent} />
<Route path="/schedule" component={SchedulePageContent} />
<Route path="/program" component={ProgramPageContent} />
</Switch>
</Suspense>
</ContentAreaRoot>
)
export default ContentArea
Комментарии