mythic-insight/calcom
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 5

fix loading flicker on /bookings (#1062)

Browse source
This commit is contained in:
Alex Johansson 2021-10-28 17:12:30 +01:00 committed by GitHub
parent f91de82daf
commit 5af159cf4e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 5 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
pages/bookings/[status].tsx
View file

@ -40,6 +40,8 @@ export default function Bookings() {
} }
}); });
const isEmpty = !query.data?.pages[0]?.bookings.length;
return ( return (
<Shell heading={t("bookings")} subtitle={t("bookings_description")}> <Shell heading={t("bookings")} subtitle={t("bookings_description")}>
<BookingsShell> <BookingsShell>
@ -49,8 +51,8 @@ export default function Bookings() {
{query.status === "error" && ( {query.status === "error" && (
<Alert severity="error" title={t("something_went_wrong")} message={query.error.message} /> <Alert severity="error" title={t("something_went_wrong")} message={query.error.message} />
)} )}
{query.status === "loading" || (query.status === "idle" && <Loader />)} {(query.status === "loading" || query.status === "idle") && <Loader />}
{query.status === "success" && query.data.pages[0].bookings.length > 0 && ( {query.status === "success" && !isEmpty && (
<> <>
<div className="mt-6 overflow-hidden border border-b border-gray-200 rounded-sm"> <div className="mt-6 overflow-hidden border border-b border-gray-200 rounded-sm">
<table className="min-w-full divide-y divide-gray-200"> <table className="min-w-full divide-y divide-gray-200">
@ -75,7 +77,7 @@ export default function Bookings() {
</div> </div>
</> </>
)} )}
{query.status === "success" && query.data.pages[0].bookings.length === 0 && ( {query.status === "success" && isEmpty && (
<EmptyScreen <EmptyScreen
Icon={CalendarIcon} Icon={CalendarIcon}
headline={t("no_status_bookings_yet", { status: status })} headline={t("no_status_bookings_yet", { status: status })}