fix: date and month format issue on booking page for weekly view (#10512)

Co-authored-by: Raghul D <v-raghuld@microsoft.com>
Co-authored-by: Udit Takkar <udit.07814802719@cse.mait.ac.in>
Co-authored-by: Udit Takkar <53316345+Udit-takkar@users.noreply.github.com>
pull/10654/head
Raghul 2023-08-09 03:07:52 +05:30 committed by GitHub
parent 2aa0188418
commit c22dfdd54e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 24 additions and 4 deletions

View File

@ -57,13 +57,33 @@ export function Header({
return <LayoutToggleWithData />;
}
const endDate = selectedDate.add(extraDays, "days");
const isSameMonth = () => {
return selectedDate.format("MMM") === endDate.format("MMM");
};
const isSameYear = () => {
return selectedDate.format("YYYY") === endDate.format("YYYY");
};
const FormattedSelectedDateRange = () => {
return (
<h3 className="min-w-[150px] text-base font-semibold leading-4">
{selectedDate.format("MMM D")}
{!isSameYear() && <span className="text-subtle">, {selectedDate.format("YYYY")} </span>}-{" "}
{isSameMonth() ? endDate.format("D") : endDate.format("MMM D")},{" "}
<span className="text-subtle">
{isSameYear() ? selectedDate.format("YYYY") : endDate.format("YYYY")}
</span>
</h3>
);
};
return (
<div className="border-default relative z-10 flex border-b border-l px-5 py-4">
<div className="flex items-center gap-3">
<h3 className="min-w-[150px] text-base font-semibold leading-4">
{selectedDate.format("MMM D")}-{selectedDate.add(extraDays, "days").format("D")},{" "}
<span className="text-subtle">{selectedDate.format("YYYY")}</span>
</h3>
<FormattedSelectedDateRange />
<ButtonGroup>
<Button
variant="icon"