-
- You are about to start uploading {uploadedFiles.length} files.
+
+ You are about to start uploading {uploadedFiles.length}{' '}
+ {uploadedFiles.length === 1 ? 'file' : 'files'}.
@@ -79,11 +81,12 @@ export const IndexPage: NextPage = () => {
}
return (
-
+
-
- You are uploading {uploadedFiles.length} files.
+
+ You are uploading {uploadedFiles.length}{' '}
+ {uploadedFiles.length === 1 ? 'file' : 'files'}.
@@ -93,9 +96,3 @@ export const IndexPage: NextPage = () => {
)
}
-
-IndexPage.getInitialProps = () => {
- return {}
-}
-
-export default IndexPage
diff --git a/src/channel.ts b/src/channel.ts
index 6970c2e..8066b34 100644
--- a/src/channel.ts
+++ b/src/channel.ts
@@ -1,3 +1,4 @@
+import 'server-only'
import config from './config'
import Redis from 'ioredis'
import { generateShortSlug, generateLongSlug } from './slugs'
diff --git a/src/components/CancelButton.tsx b/src/components/CancelButton.tsx
index 0303200..868676b 100644
--- a/src/components/CancelButton.tsx
+++ b/src/components/CancelButton.tsx
@@ -1,10 +1,10 @@
import React from 'react'
-type Props = {
+export default function CancelButton({
+ onClick,
+}: {
onClick: React.MouseEventHandler
-}
-
-const CancelButton: React.FC
= ({ onClick }: Props) => {
+}): JSX.Element {
return (
)
}
-
-export default CancelButton
diff --git a/src/components/DownloadButton.tsx b/src/components/DownloadButton.tsx
index d3542a7..c031820 100644
--- a/src/components/DownloadButton.tsx
+++ b/src/components/DownloadButton.tsx
@@ -1,10 +1,10 @@
import React from 'react'
-type Props = {
+export default function DownloadButton({
+ onClick,
+}: {
onClick?: React.MouseEventHandler
-}
-
-const DownloadButton: React.FC = ({ onClick }: Props) => {
+}): JSX.Element {
return (
)
}
-
-export default DownloadButton
diff --git a/src/components/Downloader.tsx b/src/components/Downloader.tsx
index 25c3505..ff3190d 100644
--- a/src/components/Downloader.tsx
+++ b/src/components/Downloader.tsx
@@ -1,3 +1,5 @@
+'use client'
+
import React, { useCallback, useEffect, useRef, useState } from 'react'
import { useWebRTC } from './WebRTCProvider'
import {
@@ -23,11 +25,12 @@ import ProgressBar from './ProgressBar'
const baseURL = process.env.NEXT_PUBLIC_BASE_URL ?? 'http://localhost:3000'
// eslint-disable-next-line @typescript-eslint/no-var-requires
-if (process.browser) require('web-streams-polyfill/ponyfill')
+if (typeof window !== 'undefined') require('web-streams-polyfill/ponyfill')
// eslint-disable-next-line @typescript-eslint/no-var-requires
-const streamSaver = process.browser ? require('streamsaver') : null
-if (process.browser) {
+const streamSaver =
+ typeof window !== 'undefined' ? require('streamsaver') : null
+if (typeof window !== 'undefined') {
streamSaver.mitm = baseURL + '/stream.html'
}
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index 82ee94a..cb174cc 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -1,21 +1,28 @@
+'use client'
+
import React, { useCallback } from 'react'
const DONATE_HREF =
'https://commerce.coinbase.com/checkout/247b6ffe-fb4e-47a8-9a76-e6b7ef83ea22'
-const FooterLink: React.FC<{ href: string; children: React.ReactNode }> = ({
+function FooterLink({
href,
children,
-}) => (
-
- {children}
-
-)
+}: {
+ href: string
+ children: React.ReactNode
+}): JSX.Element {
+ return (
+
+ {children}
+
+ )
+}
export function Footer(): JSX.Element {
const handleDonate = useCallback(() => {
@@ -23,34 +30,38 @@ export function Footer(): JSX.Element {
}, [])
return (
-
)
}
diff --git a/src/components/StartButton.tsx b/src/components/StartButton.tsx
index 6e4f99d..7beb376 100644
--- a/src/components/StartButton.tsx
+++ b/src/components/StartButton.tsx
@@ -1,10 +1,10 @@
import React from 'react'
-export function StartButton({
+export default function StartButton({
onClick,
}: {
- onClick: React.MouseEventHandler
-}): JSX.Element {
+ onClick: React.MouseEventHandler
+}): React.ReactElement {
return (