fix(website): hydration issues due to rendering on the server of client-side logic

This commit is contained in:
Elian Doran
2025-09-28 00:58:15 +03:00
parent bd2eb6fdbb
commit 5b673e753b
4 changed files with 22 additions and 13 deletions

View File

@@ -1,16 +1,18 @@
import { getRecommendedDownload } from "../download-helper.js";
import { getRecommendedDownload, RecommendedDownload } from "../download-helper.js";
import "./DownloadButton.css";
import Button from "./Button.js";
import downloadIcon from "../assets/boxicons/bx-arrow-in-down-square-half.svg?raw";
import packageJson from "../../../../package.json" with { type: "json" };
import { useEffect, useState } from "preact/hooks";
interface DownloadButtonProps {
big?: boolean;
}
const recommendedDownload = getRecommendedDownload();
export default function DownloadButton({ big }: DownloadButtonProps) {
const [ recommendedDownload, setRecommendedDownload ] = useState<RecommendedDownload | null>();
useEffect(() => setRecommendedDownload(getRecommendedDownload()), []);
return (recommendedDownload &&
<Button
className={`download-button desktop-only ${big ? "big" : ""}`}