tomru/pfadi-bussle
1
0
Fork 0
mirror of https://github.com/tomru/pfadi-bussle.git synced 2026-03-04 15:07:13 +01:00
Code Issues Packages Projects Releases Wiki Activity

show spinner when loading booked days

Browse Source
This commit is contained in:
Thomas Ruoff
2020-12-25 00:22:27 +01:00
parent 85e4c5349b
commit b43e9be604
1 changed files with 38 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
components/calendar.tsx
View File

@@ -11,6 +11,7 @@ import Calendar from 'react-calendar'
import useBookedDays from '../helpers/useDaysBooked' import useBookedDays from '../helpers/useDaysBooked'
import { dateFormatBackend } from '../helpers/date' import { dateFormatBackend } from '../helpers/date'
import { getNextBigger, getNextSmaller } from '../helpers/array' import { getNextBigger, getNextSmaller } from '../helpers/array'
import Loading from './loading'
export default function PlainCalendar({ export default function PlainCalendar({
start, start,
@@ -93,11 +94,15 @@ export default function PlainCalendar({
return ( return (
<div className={className}> <div className={className}>
<h2 className="text-xl">Belegungsplan</h2> <h2 className="text-xl">Belegungsplan</h2>
<Loading loading={daysBookedLoading}>
<Calendar <Calendar
activeStartDate={startDate} activeStartDate={startDate}
minDate={new Date()} minDate={new Date()}
// @ts-ignore // @ts-ignore
onClickDay={(date: Date, event: React.MouseEvent<HTMLInputElement>) => { onClickDay={(
date: Date,
event: React.MouseEvent<HTMLInputElement>
) => {
if (!onChange) { if (!onChange) {
return return
} }
@@ -130,6 +135,7 @@ export default function PlainCalendar({
tileClassName={tileClassName} tileClassName={tileClassName}
value={null} value={null}
/> />
</Loading>
<div className="mt-3 flex justify-center"> <div className="mt-3 flex justify-center">
<div> <div>
<div className="inline-block w-5 h-5 bg-green-200 rounded align-text-bottom"></div> <div className="inline-block w-5 h-5 bg-green-200 rounded align-text-bottom"></div>