cal.pub0.org/packages/lib/date-fns/index.ts

195 lines
7.3 KiB
TypeScript
Raw Normal View History

import type { Dayjs } from "@calcom/dayjs";
import dayjs from "@calcom/dayjs";
Feature/booking page refactor (#3035) * Extracted UI related logic on the DatePicker, stripped out all logic * wip * fixed small regression due to merge * Fix alignment of the chevrons * Added isToday dot, added onMonthChange so we can fetch this month slots * Added includedDates to inverse excludedDates * removed trpcState * Improvements to the state * All params are now dynamic * This builds the flat map so not all paths block on every new build * Added requiresConfirmation * Correctly take into account getFilteredTimes to make the calendar function * Rewritten team availability, seems to work * Circumvent i18n flicker by showing the loader instead * 'You can remove this code. Its not being used now' - Hariom * Nailed a persistent little bug, new Date() caused the current day to flicker on and off * TS fixes * Fix some eventType details in AvailableTimes * '5 / 6 Seats Available' instead of '6 / Seats Available' * More type fixes * Removed unrelated merge artifact * Use WEBAPP_URL instead of hardcoded * Next round of TS fixes * I believe this was mistyped * Temporarily disabled rescheduling 'this is when you originally scheduled', so removed dep * Sorting some dead code * This page has a lot of red, not all related to this PR * A PR to your PR (#3067) * Cleanup * Cleanup * Uses zod to parse params * Type fixes * Fixes ISR * E2E fixes * Disabled dynamic bookings until post v1.7 * More test fixes * Fixed border position (transparent border) to prevent dot from jumping - and possibly fix spacing * Disabled style nitpicks * Delete useSlots.ts Removed early design artifact * Unlock DatePicker locale * Adds mini spinner to DatePicker Co-authored-by: Peer Richelsen <peeroke@gmail.com> Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com> Co-authored-by: zomars <zomars@me.com>
2022-06-15 20:54:31 +00:00
// converts a date to 2022-04-25 for example.
export const yyyymmdd = (date: Date | Dayjs) =>
date instanceof Date ? dayjs(date).format("YYYY-MM-DD") : date.format("YYYY-MM-DD");
Feature/booking page refactor (#3035) * Extracted UI related logic on the DatePicker, stripped out all logic * wip * fixed small regression due to merge * Fix alignment of the chevrons * Added isToday dot, added onMonthChange so we can fetch this month slots * Added includedDates to inverse excludedDates * removed trpcState * Improvements to the state * All params are now dynamic * This builds the flat map so not all paths block on every new build * Added requiresConfirmation * Correctly take into account getFilteredTimes to make the calendar function * Rewritten team availability, seems to work * Circumvent i18n flicker by showing the loader instead * 'You can remove this code. Its not being used now' - Hariom * Nailed a persistent little bug, new Date() caused the current day to flicker on and off * TS fixes * Fix some eventType details in AvailableTimes * '5 / 6 Seats Available' instead of '6 / Seats Available' * More type fixes * Removed unrelated merge artifact * Use WEBAPP_URL instead of hardcoded * Next round of TS fixes * I believe this was mistyped * Temporarily disabled rescheduling 'this is when you originally scheduled', so removed dep * Sorting some dead code * This page has a lot of red, not all related to this PR * A PR to your PR (#3067) * Cleanup * Cleanup * Uses zod to parse params * Type fixes * Fixes ISR * E2E fixes * Disabled dynamic bookings until post v1.7 * More test fixes * Fixed border position (transparent border) to prevent dot from jumping - and possibly fix spacing * Disabled style nitpicks * Delete useSlots.ts Removed early design artifact * Unlock DatePicker locale * Adds mini spinner to DatePicker Co-authored-by: Peer Richelsen <peeroke@gmail.com> Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com> Co-authored-by: zomars <zomars@me.com>
2022-06-15 20:54:31 +00:00
// @see: https://github.com/iamkun/dayjs/issues/1272 - for the reason we're not using dayjs to do this.
export const daysInMonth = (date: Date | Dayjs) => {
const [year, month] =
date instanceof Date ? [date.getFullYear(), date.getMonth()] : [date.year(), date.month()];
// strange JS quirk: new Date(2022, 12, 0).getMonth() = 11
return new Date(year, month + 1, 0).getDate();
};
/**
* Expects timeFormat to be either 12 or 24, if null or undefined
* is passed in, we always default back to 24 hour notation.
*/
export const formatTime = (
date: string | Date | Dayjs,
timeFormat?: number | null,
timeZone?: string | null
) => {
// console.log(timeZone, date);
return timeZone
? dayjs(date)
.tz(timeZone)
.format(timeFormat === 12 ? "h:mma" : "HH:mm")
: dayjs(date).format(timeFormat === 12 ? "h:mma" : "HH:mm");
};
/**
* Returns a localized and translated date or time, based on the native
* Intl.DateTimeFormat available to JS. Undefined values mean the browser's
* locale will be used.
*/
export const formatLocalizedDateTime = (
date: Date | Dayjs,
options: Intl.DateTimeFormatOptions = {},
locale: string | undefined = undefined
) => {
const theDate = date instanceof dayjs ? (date as Dayjs).toDate() : (date as Date);
return Intl.DateTimeFormat(locale, options).format(theDate);
};
/**
* Returns a localized and translated calendar day based on the
* given Date object and locale. Undefined values mean the defaults
* associated with the browser's current locale will be used.
*/
export const formatToLocalizedDate = (
date: Date | Dayjs,
locale: string | undefined = undefined,
dateStyle: Intl.DateTimeFormatOptions["dateStyle"] = "long"
) => formatLocalizedDateTime(date, { dateStyle }, locale);
/**
* Returns a localized and translated time of day based on the
* given Date object and locale. Undefined values mean the defaults
* associated with the browser's current locale will be used.
*/
export const formatToLocalizedTime = (
date: Date | Dayjs,
locale: string | undefined = undefined,
timeStyle: Intl.DateTimeFormatOptions["timeStyle"] = "short",
hour12: Intl.DateTimeFormatOptions["hour12"] = undefined
) => formatLocalizedDateTime(date, { timeStyle, hour12 }, locale);
/**
* Returns a translated timezone based on the given Date object and
* locale. Undefined values mean the browser's current locale
* will be used.
*/
export const formatToLocalizedTimezone = (
date: Date | Dayjs,
locale: string | undefined = undefined,
timeZoneName: Intl.DateTimeFormatOptions["timeZoneName"] = "long"
) => {
// Intl.DateTimeFormat doesn't format into a timezone only, so we must
// formatToParts() and return the piece we want
const theDate = date instanceof dayjs ? (date as Dayjs).toDate() : (date as Date);
return Intl.DateTimeFormat(locale, { timeZoneName })
.formatToParts(theDate)
.find((d) => d.type == "timeZoneName")?.value;
};
/**
* Sorts two timezones by their offset from GMT.
*/
export const sortByTimezone = (timezoneA: string, timezoneB: string) => {
const timezoneAGmtOffset = dayjs.utc().tz(timezoneA).utcOffset();
const timezoneBGmtOffset = dayjs.utc().tz(timezoneB).utcOffset();
if (timezoneAGmtOffset === timezoneBGmtOffset) return 0;
return timezoneAGmtOffset < timezoneBGmtOffset ? -1 : 1;
};
/**
* Verifies given time is a day before in timezoneB.
*/
export const isPreviousDayInTimezone = (time: string, timezoneA: string, timezoneB: string) => {
const timeInTimezoneA = formatTime(time, 24, timezoneA);
const timeInTimezoneB = formatTime(time, 24, timezoneB);
if (time === timeInTimezoneB) return false;
// Eg timeInTimezoneA = 12:00 and timeInTimezoneB = 23:00
const hoursTimezoneBIsLater = timeInTimezoneB.localeCompare(timeInTimezoneA) === 1;
// If it is 23:00, does timezoneA come before or after timezoneB in GMT?
const timezoneBIsEarlierTimezone = sortByTimezone(timezoneA, timezoneB) === 1;
return hoursTimezoneBIsLater && timezoneBIsEarlierTimezone;
};
/**
* Verifies given time is a day after in timezoneB.
*/
export const isNextDayInTimezone = (time: string, timezoneA: string, timezoneB: string) => {
const timeInTimezoneA = formatTime(time, 24, timezoneA);
const timeInTimezoneB = formatTime(time, 24, timezoneB);
if (time === timeInTimezoneB) return false;
// Eg timeInTimezoneA = 12:00 and timeInTimezoneB = 09:00
const hoursTimezoneBIsEarlier = timeInTimezoneB.localeCompare(timeInTimezoneA) === -1;
// If it is 09:00, does timezoneA come before or after timezoneB in GMT?
const timezoneBIsLaterTimezone = sortByTimezone(timezoneA, timezoneB) === -1;
return hoursTimezoneBIsEarlier && timezoneBIsLaterTimezone;
};
/**
* Dayjs does not expose the timeZone value publicly through .get("timeZone")
* instead, we as devs are required to somewhat hack our way to get the
* tz value as string
* @param date Dayjs
* @returns Time Zone name
*/
// eslint-disable-next-line @typescript-eslint/no-explicit-any
export const getTimeZone = (date: Dayjs): string => (date as any)["$x"]["$timezone"];
/**
* Verify if timeZone has Daylight Saving Time (DST).
*
* Many countries in the Northern Hemisphere. Daylight Saving Time usually starts in March-April and ends in
* September-November when the countries return to standard time, or winter time as it is also known.
*
* In the Southern Hemisphere (south of the equator) the participating countries usually start the DST period
* in September-November and end DST in March-April.
*
* @param timeZone Time Zone Name (Ex. America/Mazatlan)
* @returns boolean
*/
export const timeZoneWithDST = (timeZone: string): boolean => {
const jan = dayjs.tz(`${new Date().getFullYear()}-01-01T00:00:00`, timeZone);
const jul = dayjs.tz(`${new Date().getFullYear()}-07-01T00:00:00`, timeZone);
return jan.utcOffset() !== jul.utcOffset();
};
/**
* Get DST difference.
* Today clocks are almost always set one hour back or ahead.
* However, on Lord Howe Island, Australia, clocks are set only 30 minutes forward
* from LHST (UTC+10:30) to LHDT (UTC+11) during DST.
* @param timeZone Time Zone Name (Ex. America/Mazatlan)
* @returns minutes
*/
export const getDSTDifference = (timeZone: string): number => {
const jan = dayjs.tz(`${new Date().getFullYear()}-01-01T00:00:00`, timeZone);
const jul = dayjs.tz(`${new Date().getFullYear()}-07-01T00:00:00`, timeZone);
return jul.utcOffset() - jan.utcOffset();
};
/**
* Get UTC offset of given time zone when in DST
* @param timeZone Time Zone Name (Ex. America/Mazatlan)
* @returns minutes
*/
export const getUTCOffsetInDST = (timeZone: string) => {
if (timeZoneWithDST(timeZone)) {
const jan = dayjs.tz(`${new Date().getFullYear()}-01-01T00:00:00`, timeZone);
const jul = dayjs.tz(`${new Date().getFullYear()}-07-01T00:00:00`, timeZone);
return jan.utcOffset() < jul.utcOffset() ? jul.utcOffset() : jan.utcOffset();
}
return 0;
};
/**
* Verifies if given time zone is in DST
* @param date
* @returns
*/
export const isInDST = (date: Dayjs) => {
const timeZone = getTimeZone(date);
return timeZoneWithDST(timeZone) && date.utcOffset() === getUTCOffsetInDST(timeZone);
};