56 lines
1.9 KiB
TypeScript
Executable File
56 lines
1.9 KiB
TypeScript
Executable File
import React from 'react';
|
|
import {PageStatus} from '@common/http/page-status';
|
|
import {
|
|
ModelInsightsPageLayout,
|
|
ModelInsightsPageTitle,
|
|
} from '@app/admin/reports/model-insights-page-layout';
|
|
import {TitleLink} from '@app/titles/title-link';
|
|
import {InsightsReportRow} from '@app/admin/reports/insights/insights-report-row';
|
|
import {InsightsPlaysChart} from '@app/admin/reports/insights/insights-plays-chart';
|
|
import {InsightsDevicesChart} from '@app/admin/reports/insights/insights-devices-chart';
|
|
import {InsightsLocationsChart} from '@app/admin/reports/insights/insights-locations-chart';
|
|
import {InsightsPlatformsChart} from '@app/admin/reports/insights/insights-platforms-chart';
|
|
import {useSeason} from '@app/seasons/requests/use-season';
|
|
import {SeasonPoster} from '@app/seasons/season-poster';
|
|
import {SeasonLink} from '@app/seasons/season-link';
|
|
|
|
export function SeasonInsightsPage() {
|
|
const query = useSeason('season');
|
|
|
|
return query.data ? (
|
|
<ModelInsightsPageLayout
|
|
reportModel={`season=${query.data.season.id}`}
|
|
name={`Season ${query.data.season.number}`}
|
|
title={
|
|
<ModelInsightsPageTitle
|
|
image={
|
|
<SeasonPoster
|
|
season={query.data.season}
|
|
title={query.data.title}
|
|
srcSize="sm"
|
|
/>
|
|
}
|
|
name={
|
|
<SeasonLink
|
|
seasonNumber={query.data.season.number}
|
|
title={query.data.title}
|
|
/>
|
|
}
|
|
description={<TitleLink title={query.data.title} />}
|
|
/>
|
|
}
|
|
>
|
|
<InsightsReportRow>
|
|
<InsightsPlaysChart />
|
|
<InsightsDevicesChart />
|
|
</InsightsReportRow>
|
|
<InsightsReportRow>
|
|
<InsightsLocationsChart />
|
|
<InsightsPlatformsChart />
|
|
</InsightsReportRow>
|
|
</ModelInsightsPageLayout>
|
|
) : (
|
|
<PageStatus query={query} loaderClassName="absolute inset-0 m-auto" />
|
|
);
|
|
}
|