mirror of
https://github.com/ivabus/gui
synced 2025-04-23 14:07:14 +03:00
5fec6e16f9
* #374 rm custom tea-cli notification * #370 apply i18n to several statements * #370 remove unused i18n and components --------- Co-authored-by: neil molina <neil@neils-MacBook-Pro.local>
60 lines
1.7 KiB
Svelte
60 lines
1.7 KiB
Svelte
<script lang="ts">
|
|
import "$appcss";
|
|
import "@tea/ui/icons/icons.css";
|
|
import { t } from '$libs/translations';
|
|
import Button from "@tea/ui/button/button.svelte";
|
|
|
|
import { installPackage } from "@native";
|
|
import { PackageStates, type GUIPackage } from "$libs/types";
|
|
import { packagesStore } from "$libs/stores";
|
|
import { shellOpenExternal } from "@native";
|
|
import InstallButton from "$components/install-button/install-button.svelte";
|
|
import { findAvailableVersions } from "$libs/packages/pkg-utils";
|
|
|
|
export let pkg: GUIPackage;
|
|
let installing = false;
|
|
|
|
const install = async () => {
|
|
installing = true;
|
|
await installPackage(pkg);
|
|
installing = false;
|
|
packagesStore.updatePackage(pkg.full_name, {
|
|
state: PackageStates.INSTALLED
|
|
});
|
|
};
|
|
</script>
|
|
|
|
<section class="mt-4 bg-black">
|
|
<header class="flex">
|
|
<figure class="grow-1 w-1/3">
|
|
<img width={260} src={pkg.thumb_image_url} alt={pkg.full_name} />
|
|
</figure>
|
|
<article class="w-2/3 p-4 pt-8">
|
|
<h3 class="text-primary text-3xl">{pkg.full_name}</h3>
|
|
{#if pkg.homepage}
|
|
<a target="_blank" rel="noreferrer" href={pkg.homepage}>
|
|
<span>{pkg.homepage}</span>
|
|
</a>
|
|
{/if}
|
|
<p class="mt-4 text-sm">{pkg.desc}</p>
|
|
<menu class="mt-4 grid h-10 grid-cols-2 gap-4 text-xs">
|
|
<InstallButton
|
|
buttonSize="large"
|
|
{pkg}
|
|
availableVersions={findAvailableVersions(pkg)}
|
|
onClick={install}
|
|
/>
|
|
{#if pkg.github}
|
|
<Button
|
|
class="h-10"
|
|
type="plain"
|
|
color="black"
|
|
onClick={() => {
|
|
shellOpenExternal(`https://github.com/${pkg.github}`);
|
|
}}>{$t("common.view-on-github")}</Button
|
|
>
|
|
{/if}
|
|
</menu>
|
|
</article>
|
|
</header>
|
|
</section>
|