86 lines
2.7 KiB
TypeScript
86 lines
2.7 KiB
TypeScript
|
|
"use client";
|
|||
|
|
|
|||
|
|
import { useEffect, useState } from "react";
|
|||
|
|
import { Play, Smartphone, Download } from "lucide-react";
|
|||
|
|
import { fetchLinks, FALLBACK_LINKS, type SiteLinks } from "@/lib/links";
|
|||
|
|
import { APP_URL } from "@/lib/site";
|
|||
|
|
|
|||
|
|
function BazaarIcon() {
|
|||
|
|
return <span className="text-lg">🛒</span>;
|
|||
|
|
}
|
|||
|
|
function MyketIcon() {
|
|||
|
|
return <span className="text-lg">🟢</span>;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export function DownloadButtons({ variant = "hero" }: { variant?: "hero" | "full" }) {
|
|||
|
|
const [links, setLinks] = useState<SiteLinks>(FALLBACK_LINKS);
|
|||
|
|
|
|||
|
|
useEffect(() => {
|
|||
|
|
let on = true;
|
|||
|
|
fetchLinks().then((l) => on && setLinks(l));
|
|||
|
|
return () => {
|
|||
|
|
on = false;
|
|||
|
|
};
|
|||
|
|
}, []);
|
|||
|
|
|
|||
|
|
const webUrl = links.webPlayUrl || APP_URL;
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<div className={variant === "hero" ? "flex flex-wrap gap-3" : "grid gap-3 sm:grid-cols-2"}>
|
|||
|
|
{/* Always available: play in browser */}
|
|||
|
|
<a href={webUrl} className="flex items-center justify-center gap-2 rounded-2xl btn-gold px-6 py-3.5 text-base">
|
|||
|
|
<Play size={18} /> بازی در مرورگر (رایگان)
|
|||
|
|
</a>
|
|||
|
|
|
|||
|
|
{links.bazaarEnabled && links.bazaarUrl && (
|
|||
|
|
<a
|
|||
|
|
href={links.bazaarUrl}
|
|||
|
|
target="_blank"
|
|||
|
|
rel="noopener"
|
|||
|
|
className="flex items-center justify-center gap-2 rounded-2xl glass px-6 py-3.5 text-base text-cream hover:border-gold/40"
|
|||
|
|
>
|
|||
|
|
<BazaarIcon /> کافهبازار
|
|||
|
|
</a>
|
|||
|
|
)}
|
|||
|
|
|
|||
|
|
{links.myketEnabled && links.myketUrl && (
|
|||
|
|
<a
|
|||
|
|
href={links.myketUrl}
|
|||
|
|
target="_blank"
|
|||
|
|
rel="noopener"
|
|||
|
|
className="flex items-center justify-center gap-2 rounded-2xl glass px-6 py-3.5 text-base text-cream hover:border-gold/40"
|
|||
|
|
>
|
|||
|
|
<MyketIcon /> مایکت
|
|||
|
|
</a>
|
|||
|
|
)}
|
|||
|
|
|
|||
|
|
{links.iosPwaEnabled && (
|
|||
|
|
<a
|
|||
|
|
href="/download#ios"
|
|||
|
|
className="flex items-center justify-center gap-2 rounded-2xl glass px-6 py-3.5 text-base text-cream hover:border-gold/40"
|
|||
|
|
>
|
|||
|
|
<span className="text-lg">🍏</span> نصب روی آیفون (iOS)
|
|||
|
|
</a>
|
|||
|
|
)}
|
|||
|
|
|
|||
|
|
{variant === "full" && links.iosPwaEnabled && (
|
|||
|
|
<a
|
|||
|
|
href="/download#android"
|
|||
|
|
className="flex items-center justify-center gap-2 rounded-2xl glass px-6 py-3.5 text-base text-cream hover:border-gold/40"
|
|||
|
|
>
|
|||
|
|
<Smartphone size={18} /> نصب روی اندروید (PWA)
|
|||
|
|
</a>
|
|||
|
|
)}
|
|||
|
|
|
|||
|
|
{links.directApkEnabled && links.directApkUrl && (
|
|||
|
|
<a
|
|||
|
|
href={links.directApkUrl}
|
|||
|
|
className="flex items-center justify-center gap-2 rounded-2xl glass px-6 py-3.5 text-base text-cream hover:border-gold/40"
|
|||
|
|
>
|
|||
|
|
<Download size={18} /> دانلود مستقیم APK
|
|||
|
|
</a>
|
|||
|
|
)}
|
|||
|
|
</div>
|
|||
|
|
);
|
|||
|
|
}
|