more error handling

components/Gist/Gist.tsx

@@ -9,7 +9,13 @@ const Gist = async ({ id, file }: GistProps) => {
   const iframeId = `gist-${id}${file ? `-${file}` : ""}`;
 
   const scriptUrl = `https://gist.github.com/${id}.js${file ? `?file=${file}` : ""}`;
-  const scriptResponse = await fetch(scriptUrl);
+  const scriptResponse = await fetch(scriptUrl, {
+    cache: "force-cache",
+    next: {
+      // cache indefinitely in data store
+      revalidate: 0,
+    },
+  });
 
   if (!scriptResponse.ok) {
     console.warn(`[gist] failed to fetch js:`, scriptResponse.statusText);

components/YouTube/YouTube.module.css

@@ -1,4 +0,0 @@
-/* stylelint-disable-next-line selector-type-no-unknown */
-.wrapper lite-youtube {
-  margin: 0 auto;
-}

components/YouTube/YouTube.tsx

@@ -1,17 +1,14 @@
-import { YouTubeEmbed } from "@next/third-parties/google";
+"use client";
 
-import styles from "./YouTube.module.css";
+import YouTubeEmbed from "react-lite-youtube-embed";
+import type { ComponentPropsWithoutRef } from "react";
 
-export type YouTubeProps = {
-  id: string;
-};
+import "react-lite-youtube-embed/dist/LiteYouTubeEmbed.css";
 
-const YouTube = ({ id }: YouTubeProps) => {
-  return (
-    <div className={styles.wrapper}>
-      <YouTubeEmbed videoid={id} />
-    </div>
-  );
+export type YouTubeProps = Omit<ComponentPropsWithoutRef<typeof YouTubeEmbed>, "title">;
+
+const YouTube = ({ ...rest }: YouTubeProps) => {
+  return <YouTubeEmbed cookie={false} containerElement="div" title="" {...rest} />;
 };
 
 export default YouTube;