Fix some typing.

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<VideoEntry>,
+};
+
+export const getServerSideProps: GetServerSideProps<VideoListPageProps> = 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<VideoListPageProps> = ({
   id,
   lastUpdatedAt,
   thumbnailServerURL,
   title,
   videos,
-}: {
+}) => {
-  id: string,
-  lastUpdatedAt: string,
-  thumbnailServerURL: string,
-  title: string,
-  videos: Array<VideoEntry>
-}) {
   if (!id) {
     return notFound();
   }
@@ -91,8 +96,8 @@ export default function VideoListPage({
         <title>
           {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;

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');
   }

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,
+      index: await getIndex(),
-      ids,
     },
   };
 }
 
-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;

frontend/util/session.ts

@@ -33,12 +33,9 @@ export type HandlerWithSession<T, U> =
       ? HandlerWithPageContextAndSession<U>
       : HandlerWithDocumentContextAndSession<U>;
 
-export default function withSession<T>(
+export type SessionHandler<R = any, A = any, O = any> = (req: IncomingMessageWithSession, res: NextApiResponse<O>, ...args: Array<A>) => R;
-  handler: (
+
-    req: IncomingMessageWithSession,
+export default function withSession<R = any, A = any, O = any>(handler: SessionHandler<R, A, O>) {
-    res: NextApiResponse,
-    ...args: any) => Promise<T>,
-): (...args: any) => Promise<T> {
   return withIronSession(handler, {
     cookieName: 'gdq-archive',
     cookieOptions: {