feature button to go back to top and translates

This commit is contained in:
Kelvin 2025-01-11 14:33:57 -03:00
parent 87b053a283
commit 0f5910756b
28 changed files with 79 additions and 49 deletions

View file

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

View file

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

View file

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

View file

@ -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",

View file

@ -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í",

View file

@ -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",

View file

@ -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",

View file

@ -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",

View file

@ -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",

View file

@ -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",

View file

@ -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": "دکمه‌ی خروج"
}
}
}

View file

@ -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"
}
}

View file

@ -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",

View file

@ -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",

View file

@ -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",

View file

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

View file

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

View file

@ -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",

View file

@ -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",

View file

@ -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",

View file

@ -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"

View file

@ -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"

View file

@ -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",

View file

@ -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": "Открыть источники",

View file

@ -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ç",

View file

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

View file

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

View file

@ -32,9 +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 = 225;
const LIMIT_SCROLL_TO_DISAPEAR_GO_UP_BUTTOM = 500;
export default function Catalogue() {
const abortControllerRef = useRef<AbortController | null>(null);
@ -84,29 +86,33 @@ export default function Catalogue() {
}, 500)
).current;
useEffect(() => {
results.length > 0 && results.length <= TOTAL_ITEMS_TO_SHOW_GO_UP_BUTTOM
? setWantGoUpButtonIsVisible(true)
: setWantGoUpButtonIsVisible(false);
console.log(cataloguePageRef.current?.scrollTop);
}, [results]);
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 handleScroll = () => {
const withinLimit = results.length > 0 && results.length <= TOTAL_ITEMS_TO_SHOW_GO_UP_BUTTOM;
setWantGoUpButtonIsVisible(withinLimit);
}, [results])
useEffect(() => {
const handleScroll = debounce(() => {
if (cataloguePageRef.current) {
console.log(cataloguePageRef.current.scrollTop);
// setScrollPosition(cataloguePageRef.current.scrollTop);
const scrollTop = cataloguePageRef.current.scrollTop
setWantGoUpButtonIsVisible(isGoUpButtonVisible(results, scrollTop))
}
};
if (cataloguePageRef.current) {
cataloguePageRef.current.addEventListener("scroll", handleScroll);
}, 100)
const ref = cataloguePageRef.current
if (ref) {
ref.addEventListener("scroll", handleScroll);
}
return () => {
cataloguePageRef.current?.removeEventListener("scroll", handleScroll);
ref?.removeEventListener("scroll", handleScroll);
};
}, []);
}, [results]);
useEffect(() => {
setResults([]);
@ -264,7 +270,6 @@ export default function Catalogue() {
top: 0,
behavior: "smooth",
});
setWantGoUpButtonIsVisible(false);
}
};
@ -372,14 +377,12 @@ export default function Catalogue() {
</div>
{wantGoUpButtonIsVisible && (
<div style={{ position: "fixed", bottom: 16, left: 16 }}>
<Button onClick={handleWantGoUpButtonClick} theme="outline">
<Button onClick={handleWantGoUpButtonClick} theme="outline" style={{ position: "fixed", bottom: 16, left: 16 }}>
{t("result_count", {
resultCount: formatNumber(itemsCount),
})}
, voltar ao topo <ArrowUpIcon />
, {t('go_up_buttom')} <ArrowUpIcon />
</Button>
</div>
)}
</div>