feat: button to go up when search result is less than 10

src/locales/ar/translation.json

@@ -47,7 +47,8 @@
   },
   "catalogue": {
     "next_page": "الصفحة التالية",
-    "previous_page": "الصفحة السابقة"
+    "previous_page": "الصفحة السابقة",
+    "go_up_buttom": "العودة إلى الأعلى"
   },
   "game_details": {
     "open_download_options": "افتح خيارات التنزيل",

src/locales/be/translation.json

@@ -31,7 +31,8 @@
   },
   "catalogue": {
     "next_page": "Наступная старонка",
-    "previous_page": "Папярэдняя старонка"
+    "previous_page": "Папярэдняя старонка",
+    "go_up_buttom": "Вярнуцца да пачатку"
   },
   "game_details": {
     "open_download_options": "Адкрыць варыянты сцягвання",

src/locales/bg/translation.json

@@ -47,7 +47,8 @@
   },
   "catalogue": {
     "next_page": "Следваща страница",
-    "previous_page": "Предишна страница"
+    "previous_page": "Предишна страница",
+    "go_up_buttom": "Обратно към върха"
   },
   "game_details": {
     "open_download_options": "Варианти за изтегляне",

src/locales/ca/translation.json

@@ -41,7 +41,8 @@
   },
   "catalogue": {
     "next_page": "Pàgina següent",
-    "previous_page": "Pàgina anterior"
+    "previous_page": "Pàgina anterior",
+    "go_up_buttom": "Torneu a la part superior"
   },
   "game_details": {
     "open_download_options": "Obre les opcions de baixada",

src/locales/cs/translation.json

@@ -47,7 +47,8 @@
   },
   "catalogue": {
     "next_page": "Další strana",
-    "previous_page": "Předchozí strana"
+    "previous_page": "Předchozí strana",
+    "go_up_buttom": "Vraťte se na vrchol"
   },
   "game_details": {
     "open_download_options": "Otevřít možnosti stahování",

src/locales/da/translation.json

@@ -45,7 +45,8 @@
   },
   "catalogue": {
     "next_page": "Næste side",
-    "previous_page": "Forrige side"
+    "previous_page": "Forrige side",
+    "go_up_buttom": "Gå tilbage til toppen"
   },
   "game_details": {
     "open_download_options": "Åben download muligheder",

src/locales/de/translation.json

@@ -41,7 +41,8 @@
   },
   "catalogue": {
     "next_page": "Nächste Seite",
-    "previous_page": "Vorherige Seite"
+    "previous_page": "Vorherige Seite",
+    "go_up_buttom": "Zurück nach oben gehen"
   },
   "game_details": {
     "open_download_options": "Download-Optionen öffnen",

src/locales/en/translation.json

@@ -54,7 +54,8 @@
     "download_sources": "Download sources",
     "result_count": "{{resultCount}} results",
     "filter_count": "{{filterCount}} available",
-    "clear_filters": "Clear {{filterCount}} selected"
+    "clear_filters": "Clear {{filterCount}} selected",
+    "go_up_buttom": "Back to top"
   },
   "game_details": {
     "open_download_options": "Open download options",

src/locales/es/translation.json

@@ -54,7 +54,8 @@
     "download_sources": "Fuentes de descarga",
     "result_count": "{{resultCount}} resultados",
     "filter_count": "{{filterCount}} disponibles",
-    "clear_filters": "Limpiar {{filterCount}} seleccionados"
+    "clear_filters": "Limpiar {{filterCount}} seleccionados",
+    "go_up_buttom": "Vuelve a la cima"
   },
   "game_details": {
     "open_download_options": "Ver opciones de descargas",

src/locales/et/translation.json

@@ -46,7 +46,8 @@
   },
   "catalogue": {
     "next_page": "Järgmine leht",
-    "previous_page": "Eelmine leht"
+    "previous_page": "Eelmine leht",
+    "go_up_buttom": "Minge tippu"
   },
   "game_details": {
     "open_download_options": "Ava allalaadimise valikud",

src/locales/fa/translation.json

@@ -31,7 +31,8 @@
   },
   "catalogue": {
     "next_page": "صفحه‌ی بعدی",
-    "previous_page": "صفحه‌ی قبلی"
+    "previous_page": "صفحه‌ی قبلی",
+    "go_up_buttom": "به بالا برگردید"
   },
   "game_details": {
     "open_download_options": "بازکردن آپشن‌های دانلود",
@@ -135,4 +136,4 @@
   "modal": {
     "close": "دکمه‌ی خروج"
   }
-}
+}

src/locales/fr/translation.json

@@ -120,6 +120,7 @@
   },
   "catalogue": {
     "next_page": "Page suivante",
-    "previous_page": "Page précédente"
+    "previous_page": "Page précédente",
+    "go_up_buttom": "Retourner au sommet"
   }
 }

src/locales/hu/translation.json

@@ -31,7 +31,8 @@
   },
   "catalogue": {
     "next_page": "Következő olda",
-    "previous_page": "Előző olda"
+    "previous_page": "Előző olda",
+    "go_up_buttom": "Menj vissza a tetejére"
   },
   "game_details": {
     "open_download_options": "Letöltési lehetőségek",

src/locales/id/translation.json

@@ -41,7 +41,8 @@
   },
   "catalogue": {
     "next_page": "Halaman Berikutnya",
-    "previous_page": "Halaman Sebelumnya"
+    "previous_page": "Halaman Sebelumnya",
+    "go_up_buttom": "Kembali ke atas"
   },
   "game_details": {
     "open_download_options": "Buka opsi unduhan",

src/locales/it/translation.json

@@ -31,7 +31,8 @@
   },
   "catalogue": {
     "next_page": "Pagina successiva",
-    "previous_page": "Pagina precedente"
+    "previous_page": "Pagina precedente",
+    "go_up_buttom": "Torna in cima"
   },
   "game_details": {
     "open_download_options": "Apri opzioni di download",

src/locales/kk/translation.json

@@ -40,7 +40,8 @@
   },
   "catalogue": {
     "next_page": "Келесі бет",
-    "previous_page": "Алдыңғы бет"
+    "previous_page": "Алдыңғы бет",
+    "go_up_buttom": "Жоғарыға оралу"
   },
   "game_details": {
     "open_download_options": "Жүктеу нұсқаларын ашу",

src/locales/ko/translation.json

@@ -31,7 +31,8 @@
   },
   "catalogue": {
     "next_page": "다음 페이지",
-    "previous_page": "이전 페이지"
+    "previous_page": "이전 페이지",
+    "go_up_buttom": "상단으로 돌아갑니다"
   },
   "game_details": {
     "open_download_options": "다운로드 선택지 열기",

src/locales/nb/translation.json

@@ -45,7 +45,8 @@
   },
   "catalogue": {
     "next_page": "Neste side",
-    "previous_page": "Forrige side"
+    "previous_page": "Forrige side",
+    "go_up_buttom": "Gå tilbake til toppen"
   },
   "game_details": {
     "open_download_options": "Åpne nedlastingsmuligheter",

src/locales/nl/translation.json

@@ -31,7 +31,8 @@
   },
   "catalogue": {
     "next_page": "Volgende Pagina",
-    "previous_page": "Vorige Pagina"
+    "previous_page": "Vorige Pagina",
+    "go_up_buttom": "Ga terug naar de top"
   },
   "game_details": {
     "open_download_options": "Open download Instellingen",

src/locales/pl/translation.json

@@ -31,7 +31,8 @@
   },
   "catalogue": {
     "next_page": "Następna strona",
-    "previous_page": "Poprzednia strona"
+    "previous_page": "Poprzednia strona",
+    "go_up_buttom": "Wróć na szczyt"
   },
   "game_details": {
     "open_download_options": "Otwórz opcje pobierania",

src/locales/pt-BR/translation.json

@@ -295,7 +295,8 @@
     "download_sources": "Fontes de download",
     "result_count": "{{resultCount}} resultados",
     "filter_count": "{{filterCount}} disponíveis",
-    "clear_filters": "Limpar {{filterCount}} selecionados"
+    "clear_filters": "Limpar {{filterCount}} selecionados",
+    "go_up_buttom": "Voltar ao topo"
   },
   "modal": {
     "close": "Botão de fechar"

src/locales/pt-PT/translation.json

@@ -273,7 +273,8 @@
   },
   "catalogue": {
     "next_page": "Página seguinte",
-    "previous_page": "Página anterior"
+    "previous_page": "Página anterior",
+    "go_up_buttom": "Voltar ao topo"
   },
   "modal": {
     "close": "Botão de fechar"

src/locales/ro/translation.json

@@ -32,7 +32,8 @@
   },
   "catalogue": {
     "next_page": "Pagina următoare",
-    "previous_page": "Pagina anterioară"
+    "previous_page": "Pagina anterioară",
+    "go_up_buttom": "Înapoi în vârf"
   },
   "game_details": {
     "open_download_options": "Deschide opțiunile de descărcare",

src/locales/ru/translation.json

@@ -54,7 +54,8 @@
     "download_sources": "Источники загрузки",
     "result_count": "{{resultCount}} результатов",
     "filter_count": "{{filterCount}} доступных",
-    "clear_filters": "Очистить {{filterCount}} выбранных"
+    "clear_filters": "Очистить {{filterCount}} выбранных",
+    "go_up_buttom": "Вернуться на вершину"
   },
   "game_details": {
     "open_download_options": "Открыть источники",

src/locales/tr/translation.json

@@ -31,7 +31,8 @@
   },
   "catalogue": {
     "next_page": "Sonraki sayfa",
-    "previous_page": "Önceki sayfa"
+    "previous_page": "Önceki sayfa",
+    "go_up_buttom": "Tepeye dön"
   },
   "game_details": {
     "open_download_options": "İndirme seçeneklerini aç",

src/locales/uk/translation.json

@@ -40,7 +40,8 @@
   },
   "catalogue": {
     "next_page": "Наступна сторінка",
-    "previous_page": "Попередня сторінка"
+    "previous_page": "Попередня сторінка",
+    "go_up_buttom": "Назад до вершини"
   },
   "game_details": {
     "open_download_options": "Відкрити варіанти завантаження",

src/locales/zh/translation.json

@@ -46,7 +46,8 @@
   },
   "catalogue": {
     "next_page": "下一页",
-    "previous_page": "上一页"
+    "previous_page": "上一页",
+    "go_up_buttom": "回到顶部"
   },
   "game_details": {
     "open_download_options": "打开下载菜单",

src/renderer/src/pages/catalogue/catalogue.tsx

@@ -21,6 +21,8 @@ import { useCatalogue } from "@renderer/hooks/use-catalogue";
 import { GameItem } from "./game-item";
 import { FilterItem } from "./filter-item";
 import { debounce } from "lodash-es";
+import { Button } from "@renderer/components";
+import { ArrowUpIcon } from "@primer/octicons-react";
 
 const filterCategoryColors = {
   genres: "hsl(262deg 50% 47%)",
@@ -30,7 +32,11 @@ const filterCategoryColors = {
   publishers: "hsl(200deg 50% 30%)",
 };
 
+
+
 const PAGE_SIZE = 20;
+const TOTAL_ITEMS_TO_SHOW_GO_UP_BUTTOM = 10;
+const LIMIT_SCROLL_TO_DISAPEAR_GO_UP_BUTTOM = 500;
 
 export default function Catalogue() {
   const abortControllerRef = useRef<AbortController | null>(null);
@@ -47,6 +53,8 @@ export default function Catalogue() {
 
   const [results, setResults] = useState<any[]>([]);
 
+  const [wantGoUpButtonIsVisible, setWantGoUpButtonIsVisible] = useState(false);
+
   const [itemsCount, setItemsCount] = useState(0);
 
   const { formatNumber } = useFormat();
@@ -78,6 +86,34 @@ export default function Catalogue() {
     }, 500)
   ).current;
 
+  const isGoUpButtonVisible = (results: any[], scrollTop: number) => {
+    const withinLimit = results.length > 0 && results.length <= TOTAL_ITEMS_TO_SHOW_GO_UP_BUTTOM;
+    return withinLimit && scrollTop >= LIMIT_SCROLL_TO_DISAPEAR_GO_UP_BUTTOM;
+  };
+
+  useEffect(() => {
+    const withinLimit = results.length > 0 && results.length <= TOTAL_ITEMS_TO_SHOW_GO_UP_BUTTOM;
+    setWantGoUpButtonIsVisible(withinLimit);
+  }, [results])
+
+  useEffect(() => {
+    const handleScroll = debounce(() => {
+      if (cataloguePageRef.current) {
+        const scrollTop = cataloguePageRef.current.scrollTop
+        setWantGoUpButtonIsVisible(isGoUpButtonVisible(results, scrollTop))
+      }
+    }, 100)
+
+    const ref = cataloguePageRef.current
+    if (ref) {
+      ref.addEventListener("scroll", handleScroll);
+    }
+
+    return () => {
+      ref?.removeEventListener("scroll", handleScroll);
+    };
+  }, [results]);
+
   useEffect(() => {
     setResults([]);
     setIsLoading(true);
@@ -228,6 +264,15 @@ export default function Catalogue() {
     t,
   ]);
 
+  const handleWantGoUpButtonClick = () => {
+    if (cataloguePageRef.current) {
+      cataloguePageRef.current.scrollTo({
+        top: 0,
+        behavior: "smooth",
+      });
+    }
+  };
+
   return (
     <div className="catalogue" ref={cataloguePageRef}>
       <div
@@ -330,6 +375,15 @@ export default function Catalogue() {
               }}
             />
           </div>
+
+          {wantGoUpButtonIsVisible && (
+              <Button onClick={handleWantGoUpButtonClick} theme="outline" style={{ position: "fixed", bottom: 16, left: 16 }}>
+                {t("result_count", {
+                  resultCount: formatNumber(itemsCount),
+                })}
+                , {t('go_up_buttom')} <ArrowUpIcon />
+              </Button>
+          )}
         </div>
 
         <div className="catalogue__filters-container">