show loadingbar for initial load

This commit is contained in:
Abhinav-grd 2021-02-15 20:00:26 +05:30
parent 254780429f
commit 314c939c30

View file

@ -108,7 +108,6 @@ const DateContainer = styled.div`
export default function Gallery(props) { export default function Gallery(props) {
const router = useRouter(); const router = useRouter();
const [loading, setLoading] = useState(false);
const [collections, setCollections] = useState<collection[]>([]); const [collections, setCollections] = useState<collection[]>([]);
const [ const [
collectionAndItsLatestFile, collectionAndItsLatestFile,
@ -134,7 +133,6 @@ export default function Gallery(props) {
router.push('/'); router.push('/');
} }
const main = async () => { const main = async () => {
setLoading(true);
const data = await localFiles(); const data = await localFiles();
const collections = await getLocalCollections(); const collections = await getLocalCollections();
const collectionAndItsLatestFile = await getCollectionAndItsLatestFile( const collectionAndItsLatestFile = await getCollectionAndItsLatestFile(
@ -147,8 +145,7 @@ export default function Gallery(props) {
const favItemIds = await getFavItemIds(data); const favItemIds = await getFavItemIds(data);
setFavItemIds(favItemIds); setFavItemIds(favItemIds);
setLoading(false); data.length == 0 ? setProgress(20) : setProgress(80);
setProgress(80);
await syncWithRemote(); await syncWithRemote();
setProgress(100); setProgress(100);
}; };
@ -296,14 +293,20 @@ export default function Gallery(props) {
} }
}; };
if (!data || loading || data.length == 0) { if (!data) {
return <div />;
}
if (data.length == 0) {
return ( return (
<div className="text-center"> <div className="text-center">
{data?.length == 0 && ( <LoadingBar
<Alert variant="primary"> color="#2dc262"
{constants.INITIAL_LOAD_DELAY_WARNING} progress={progress}
</Alert> onLoaderFinished={() => setProgress(0)}
)} />
<Alert variant="primary">
{constants.INITIAL_LOAD_DELAY_WARNING}
</Alert>
</div> </div>
); );
} }