Radiquum/AniX
1
0
Fork 0
mirror of https://github.com/Radiquum/AniX.git synced 2025-04-30 18:09:40 +05:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: load more button

Browse source
This commit is contained in:
Kentai Radiquum 2024-08-04 13:55:31 +05:00
parent c10f802008
commit 9e65838569
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
6 changed files with 75 additions and 52 deletions
Download patch file Download diff file Expand all files Collapse all files

25
app/pages/BookmarksCategory.tsx
View file

@ -5,16 +5,18 @@ import { Spinner } from "#/components/Spinner/Spinner";
import { useState, useEffect } from "react";
import { useScrollPosition } from "#/hooks/useScrollPosition";
import { useUserStore } from "../store/auth";
import { Dropdown } from "flowbite-react";
import { Dropdown, Button } from "flowbite-react";
import { sort } from "./common";
import { ENDPOINTS } from "#/api/config";
import { BookmarksList, SortList } from "#/api/utils";
import { BookmarksList } from "#/api/utils";
const fetcher = async (url: string) => {
const res = await fetch(url);
if (!res.ok) {
const error = new Error(`An error occurred while fetching the data. status: ${res.status}`);
const error = new Error(
`An error occurred while fetching the data. status: ${res.status}`
);
error.message = await res.json();
throw error;
}
@ -30,7 +32,9 @@ export function BookmarksCategoryPage(props: any) {
const getKey = (pageIndex: number, previousPageData: any) => {
if (previousPageData && !previousPageData.content.length) return null;
if (token) {
return `${ENDPOINTS.user.bookmark}/all/${BookmarksList[props.slug]}/${pageIndex}?token=${token}&sort=${sort.values[selectedSort].id}`;
return `${ENDPOINTS.user.bookmark}/all/${
BookmarksList[props.slug]
}/${pageIndex}?token=${token}&sort=${sort.values[selectedSort].id}`;
}
};
@ -109,13 +113,16 @@ export function BookmarksCategoryPage(props: any) {
{data &&
data[data.length - 1].current_page <
data[data.length - 1].total_page_count && (
<button
className="mx-auto w-[calc(100%-10rem)] border border-black rounded-lg p-2 mb-6 flex items-center justify-center gap-2 hover:bg-black hover:text-white transition"
<Button
className="w-full"
color={"light"}
onClick={() => setSize(size + 1)}
>
<span className="w-10 h-10 iconify mdi--plus"></span>
<span className="text-lg">Загрузить ещё</span>
</button>
<div className="flex items-center gap-2">
<span className="w-6 h-6 iconify mdi--plus-circle "></span>
<span className="text-lg">Загрузить ещё</span>
</div>
</Button>
)}
</main>
);