diff --git a/src/renderer/src/components/sidebar/sidebar.tsx b/src/renderer/src/components/sidebar/sidebar.tsx
index faa77708..f3ab5c04 100644
--- a/src/renderer/src/components/sidebar/sidebar.tsx
+++ b/src/renderer/src/components/sidebar/sidebar.tsx
@@ -5,7 +5,7 @@ import { useLocation, useNavigate } from "react-router-dom";
import type { LibraryGame } from "@types";
import { TextField } from "@renderer/components";
-import { useDownload, useLibrary } from "@renderer/hooks";
+import { useDownload, useLibrary, useToast } from "@renderer/hooks";
import { routes } from "./routes";
@@ -36,6 +36,8 @@ export function Sidebar() {
const { lastPacket, progress } = useDownload();
+ const { showWarningToast } = useToast();
+
useEffect(() => {
updateLibrary();
}, [lastPacket?.game.id, updateLibrary]);
@@ -131,8 +133,12 @@ export function Sidebar() {
navigate(path);
}
- if (event.detail == 2 && game.executablePath) {
- window.electron.openGame(game.id, game.executablePath);
+ if (event.detail == 2) {
+ if (game.executablePath) {
+ window.electron.openGame(game.id, game.executablePath);
+ } else {
+ showWarningToast("Jogo não possui executável selecionado");
+ }
}
};
diff --git a/src/renderer/src/components/toast/toast.css.ts b/src/renderer/src/components/toast/toast.css.ts
index 45e14b85..2f4e8d03 100644
--- a/src/renderer/src/components/toast/toast.css.ts
+++ b/src/renderer/src/components/toast/toast.css.ts
@@ -81,3 +81,7 @@ export const successIcon = style({
export const errorIcon = style({
color: vars.color.danger,
});
+
+export const warningIcon = style({
+ color: vars.color.warning,
+});
diff --git a/src/renderer/src/components/toast/toast.tsx b/src/renderer/src/components/toast/toast.tsx
index 371befde..2aa57539 100644
--- a/src/renderer/src/components/toast/toast.tsx
+++ b/src/renderer/src/components/toast/toast.tsx
@@ -1,5 +1,6 @@
import { useCallback, useEffect, useRef, useState } from "react";
import {
+ AlertIcon,
CheckCircleFillIcon,
XCircleFillIcon,
XIcon,
@@ -11,7 +12,7 @@ import { SPACING_UNIT } from "@renderer/theme.css";
export interface ToastProps {
visible: boolean;
message: string;
- type: "success" | "error";
+ type: "success" | "error" | "warning";
onClose: () => void;
}
@@ -84,6 +85,8 @@ export function Toast({ visible, message, type, onClose }: ToastProps) {
)}
{type === "error" && }
+
+ {type === "warning" && }
{message}
diff --git a/src/renderer/src/hooks/use-toast.ts b/src/renderer/src/hooks/use-toast.ts
index a35b6039..485470f0 100644
--- a/src/renderer/src/hooks/use-toast.ts
+++ b/src/renderer/src/hooks/use-toast.ts
@@ -29,5 +29,17 @@ export function useToast() {
[dispatch]
);
- return { showSuccessToast, showErrorToast };
+ const showWarningToast = useCallback(
+ (message: string) => {
+ dispatch(
+ showToast({
+ message,
+ type: "warning",
+ })
+ );
+ },
+ [dispatch]
+ );
+
+ return { showSuccessToast, showErrorToast, showWarningToast };
}
diff --git a/src/renderer/src/pages/game-details/hero/hero-panel-actions.css.ts b/src/renderer/src/pages/game-details/hero/hero-panel-actions.css.ts
index 7f56588a..cebee4be 100644
--- a/src/renderer/src/pages/game-details/hero/hero-panel-actions.css.ts
+++ b/src/renderer/src/pages/game-details/hero/hero-panel-actions.css.ts
@@ -8,6 +8,6 @@ export const heroPanelAction = style({
export const separator = style({
width: "1px",
- backgroundColor: vars.color.border,
+ backgroundColor: vars.color.muted,
margin: `${SPACING_UNIT / 2}px 0`,
});
diff --git a/src/renderer/src/pages/game-details/hero/hero-panel.tsx b/src/renderer/src/pages/game-details/hero/hero-panel.tsx
index 943658d2..12ed84d5 100644
--- a/src/renderer/src/pages/game-details/hero/hero-panel.tsx
+++ b/src/renderer/src/pages/game-details/hero/hero-panel.tsx
@@ -35,8 +35,9 @@ export function HeroPanel() {
const getInfo = () => {
if (isGameDeleting(game?.id ?? -1)) return
{t("deleting")}
;
- if (game && (game.progress === 1 || !game.status))
+ if (game && (game.progress === 1 || !game.status)) {
return ;
+ }
if (game?.status === "active") {
if (lastPacket?.isDownloadingMetadata && isGameDownloading) {
diff --git a/src/renderer/src/pages/game-details/modals/game-options-modal.css.ts b/src/renderer/src/pages/game-details/modals/game-options-modal.css.ts
index 03052d34..a6a854df 100644
--- a/src/renderer/src/pages/game-details/modals/game-options-modal.css.ts
+++ b/src/renderer/src/pages/game-details/modals/game-options-modal.css.ts
@@ -3,11 +3,11 @@ import { SPACING_UNIT } from "../../../theme.css";
export const optionsContainer = style({
display: "flex",
- gap: `${SPACING_UNIT}px`,
+ gap: `${SPACING_UNIT * 2}px`,
flexDirection: "column",
});
-export const downloadSourceField = style({
+export const gameOptionRow = style({
display: "flex",
gap: `${SPACING_UNIT}px`,
});
diff --git a/src/renderer/src/pages/game-details/modals/game-options-modal.tsx b/src/renderer/src/pages/game-details/modals/game-options-modal.tsx
index e6e049c9..f549b767 100644
--- a/src/renderer/src/pages/game-details/modals/game-options-modal.tsx
+++ b/src/renderer/src/pages/game-details/modals/game-options-modal.tsx
@@ -1,12 +1,8 @@
import { useContext, useState } from "react";
import { useTranslation } from "react-i18next";
-
import { Button, Modal, TextField } from "@renderer/components";
import type { Game } from "@types";
-
import * as styles from "./game-options-modal.css";
-
-import { SPACING_UNIT } from "../../../theme.css";
import { gameDetailsContext } from "../game-details.context";
import {
FileDirectoryOpenFillIcon,
@@ -80,15 +76,8 @@ export function GameOptionsModal({
deleteGame={handleDeleteGame}
/>
-
-
+
+
-
+
-
-
{game.folderName && (
-