feat: load more button disabled if load all

This commit is contained in:
monoid 2022-04-28 13:47:06 +09:00
parent 0963cdb5c4
commit f338736775
2 changed files with 12 additions and 2 deletions

View File

@ -2,6 +2,9 @@
"name": "ionian_client",
"version": "0.0.1",
"description": "client of ionian",
"scripts": {
"build:watch": "ts-node build.ts"
},
"dependencies": {
"@emotion/react": "^11.9.0",
"@emotion/styled": "^11.8.1",

View File

@ -18,8 +18,10 @@ type GalleryState = {
export const GalleryInfo = (props: GalleryProp) => {
const [state, setState] = useState<GalleryState>({ documents: undefined });
const [loadAll, setLoadAll] = useState(false);
useEffect(() => {
const abortController = new AbortController();
console.log('load first',props.option);
const load = (async () => {
const c = await ContentAccessor.findList(props.option);
//todo : if c is undefined, retry to fetch 3 times. and show error message.
@ -52,7 +54,7 @@ export const GalleryInfo = (props: GalleryProp) => {
gallery={`/search?${queryString}`} short />);
})
}
<Button onClick={()=>loadMore()}>Load More</Button>
<Button onClick={()=>loadMore()} disabled={loadAll}>{loadAll ? "Load All" : "Load More"}</Button>
</Box>
);
function loadMore() {
@ -61,7 +63,12 @@ export const GalleryInfo = (props: GalleryProp) => {
console.log("load more", option);
const load = (async () => {
const c = await ContentAccessor.findList(option);
setState({ documents: [...state.documents, ...c] });
if (c.length === 0) {
setLoadAll(true);
}
else{
setState({ documents: [...state.documents, ...c] });
}
});
load();
}