LogalDeveloper/owncast
LogalDeveloper/owncast
0
Fork 0
Code

Fix followers pagination. Closes #2695

Browse Source
This commit is contained in:
Gabe Kangas 2023-02-08 19:57:30 -08:00
parent bf134c94ba
commit 85e77379b2
No known key found for this signature in database
GPG Key ID: 4345B2060657F330
3 changed files with 11 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/components/ui/followers/FollowerCollection/FollowerCollection.module.scss
View File

@ -21,3 +21,7 @@
width: 100%; width: 100%;
background-color: var(--theme-color-components-content-background); background-color: var(--theme-color-components-content-background);
} }
.pagination {
margin: 1rem;
}

10
web/components/ui/followers/FollowerCollection/FollowerCollection.stories.tsx
View File

@ -20,7 +20,7 @@ const mocks = {
response: { response: {
status: 200, status: 200,
body: { body: {
total: 10, total: 100,
results: [ results: [
{ {
link: 'https://sun.minuscule.space/users/mardijker', link: 'https://sun.minuscule.space/users/mardijker',
@ -175,14 +175,6 @@ const mocks = {
timestamp: '2022-03-30T14:41:32Z', timestamp: '2022-03-30T14:41:32Z',
disabledAt: null, disabledAt: null,
}, },
{
link: 'https://gamethattune.club/users/mork',
name: 'mork',
username: 'mork@gamethattune.club',
image: '',
timestamp: '2022-03-30T14:37:10Z',
disabledAt: null,
},
{ {
link: 'https://fosstodon.org/users/owncast', link: 'https://fosstodon.org/users/owncast',
name: 'Owncast', name: 'Owncast',

10
web/components/ui/followers/FollowerCollection/FollowerCollection.tsx
View File

@ -19,17 +19,16 @@ export const FollowerCollection: FC<FollowerCollectionProps> = ({ name, onFollow
const [page, setPage] = useState(1); const [page, setPage] = useState(1);
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const pages = Math.ceil(total / ITEMS_PER_PAGE);
const getFollowers = async () => { const getFollowers = async () => {
try { try {
const response = await fetch(`${ENDPOINT}?page=${page}`); const response = await fetch(`${ENDPOINT}?page=${page}&limit=${ITEMS_PER_PAGE}`);
const data = await response.json(); const data = await response.json();
const { results, total: totalResults } = data; const { results, total: totalResults } = data;
setFollowers(results); setFollowers(results);
setTotal(totalResults); setTotal(totalResults);
setLoading(false); setLoading(false);
} catch (error) { } catch (error) {
console.error(error); console.error(error);
@ -78,9 +77,12 @@ export const FollowerCollection: FC<FollowerCollectionProps> = ({ name, onFollow
</Row> </Row>
<Pagination <Pagination
className={styles.pagination}
current={page} current={page}
pageSize={ITEMS_PER_PAGE} pageSize={ITEMS_PER_PAGE}
total={pages || 1} defaultPageSize={ITEMS_PER_PAGE}
total={total}
showSizeChanger={false}
onChange={p => { onChange={p => {
setPage(p); setPage(p);
}} }}