Add ErrorBoundary to /mine, remove header underline

src/app/(drift)/layout.tsx

@@ -3,9 +3,7 @@ import { Providers } from "./providers"
 import Layout from "@components/layout"
 import { Toasts } from "@components/toasts"
 import Header from "@components/header"
-import { Inter } from "@next/font/google"
+import { Inter } from "next/font/google"
-import { Suspense } from "react"
-import { Spinner } from "@components/spinner"
 
 const inter = Inter({ subsets: ["latin"], variable: "--inter-font" })
 
@@ -22,9 +20,7 @@ export default async function RootLayout({
 				<Toasts />
 				<Layout>
 					<Providers>
-						<Suspense fallback={<Spinner />}>
+						<Header />
-							<Header />
-						</Suspense>
 						{children}
 					</Providers>
 				</Layout>

src/app/(drift)/mine/page.tsx

@@ -4,6 +4,7 @@ import PostList from "@components/post-list"
 import { getCurrentUser } from "@lib/server/session"
 import { authOptions } from "@lib/server/auth"
 import { Suspense } from "react"
+import ErrorBoundary from "@components/error/fallback"
 
 export default async function Mine() {
 	const userId = (await getCurrentUser())?.id
@@ -14,14 +15,16 @@ export default async function Mine() {
 
 	const posts = (await getPostsByUser(userId, true)).map(serverPostToClientPost)
 	return (
-		<Suspense fallback={<PostList skeleton={true} initialPosts={[]} />}>
+		<ErrorBoundary>
-			<PostList
+			<Suspense fallback={<PostList skeleton={true} initialPosts={[]} />}>
-				userId={userId}
+				<PostList
-				initialPosts={posts}
+					userId={userId}
-				isOwner={true}
+					initialPosts={posts}
-				hideSearch={false}
+					isOwner={true}
-			/>
+					hideSearch={false}
-		</Suspense>
+				/>
+			</Suspense>
+		</ErrorBoundary>
 	)
 }
 

src/app/components/header/header.module.css

@@ -21,13 +21,12 @@
 .tabs button,
 .tabs a {
 	color: var(--darker-gray);
-	transition: color, box-shadow 0.2s ease-in-out;
+	transition: color 0.2s ease;
 }
 
 .tabs .buttons a:hover,
 .tabs .buttons button:hover {
 	color: var(--fg);
-	box-shadow: inset 0 -1px 0 var(--fg);
 }
 
 .wrapper {

src/app/pages/[fileId]/[fileTitle]/layout.tsx

@@ -2,7 +2,7 @@ import "@styles/globals.css"
 import "@styles/markdown.css"
 
 import Layout from "@components/layout"
-import { Inter } from "@next/font/google"
+import { Inter } from "next/font/google"
 import ThemeProvider from "./theme-provider"
 
 const inter = Inter({ subsets: ["latin"], variable: "--inter-font" })