feat: improve structure and error handling

app/[lang]/(live)/error.tsx

@@ -0,0 +1,32 @@
+"use client" // Error components must be Client Components
+
+import { usePathname } from "next/navigation"
+import { useEffect } from "react"
+
+import { findLang } from "@/constants/languages"
+
+import { firaMono, firaSans } from "@/app/[lang]/(live)/fonts"
+
+import styles from "./error.module.css"
+
+export default function Error({
+  error,
+}: {
+  error: Error & { digest?: string }
+}) {
+  useEffect(() => {
+    // Log the error to an error reporting service
+    console.error(error)
+  }, [error])
+
+  const pathname = usePathname()
+  const lang = findLang(pathname)
+
+  return (
+    <div
+      className={`${firaMono.variable} ${firaSans.variable} ${styles.layout}`}
+    >
+      <div className={styles.content}>{lang}: Something went wrong!</div>
+    </div>
+  )
+}