joshuafhiggins/realm-homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refector: Add useEffect dependency

Browse Source
This commit is contained in:
Pushpank Dhruw
2024-08-22 21:43:23 +05:30
parent ba5028f72d
commit 38453638e1
1 changed files with 4 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/theme-page.tsx
View File

@@ -1,3 +1,4 @@
import Image from "next/image";
import { getThemeAuthorLink, getThemeMarkdown, ZenTheme } from "@/lib/themes"; import { getThemeAuthorLink, getThemeMarkdown, ZenTheme } from "@/lib/themes";
import { Button } from "./ui/button"; import { Button } from "./ui/button";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
@@ -9,12 +10,12 @@ export default function ThemePage({ theme }: { theme: ZenTheme }) {
const [readme, setReadme] = useState<string | null>(null); const [readme, setReadme] = useState<string | null>(null);
useEffect(() => { useEffect(() => {
getThemeMarkdown(theme).then(setReadme); getThemeMarkdown(theme).then(setReadme);
}, []); }, [theme]);
return ( return (
<div className="mt-24 lg:mt-56 flex-col lg:flex-row relative flex mx-auto items-start relative"> <div className="mt-24 lg:mt-56 flex-col lg:flex-row flex mx-auto items-start relative">
<div className="flex flex-col relative lg:fixed w-md h-full p-5 lg:p-0 lg:pr-5 mr-5 w-full md:max-w-sm"> <div className="flex flex-col relative lg:fixed w-md h-full p-5 lg:p-0 lg:pr-5 mr-5 w-full md:max-w-sm">
<img src={theme.image} alt={theme.name} className="w-full object-cover rounded-lg border-2 shadow" /> <Image src={theme.image} alt={theme.name} width={500} height={500} className="w-full object-cover rounded-lg border-2 shadow" />
<h1 className="text-2xl mt-5 font-bold">{theme.name}</h1> <h1 className="text-2xl mt-5 font-bold">{theme.name}</h1>
<p className="text-sm text-muted-foreground mt-2">{theme.description}</p> <p className="text-sm text-muted-foreground mt-2">{theme.description}</p>
{theme.homepage && ( {theme.homepage && (