mirror of
https://github.com/hydralauncher/hydra.git
synced 2025-03-09 15:40:26 +00:00
feat: add menu with download options on download page
This commit is contained in:
parent
ca953de464
commit
94ef1679a9
3 changed files with 79 additions and 72 deletions
|
@ -202,7 +202,8 @@
|
|||
"checking_files": "Checking files…",
|
||||
"seeding": "Seeding",
|
||||
"stop_seeding": "Stop seeding",
|
||||
"resume_seeding": "Resume seeding"
|
||||
"resume_seeding": "Resume seeding",
|
||||
"options": "Manage"
|
||||
},
|
||||
"settings": {
|
||||
"downloads_path": "Downloads path",
|
||||
|
|
|
@ -198,7 +198,8 @@
|
|||
"checking_files": "Verificando arquivos…",
|
||||
"seeding": "Semeando",
|
||||
"stop_seeding": "Parar semeio",
|
||||
"resume_seeding": "Retomar semeio"
|
||||
"resume_seeding": "Retomar semeio",
|
||||
"options": "Gerenciar"
|
||||
},
|
||||
"settings": {
|
||||
"downloads_path": "Diretório dos downloads",
|
||||
|
|
|
@ -15,8 +15,11 @@ import { useAppSelector, useDownload } from "@renderer/hooks";
|
|||
import * as styles from "./download-group.css";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { SPACING_UNIT, vars } from "@renderer/theme.css";
|
||||
import { XCircleIcon } from "@primer/octicons-react";
|
||||
import { useMemo } from "react";
|
||||
import DropdownMenu, {
|
||||
DropdownMenuItem,
|
||||
} from "@renderer/components/dropdown-menu/dropdown-menu";
|
||||
import { ThreeBarsIcon } from "@primer/octicons-react";
|
||||
|
||||
export interface DownloadGroupProps {
|
||||
library: LibraryGame[];
|
||||
|
@ -152,65 +155,64 @@ export function DownloadGroup({
|
|||
return <p>{t(game.status as string)}</p>;
|
||||
};
|
||||
|
||||
const getGameActions = (game: LibraryGame) => {
|
||||
const getGameActions = (game: LibraryGame): DropdownMenuItem[] => {
|
||||
const isGameDownloading = lastPacket?.game.id === game.id;
|
||||
|
||||
const deleting = isGameDeleting(game.id);
|
||||
|
||||
if (game.progress === 1) {
|
||||
return (
|
||||
<>
|
||||
<Button
|
||||
onClick={() => openGameInstaller(game.id)}
|
||||
theme="outline"
|
||||
disabled={deleting}
|
||||
>
|
||||
{t("install")}
|
||||
</Button>
|
||||
|
||||
{game.status === "seeding" ? (
|
||||
<Button onClick={() => pauseSeeding(game.id)} theme="outline">
|
||||
{t("stop_seeding")}
|
||||
</Button>
|
||||
) : (
|
||||
<Button onClick={() => resumeSeeding(game.id)} theme="outline">
|
||||
{t("resume_seeding")}
|
||||
</Button>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
return [
|
||||
{
|
||||
label: t("install"),
|
||||
disabled: deleting,
|
||||
onClick: () => openGameInstaller(game.id),
|
||||
},
|
||||
{
|
||||
label: t("stop_seeding"),
|
||||
disabled: deleting,
|
||||
show: game.status === "seeding",
|
||||
onClick: () => pauseSeeding(game.id),
|
||||
},
|
||||
{
|
||||
label: t("resume_seeding"),
|
||||
disabled: deleting,
|
||||
show: game.status !== "seeding",
|
||||
onClick: () => resumeSeeding(game.id),
|
||||
},
|
||||
{
|
||||
label: t("delete"),
|
||||
disabled: deleting,
|
||||
onClick: () => openDeleteGameModal(game.id),
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
if (isGameDownloading || game.status === "active") {
|
||||
return (
|
||||
<>
|
||||
<Button onClick={() => pauseDownload(game.id)} theme="outline">
|
||||
{t("pause")}
|
||||
</Button>
|
||||
<Button onClick={() => cancelDownload(game.id)} theme="outline">
|
||||
{t("cancel")}
|
||||
</Button>
|
||||
</>
|
||||
);
|
||||
return [
|
||||
{
|
||||
label: t("pause"),
|
||||
onClick: () => pauseDownload(game.id),
|
||||
},
|
||||
{
|
||||
label: t("cancel"),
|
||||
onClick: () => cancelDownload(game.id),
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Button
|
||||
onClick={() => resumeDownload(game.id)}
|
||||
theme="outline"
|
||||
disabled={
|
||||
game.downloader === Downloader.RealDebrid &&
|
||||
!userPreferences?.realDebridApiToken
|
||||
}
|
||||
>
|
||||
{t("resume")}
|
||||
</Button>
|
||||
<Button onClick={() => cancelDownload(game.id)} theme="outline">
|
||||
{t("cancel")}
|
||||
</Button>
|
||||
</>
|
||||
);
|
||||
return [
|
||||
{
|
||||
label: t("resume"),
|
||||
disabled:
|
||||
game.downloader === Downloader.RealDebrid &&
|
||||
!userPreferences?.realDebridApiToken,
|
||||
onClick: () => resumeDownload(game.id),
|
||||
},
|
||||
{
|
||||
label: t("cancel"),
|
||||
onClick: () => cancelDownload(game.id),
|
||||
},
|
||||
];
|
||||
};
|
||||
|
||||
if (!library.length) return null;
|
||||
|
@ -280,26 +282,29 @@ export function DownloadGroup({
|
|||
{getGameInfo(game)}
|
||||
</div>
|
||||
|
||||
<div className={styles.downloadActions}>
|
||||
{getGameActions(game)}
|
||||
</div>
|
||||
<Button
|
||||
style={{
|
||||
position: "absolute",
|
||||
right: 0,
|
||||
top: 0,
|
||||
padding: 8,
|
||||
margin: 6,
|
||||
border: "none",
|
||||
minHeight: "unset",
|
||||
borderRadius: "50%",
|
||||
color: vars.color.danger,
|
||||
}}
|
||||
onClick={() => openDeleteGameModal(game.id)}
|
||||
theme="outline"
|
||||
>
|
||||
<XCircleIcon />
|
||||
</Button>
|
||||
{getGameActions(game) !== null && (
|
||||
<DropdownMenu
|
||||
title={t("options")}
|
||||
align="end"
|
||||
items={getGameActions(game)}
|
||||
sideOffset={-70}
|
||||
>
|
||||
<Button
|
||||
style={{
|
||||
position: "absolute",
|
||||
top: "12px",
|
||||
right: "12px",
|
||||
borderRadius: "50%",
|
||||
border: "none",
|
||||
padding: "8px",
|
||||
minHeight: "unset",
|
||||
}}
|
||||
theme="outline"
|
||||
>
|
||||
<ThreeBarsIcon />
|
||||
</Button>
|
||||
</DropdownMenu>
|
||||
)}
|
||||
</div>
|
||||
</li>
|
||||
);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue