ivabus/gui
1
0
Fork 0
mirror of https://github.com/ivabus/gui synced 2025-04-23 14:07:14 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

uninstall button (#485)

Browse source 
* uninstall button

* add trash icon

* update installed_versions

* uninstall and card fixes

---------

Co-authored-by: neil molina <neil@neils-MacBook-Pro.local>
This commit is contained in:
Neil 2023-04-22 08:59:03 +08:00 committed by GitHub
parent 5bcc17c328
commit 3fd5012d8c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 58 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

53
modules/desktop/src/components/package-banner/package-banner.svelte
View file

@ -63,16 +63,37 @@
>
{/if}
<p class="mt-4 text-sm">{pkg.desc}</p>
<menu class="mt-4 grid h-10 grid-cols-3 gap-4 text-xs">
<PackageVersionSelector
buttonSize="large"
{pkg}
availableVersions={findAvailableVersions(pkg)}
onClick={install}
uninstall={async () => {
packagesStore.uninstallPkg(pkg);
}}
/>
<menu class="mt-4 flex h-10 gap-4 text-xs">
<div class="min-w-[150px]">
<PackageVersionSelector
buttonSize="large"
{pkg}
availableVersions={findAvailableVersions(pkg)}
onClick={install}
/>
</div>
{#if (pkg?.installed_versions?.length || 0) > 0}
<ToolTip class="ml-[-80px]">
<Button
slot="target"
class="h-10"
type="plain"
color="blue"
onClick={async () => {
packagesStore.uninstallPkg(pkg);
}}
loading={pruning}
>
<div class="version-item flex w-full items-center justify-center gap-x-1 text-xs">
<div class="icon-trash" />
<div>{$t("package.cta-UNINSTALL")}</div>
</div>
</Button>
<div slot="tooltip-content" class="flex flex-col items-center">
<div>Removes all the versions of the package</div>
</div>
</ToolTip>
{/if}
{#if (pkg?.installed_versions?.length || 0) > 1}
<ToolTip>
<Button
@ -95,17 +116,17 @@
</ToolTip>
{/if}
{#if pkg.github}
<Button
class="h-10"
type="plain"
color="black"
onClick={() => {
<button
class="border-gray group flex h-[40px] w-[40px] items-center justify-center rounded-sm border hover:bg-[#e1e1e1]"
on:click={() => {
if (pkg.github) {
const slug = trimGithubSlug(pkg.github);
shellOpenExternal(`https://github.com/${slug}`);
}
}}>{$t("common.view-on-github")}</Button
}}
>
<div class="icon-github text-xl text-gray flex group-hover:text-black" />
</button>
{/if}
</menu>
</article>

8
modules/desktop/src/components/package-card/package-card.svelte
View file

@ -143,31 +143,37 @@
}
aside.left {
left: 0px;
height: 100%;
width: 40%;
}
aside.right {
height: 100%;
right: 0px;
width: 60%;
}
figure {
position: absolute;
bottom: 0px;
left: 0px;
width: 100%;
height: 340px;
background-size: cover;
background-repeat: no-repeat;
}
aside.bottom {
left: 0px;
}
aside.right figure {
height: 100%;
width: 150%;
right: 0px;
}
aside.left figure {
height: 100%;
width: 250%;
left: 0px;
}
.content-container {

16
modules/desktop/src/components/package-install-button/package-version-selector.svelte
View file

@ -11,10 +11,6 @@
console.log("do nothing");
};
export let uninstall = async () => {
console.log("do nothing");
};
$: isOpened = false;
const toggleOpen = (evt?: MouseEvent) => {
@ -38,8 +34,6 @@
isOpened = false;
if (version) {
onClick(version);
} else {
uninstall();
}
};
@ -50,16 +44,6 @@
<PackageStateButton {buttonSize} {pkg} onClick={toggleOpen}>
<div slot="selector" class="pt-2">
<div class="version-list" class:visible={isOpened}>
{#if (pkg?.installed_versions || []).length > 0}
<!-- svelte-ignore a11y-click-events-have-key-events -->
<div
class="version-item flex items-center justify-start gap-x-1 text-xs"
on:click={(evt) => handleClick(evt, "")}
>
<div>uninstall</div>
</div>
<hr class="divider" />
{/if}
{#each availableVersions as version, idx}
{#if idx !== 0}<hr class="divider" />{/if}
<!-- svelte-ignore a11y-click-events-have-key-events -->

10
modules/desktop/src/libs/stores/pkgs.ts
View file

@ -212,13 +212,18 @@ To read more about this package go to [${guiPkg.homepage}](${guiPkg.homepage}).
};
const uninstallPkg = async (pkg: GUIPackage) => {
let fakeTimer: NodeJS.Timer | null = null;
try {
fakeTimer = withFakeLoader(pkg, (progress) => {
updatePackage(pkg.full_name, { install_progress_percentage: progress });
});
for (const v of pkg.installed_versions || []) {
await deletePkg(pkg, v);
}
setTimeout(() => {
updatePackage(pkg.full_name, {
state: PackageStates.AVAILABLE
state: PackageStates.AVAILABLE,
installed_versions: []
});
}, 3000);
} catch (error) {
@ -227,6 +232,9 @@ To read more about this package go to [${guiPkg.homepage}](${guiPkg.homepage}).
message: `Package ${pkg.full_name} failed to uninstall.`,
type: NotificationType.ERROR
});
} finally {
fakeTimer && clearTimeout(fakeTimer);
updatePackage(pkg.full_name, { install_progress_percentage: 0 });
}
};

1
modules/desktop/src/libs/translations/translations.json
View file

@ -10,6 +10,7 @@
"cta-INSTALLED": "INSTALLED",
"cta-INSTALLING": "INSTALLING",
"cta-UNINSTALLED": "RE-INSTALL",
"cta-UNINSTALL": "UNINSTALL",
"cta-NEEDS_UPDATE": "UPDATE",
"cta-UPDATING": "UPDATING",
"cta-PRUNE": "PRUNE",

BIN
modules/ui/src/icons/fonts/tea-icons.eot
View file

Binary file not shown.

1
modules/ui/src/icons/fonts/tea-icons.svg
View file

@ -64,4 +64,5 @@
<glyph glyph-name="apple" unicode="&#50;" d="M453 165c-8-24-19-48-35-72-25-37-49-56-74-56-9 0-22 3-40 10-16 6-30 9-43 9-11 0-25-3-40-10-16-6-28-9-38-9-29 0-58 24-86 74-28 49-42 97-42 143 0 44 11 79 32 107 21 28 49 41 81 41 14 0 31-3 51-8 20-6 33-9 39-9 9 0 22 3 41 10 20 6 36 10 50 10 22 0 43-7 60-19 10-7 20-16 30-29-15-12-26-24-32-33-13-18-19-38-19-59 0-24 7-45 20-64 13-19 28-31 45-36z m-108 335c0-12-2-25-8-39-6-14-14-27-26-39-11-11-21-17-31-21-7-2-17-4-30-5 1 29 8 53 22 74 14 20 38 34 72 42 0-1 0-2 0-3 1-2 1-3 1-3 0-1 0-2 0-3 0-1 0-2 0-3z"/>
<glyph glyph-name="map" unicode="&#51;" d="M146 512c3 0 5-1 7-3 2-2 2-4 2-6l0-421c0-4-1-6-4-8l-138-73c-1-1-2-1-4-1-2 0-4 1-6 3-2 2-3 4-3 6l0 421c0 4 2 6 5 8l137 73c1 1 3 1 4 1z m357 0c2 0 4-1 6-3 2-2 3-4 3-6l0-421c0-4-2-6-5-8l-137-73c-1-1-3-1-4-1-3 0-5 1-7 3-2 2-2 4-2 6l0 421c0 4 1 6 4 8l138 73c1 1 2 1 4 1z m-320 0c1 0 3 0 4-1l146-73c4-2 5-5 5-8l0-421c0-2-1-4-2-6-2-2-4-3-7-3-1 0-3 0-4 1l-146 73c-4 2-5 5-5 8l0 421c0 2 1 4 2 6 2 2 4 3 7 3z"/>
<glyph glyph-name="grid" unicode="&#52;" d="M21 469l0-448 448 0 0 448z m405-149l-106 0 0 107 106 0z m0-128l-106 0 0 107 106 0z m0-128l-106 0 0 107 106 0z m-362 107l107 0 0-107-107 0z m0 128l107 0 0-107-107 0z m0 128l107 0 0-107-107 0z m234-107l-106 0 0 107 106 0 0-107z m0-128l-106 0 0 107 106 0 0-107z m-106-21l106 0 0-107-106 0z"/>
<glyph glyph-name="trash" unicode="&#53;" d="M201 119l0 201c0 3-1 5-2 7-2 1-4 2-7 2l-18 0c-3 0-5-1-7-2-2-2-2-4-2-7l0-201c0-3 0-5 2-7 2-1 4-2 7-2l18 0c3 0 5 1 7 2 1 2 2 4 2 7z m73 0l0 201c0 3-1 5-2 7-2 1-4 2-7 2l-18 0c-3 0-5-1-7-2-1-2-2-4-2-7l0-201c0-3 1-5 2-7 2-1 4-2 7-2l18 0c3 0 5 1 7 2 1 2 2 4 2 7z m73 0l0 201c0 3 0 5-2 7-2 1-4 2-7 2l-18 0c-3 0-5-1-7-2-1-2-2-4-2-7l0-201c0-3 1-5 2-7 2-1 4-2 7-2l18 0c3 0 5 1 7 2 2 2 2 4 2 7z m-155 283l128 0-14 34c-1 1-3 2-5 3l-90 0c-2-1-4-2-5-3z m265-9l0-18c0-3-1-5-2-7-2-1-4-2-7-2l-27 0 0-271c0-16-5-30-14-41-9-12-20-17-32-17l-238 0c-12 0-23 5-32 16-9 11-14 25-14 41l0 272-27 0c-3 0-5 1-7 2-1 2-2 4-2 7l0 18c0 3 1 5 2 7 2 1 4 2 7 2l88 0 20 48c3 7 8 13 16 18 7 5 15 7 22 7l92 0c7 0 15-2 22-7 8-5 13-11 16-18l20-48 88 0c3 0 5-1 7-2 1-2 2-4 2-7z"/>
</font></defs></svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 30 KiB

BIN
modules/ui/src/icons/fonts/tea-icons.ttf
View file

Binary file not shown.

BIN
modules/ui/src/icons/fonts/tea-icons.woff
View file

Binary file not shown.

3
modules/ui/src/icons/icons.css
View file

@ -208,3 +208,6 @@
.icon-grid:before {
content: "\34";
}
.icon-trash:before {
content: "\35";
}