demo download functionality

This commit is contained in:
SethBurkart123
2024-05-03 11:54:41 +10:00
parent 52cd3a0930
commit 9091b6d09d
3 changed files with 13 additions and 7 deletions
+8 -2
View File
@@ -45,8 +45,12 @@ const Store = () => {
));
}, [searchTerm, gridThemes]);
const downloadTheme = (id: string) => {
window.open(`https://betterseqta.pockethost.io/api/v1/themes/${id}/download`, '_blank');
};
return (
<div className="w-screen h-screen overflow-y-scroll bg-zinc-100 dark:bg-zinc-900">
<div className="w-screen h-screen overflow-y-scroll bg-zinc-200/50 dark:bg-zinc-900">
<Header searchTerm={searchTerm} setSearchTerm={setSearchTerm} />
@@ -131,7 +135,9 @@ const Store = () => {
<img src={theme.coverImage} alt="Theme Preview" className="object-cover w-full h-48 rounded-md" />
</div>
<div>
<button className="px-4 py-2 mt-4 transition rounded-full dark:text-white bg-zinc-300 dark:bg-zinc-800 dark:hover:bg-zinc-700 hover:bg-zinc-200 focus:outline-none focus:ring-2 focus:ring-zinc-800 focus:ring-offset-2">
<button
onClick={() => downloadTheme(theme.id)}
className="px-4 py-2 mt-4 transition rounded-full dark:text-white bg-zinc-300 dark:bg-zinc-800 dark:hover:bg-zinc-700 hover:bg-zinc-200 focus:outline-none focus:ring-2 focus:ring-zinc-800 focus:ring-offset-2">
Download
</button>
</div>
+3 -3
View File
@@ -100,11 +100,11 @@ const Theme = () => {
<h2 className="mb-2 text-2xl font-bold">{theme.name}</h2>
<p className="mb-8">{theme.description}</p>
{
/* currentThemes.includes((theme.theme as { id: string }).id) */ false ?
currentThemes.includes((theme.theme as { id: string }).id) ?
<button
className="flex justify-center w-full gap-1 px-3 py-2 text-white transition cursor-not-allowed rounded-2xl ring-white/20 ring-1 bg-zinc-950/20"
>
Theme Installed
Theme Downloaded!
</button>
:
<button
@@ -114,7 +114,7 @@ const Theme = () => {
setCurrentThemes([...currentThemes, (theme.theme as { id: string }).id]);
}}
>
Install Theme
Download Theme
</button>
}
</>