From 73106fc74ab2c4340e65dce0c8e9638caaba692b Mon Sep 17 00:00:00 2001
From: Sean Norwood <norwood.sean@gmail.com>
Date: Sun, 3 Apr 2022 20:04:17 +0000
Subject: [PATCH] chore: add external scripts

---
 tubearchivist/www/src/pages/_app.tsx | 34 +++++++++++++++++++++++++---
 1 file changed, 31 insertions(+), 3 deletions(-)

diff --git a/tubearchivist/www/src/pages/_app.tsx b/tubearchivist/www/src/pages/_app.tsx
index ba003d6..8cfca59 100644
--- a/tubearchivist/www/src/pages/_app.tsx
+++ b/tubearchivist/www/src/pages/_app.tsx
@@ -1,13 +1,41 @@
 import type { AppProps } from "next/app";
 import { SessionProvider } from "next-auth/react";
+import Script, { ScriptProps } from "next/script";
 import "../styles/globals.css";
 import "../styles/dark.css";
 
+// TODO: Do these scripts need to be on every page?
+
+type ClientOnlyScriptProps = {
+  src: string;
+} & ScriptProps;
+
+const ClientOnlyScript = ({ src, ...props }: ClientOnlyScriptProps) => {
+  if (typeof window !== "undefined") {
+    return <Script src={src} {...props} />;
+  }
+};
+
 function MyApp({ Component, pageProps: { session, ...pageProps } }: AppProps) {
   return (
-    <SessionProvider session={session}>
-      <Component {...pageProps} />
-    </SessionProvider>
+    <>
+      <Script
+        strategy="lazyOnload"
+        src="https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1"
+      />
+      <Script
+        onError={(e) => console.log(`Error loading script.js: ${e}`)}
+        strategy="lazyOnload"
+        src="/js/script.js"
+      />
+
+      {/** TODO: Detect casting before loading this */}
+      <ClientOnlyScript strategy="lazyOnload" src="cast-videos.js" />
+
+      <SessionProvider session={session}>
+        <Component {...pageProps} />
+      </SessionProvider>
+    </>
   );
 }