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 (
-
+
{/* At the bottom of the page */}
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);