diff --git a/src/app/themes/[theme]/page.tsx b/src/app/themes/[theme]/page.tsx index 7d7b0e9..ab32280 100644 --- a/src/app/themes/[theme]/page.tsx +++ b/src/app/themes/[theme]/page.tsx @@ -4,7 +4,6 @@ import { Navigation } from "@/components/navigation"; import ThemePage from "@/components/theme-page"; import { getThemeFromId } from "@/lib/themes"; import { Metadata, ResolvingMetadata } from "next"; -import { useParams } from "next/navigation"; export async function generateMetadata( { params, searchParams }: any, @@ -38,17 +37,9 @@ export async function generateMetadata( } export default async function ThemeInfoPage() { - const params = useParams<{ theme: string }>(); - const { theme: themeID } = params; - - const theme = await getThemeFromId(themeID); - if (!theme) { - return
Theme not found
; - } - return (
- +
diff --git a/src/components/theme-page.tsx b/src/components/theme-page.tsx index 6a89b9d..b61c8ff 100644 --- a/src/components/theme-page.tsx +++ b/src/components/theme-page.tsx @@ -1,12 +1,21 @@ import Image from "next/image"; -import { getThemeAuthorLink, getThemeMarkdown, ZenTheme } from "@/lib/themes"; +import { getThemeAuthorLink, getThemeFromId, getThemeMarkdown, ZenTheme } from "@/lib/themes"; import { Button } from "./ui/button"; import { useEffect, useState } from "react"; import Markdown from "react-markdown"; import '../app/privacy-policy/markdown.css'; import { ChevronLeft, LoaderCircleIcon } from "lucide-react"; +import { useParams } from "next/navigation"; + +export default async function ThemePage() { + const params = useParams<{ theme: string }>(); + const { theme: themeID } = params; + + const theme = await getThemeFromId(themeID); + if (!theme) { + return
Theme not found
; + } -export default function ThemePage({ theme }: { theme: ZenTheme }) { const [readme, setReadme] = useState(null); useEffect(() => { getThemeMarkdown(theme).then(setReadme);