PublicMirrors/hydra
1
0
Fork 0
mirror of https://github.com/hydralauncher/hydra.git synced 2025-01-23 13:34:54 +03:00
Code Issues Actions Packages Projects Releases 1 Wiki Activity

feat: smooth scrolling on pagination

Browse Source
This commit is contained in:
Hachi-R 2024-12-23 18:49:18 -03:00
parent 502f3b4aa7
commit a499aae31f
2 changed files with 10 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/renderer/src/pages/catalogue/catalogue.scss
View File

@ -1,11 +1,13 @@
@use "../../scss/globals.scss";
.catalogue {
overflow-y: auto;
display: flex;
flex-direction: column;
gap: calc(globals.$spacing-unit * 2);
width: 100%;
padding: 16px;
scroll-behavior: smooth;
&__filters-container {
width: 270px;

10
src/renderer/src/pages/catalogue/catalogue.tsx
View File

@ -33,6 +33,7 @@ const PAGE_SIZE = 20;
export default function Catalogue() {
const abortControllerRef = useRef<AbortController | null>(null);
const cataloguePageRef = useRef<HTMLDivElement>(null);
const { steamGenres, steamUserTags, steamDevelopers, steamPublishers } =
useCatalogue();
@ -214,7 +215,7 @@ export default function Catalogue() {
]);
return (
<div className="catalogue">
<div className="catalogue" ref={cataloguePageRef}>
<div
style={{
display: "flex",
@ -303,7 +304,12 @@ export default function Catalogue() {
<Pagination
page={page}
totalPages={Math.ceil(itemsCount / PAGE_SIZE)}
onPageChange={(page) => dispatch(setPage(page))}
onPageChange={(page) => {
dispatch(setPage(page));
if (cataloguePageRef.current) {
cataloguePageRef.current.scrollTop = 0;
}
}}
/>
</div>
</div>