From 5e217bf0866384227503233b9d2ffc88df808b11 Mon Sep 17 00:00:00 2001
From: Carlos Eduardo Mariano Garcia Pereira
 <69264602+caduHD4@users.noreply.github.com>
Date: Tue, 23 Sep 2025 23:53:06 -0300
Subject: [PATCH] Fix: Enhance repacks modal with filter toggle feature

Added filter toggle functionality with icons to repacks modal.
---
 .../pages/game-details/modals/repacks-modal.tsx  | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/renderer/src/pages/game-details/modals/repacks-modal.tsx b/src/renderer/src/pages/game-details/modals/repacks-modal.tsx
index e5c7a7cb..32e330c6 100644
--- a/src/renderer/src/pages/game-details/modals/repacks-modal.tsx
+++ b/src/renderer/src/pages/game-details/modals/repacks-modal.tsx
@@ -1,7 +1,7 @@
 import { useContext, useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useNavigate } from "react-router-dom";
-import { PlusCircleIcon } from "@primer/octicons-react";
+import { PlusCircleIcon, ChevronDownIcon, ChevronUpIcon } from "@primer/octicons-react";
 
 import {
   Badge,
@@ -159,6 +159,8 @@ export function RepacksModal({
     return repack.uris.some((uri) => uri.includes(game.download!.uri));
   };
 
+  const [isFilterDrawerOpen, setIsFilterDrawerOpen] = useState(false);
+
   return (
     <>
       <DownloadSettingsModal
@@ -177,10 +179,18 @@ export function RepacksModal({
         <div className="repacks-modal__filter-container">
           <div className="repacks-modal__filter-top">
             <TextField placeholder={t("filter")} onChange={handleFilter} />
+            <Button
+              type="button"
+              theme="outline"
+              onClick={() => setIsFilterDrawerOpen(!isFilterDrawerOpen)}
+              className="repacks-modal__filter-toggle"
+            >
+              {t("filter_by_source")}
+              {isFilterDrawerOpen ? <ChevronUpIcon /> : <ChevronDownIcon />}
+            </Button>
           </div>
 
-          <div className="repacks-modal__download-sources">
-            <p className="repacks-modal__filter-label">{t("filter_by_source")}</p>
+          <div className={`repacks-modal__download-sources ${isFilterDrawerOpen ? 'repacks-modal__download-sources--open' : ''}`}>
             <div className="repacks-modal__source-grid">
               {downloadSources.map((source) => (
                 <div