From 3802b1392ee34b85d3520e9869853b3ac13ebe71 Mon Sep 17 00:00:00 2001 From: Carl Kittelberger Date: Mon, 4 Jan 2021 17:31:36 +0100 Subject: [PATCH] Fix some typing. --- frontend/pages/[id].tsx | 35 ++++++++++++++++++++------------- frontend/pages/[id]/[vslug].tsx | 22 +++++++++++++++++++-- frontend/pages/index.tsx | 16 +++++++++------ frontend/util/session.ts | 9 +++------ 4 files changed, 54 insertions(+), 28 deletions(-) diff --git a/frontend/pages/[id].tsx b/frontend/pages/[id].tsx index dd8bd06..520ba28 100644 --- a/frontend/pages/[id].tsx +++ b/frontend/pages/[id].tsx @@ -14,8 +14,17 @@ import VideoList from '../components/VideoList'; import { notFound } from '../util/status'; import { getIndex, getVideos } from '../util/api'; import { VideoEntry } from '../util/datatypes/VideoList'; +import { GetServerSideProps, NextPage } from 'next'; -export async function getServerSideProps({ params: { id } }: { params: { id: string } }) { +interface VideoListPageProps { + id?: string, + lastUpdatedAt?: string, + thumbnailServerURL?: string, + title?: string, + videos?: Array, +}; + +export const getServerSideProps: GetServerSideProps = async ({ params: { id } }) => { // Fetch URL to thumbnails server const { ids, @@ -36,12 +45,14 @@ export async function getServerSideProps({ params: { id } }: { params: { id: str const { title } = vodMeta; + const requestedID = typeof id === 'string' ? id : id[0]; + // Fetch list of videos for this VOD ID - const vodInfo = await getVideos(id); + const vodInfo = await getVideos(requestedID); const { videos } = vodInfo; let lastUpdatedAt = null; lastUpdatedAt = vodInfo.lastUpdatedAt; - const finalVideos = videos + const finalVideos: VideoEntry[] = videos .map((video: VideoEntry) => ({ ...video, duration: typeof video.duration === 'string' ? parseFloat(video.duration) : video.duration || null, @@ -52,7 +63,7 @@ export async function getServerSideProps({ params: { id } }: { params: { id: str // Pass data to the page via props return { props: { - id, + id: requestedID, thumbnailServerURL, title, videos: finalVideos, @@ -61,19 +72,13 @@ export async function getServerSideProps({ params: { id } }: { params: { id: str }; } -export default function VideoListPage({ +const VideoListPage: NextPage = ({ id, lastUpdatedAt, thumbnailServerURL, title, videos, -}: { - id: string, - lastUpdatedAt: string, - thumbnailServerURL: string, - title: string, - videos: Array -}) { +}) => { if (!id) { return notFound(); } @@ -91,8 +96,8 @@ export default function VideoListPage({ {title} {' '} - – - {' '} + – + {' '} {intl.formatMessage({ id: 'App.title', description: 'The full title of the website', @@ -148,3 +153,5 @@ export default function VideoListPage({ </div> ); } + +export default VideoListPage; diff --git a/frontend/pages/[id]/[vslug].tsx b/frontend/pages/[id]/[vslug].tsx index 90e7e0c..2bd9a65 100644 --- a/frontend/pages/[id]/[vslug].tsx +++ b/frontend/pages/[id]/[vslug].tsx @@ -10,7 +10,7 @@ import { import { useIntl } from 'react-intl'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { GetServerSideProps, InferGetServerSidePropsType } from 'next'; +import { GetServerSideProps, GetServerSidePropsResult, InferGetServerSidePropsType } from 'next'; import { VideoEntry } from 'util/datatypes/VideoList'; import DownloadButton from 'components/DownloadButton'; import { basename } from 'path'; @@ -30,7 +30,25 @@ import { submitPreferences, } from '../../util/api'; -const getProps = withSession(async (req, _res, { id, vslug }: { id: string, vslug: string }) => { +interface VideoPlayerPageParameters { + id: string, + vslug: string, +} + +interface VideoPlayerPageProps { + id?: string, + vslug?: string, + video?: number, + volume?: number, + redirect?: boolean, + title?: string, + hlsServerURL?: string, + dashServerURL?: string, + basePath?: string, + twitchPlayerParentKey?: string, +} + +const getProps = withSession(async (req, _res, { id, vslug }: VideoPlayerPageParameters): Promise<GetServerSidePropsResult<VideoPlayerPageProps>> => { if (typeof id !== 'string') { throw new Error('only expected a single id'); } diff --git a/frontend/pages/index.tsx b/frontend/pages/index.tsx index 2c13305..af109be 100644 --- a/frontend/pages/index.tsx +++ b/frontend/pages/index.tsx @@ -9,20 +9,22 @@ import { useIntl } from 'react-intl'; import { FormattedMessage } from '../components/localization'; import { VideoOnDemandIndex } from '../util/datatypes/VideoOnDemandIdentifier'; import { getIndex } from '../util/api'; +import { GetServerSideProps, NextPage } from 'next'; -export async function getServerSideProps() { +interface HomeProps { + index: VideoOnDemandIndex +} + +export const getServerSideProps: GetServerSideProps<HomeProps> = async () => { // Fetch VOD IDs and announcements - const { announcements, ids } = await getIndex(); - return { props: { - announcements, - ids, + index: await getIndex(), }, }; } -export default function Home({ announcements, ids }: VideoOnDemandIndex) { +const Home: NextPage<HomeProps> = ({ index: { announcements, ids } }) => { const intl = useIntl(); return ( <div> @@ -83,3 +85,5 @@ export default function Home({ announcements, ids }: VideoOnDemandIndex) { </div> ); } + +export default Home; diff --git a/frontend/util/session.ts b/frontend/util/session.ts index 9f4ee3b..dc7ed44 100644 --- a/frontend/util/session.ts +++ b/frontend/util/session.ts @@ -33,12 +33,9 @@ export type HandlerWithSession<T, U> = ? HandlerWithPageContextAndSession<U> : HandlerWithDocumentContextAndSession<U>; -export default function withSession<T>( - handler: ( - req: IncomingMessageWithSession, - res: NextApiResponse, - ...args: any) => Promise<T>, -): (...args: any) => Promise<T> { +export type SessionHandler<R = any, A = any, O = any> = (req: IncomingMessageWithSession, res: NextApiResponse<O>, ...args: Array<A>) => R; + +export default function withSession<R = any, A = any, O = any>(handler: SessionHandler<R, A, O>) { return withIronSession(handler, { cookieName: 'gdq-archive', cookieOptions: {