feat: load more button disabled if load all
This commit is contained in:
parent
0963cdb5c4
commit
f338736775
@ -2,6 +2,9 @@
|
|||||||
"name": "ionian_client",
|
"name": "ionian_client",
|
||||||
"version": "0.0.1",
|
"version": "0.0.1",
|
||||||
"description": "client of ionian",
|
"description": "client of ionian",
|
||||||
|
"scripts": {
|
||||||
|
"build:watch": "ts-node build.ts"
|
||||||
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@emotion/react": "^11.9.0",
|
"@emotion/react": "^11.9.0",
|
||||||
"@emotion/styled": "^11.8.1",
|
"@emotion/styled": "^11.8.1",
|
||||||
|
@ -18,8 +18,10 @@ type GalleryState = {
|
|||||||
|
|
||||||
export const GalleryInfo = (props: GalleryProp) => {
|
export const GalleryInfo = (props: GalleryProp) => {
|
||||||
const [state, setState] = useState<GalleryState>({ documents: undefined });
|
const [state, setState] = useState<GalleryState>({ documents: undefined });
|
||||||
|
const [loadAll, setLoadAll] = useState(false);
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const abortController = new AbortController();
|
const abortController = new AbortController();
|
||||||
|
console.log('load first',props.option);
|
||||||
const load = (async () => {
|
const load = (async () => {
|
||||||
const c = await ContentAccessor.findList(props.option);
|
const c = await ContentAccessor.findList(props.option);
|
||||||
//todo : if c is undefined, retry to fetch 3 times. and show error message.
|
//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 />);
|
gallery={`/search?${queryString}`} short />);
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
<Button onClick={()=>loadMore()}>Load More</Button>
|
<Button onClick={()=>loadMore()} disabled={loadAll}>{loadAll ? "Load All" : "Load More"}</Button>
|
||||||
</Box>
|
</Box>
|
||||||
);
|
);
|
||||||
function loadMore() {
|
function loadMore() {
|
||||||
@ -61,7 +63,12 @@ export const GalleryInfo = (props: GalleryProp) => {
|
|||||||
console.log("load more", option);
|
console.log("load more", option);
|
||||||
const load = (async () => {
|
const load = (async () => {
|
||||||
const c = await ContentAccessor.findList(option);
|
const c = await ContentAccessor.findList(option);
|
||||||
setState({ documents: [...state.documents, ...c] });
|
if (c.length === 0) {
|
||||||
|
setLoadAll(true);
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
setState({ documents: [...state.documents, ...c] });
|
||||||
|
}
|
||||||
});
|
});
|
||||||
load();
|
load();
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user