How to use date-fns-tz - 10 common examples

To help you get started, we’ve selected a few date-fns-tz examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github derhuerst / parse-human-relative-time / example.js View on Github external
const {format} = require('date-fns-tz')
const parseWithLuxon = require('.')(DateTime)
const parseWithDateFns = require('./date-fns')(dateFns)

// Europe/Berlin switched to DST at 31st of March at 2am.
const withoutDST = '2019-03-31T01:59+01:00'
const timeZone = 'Europe/Berlin'
const rel = 'in 2 minutes'

const dt = DateTime.fromISO(withoutDST).setZone(timeZone)
const withDST1 = parseWithLuxon(rel, dt)
console.log(withDST1.toFormat('HH:mm ZZZZ'))
// 03:01 GMT+2

const withDST2 = parseWithDateFns(rel, new Date(withoutDST))
console.log(format(withDST2, 'HH:mm zz', {timeZone: 'Europe/Berlin'}))
// 03:01 GMT+2
github bcgov / queue-management / appointment-frontend / src / components / appointment / DateSelection.vue View on Github external
selectTimeSlot (slot) {
    // Note - For cross browser, we must use specific date string format below
    // Chrome/FF pass with "2020-05-08 09:00" but Safari fails.
    // Safari needs format from spec, "2020-05-08T09:00-07:00"
    // (safari also needs timezone offset)
    const selectedSlot: AppointmentSlot = {
      // start_time: new Date(`${this.selectedDate}T${slot.start_time}${timezoneOffset()}`).toISOString(),
      // end_time: new Date(`${this.selectedDate}T${slot.end_time}${timezoneOffset()}`).toISOString()
      start_time: zonedTimeToUtc(`${this.selectedDate}T${slot.start_time}`, this.currentOfficeTimezone).toISOString(),
      end_time: zonedTimeToUtc(`${this.selectedDate}T${slot.end_time}`, this.currentOfficeTimezone).toISOString()
    }
    this.setCurrentAppointmentSlot(selectedSlot)
    this.stepNext()
  }
}
github joelshepherd / tabliss / src / views / shared / timeZone / TimeZoneInput.tsx View on Github external
cachedSupportedTimeZones = timeZones.filter(timeZone => {
        try {
          utcToZonedTime(new Date(), timeZone);
        } catch {
          return false;
        }
        return true;
      });
github eventespresso / event-espresso-core / assets / prototype / application / hooks / useTimeZoneTime.ts View on Github external
const utcToLocalTime: DateFn = (isoDate: Date | string | number): Date => {
		return utcToZonedTime(isoDate, config.timezone.name);
	};
github birkir / kvikmyndr-app / src / store / models / Showtime.ts View on Github external
get disabled() {
    const timeInIceland = utcToZonedTime(Date.now(), 'GMT');
    if (self.playingAt) {
      return self.playingAt.getTime() < timeInIceland.getTime();
    }
    return false;
  },
}));
github theia-ide / extension-registry / webui / src / pages / extension-detail / extension-detail-reviews.tsx View on Github external
{this.state.reviewList.reviews.map((r: ExtensionReview) => {
                    let zonedDate;
                    if (r.timestamp) {
                        const date = new Date(r.timestamp);
                        const timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
                        zonedDate = utcToZonedTime(date, timeZone);
                    }
                    return <React.Fragment key={r.user + r.title + r.timestamp}>
                        <Box my={2}>
                            <Box display='flex'>
                                <Typography variant='body2'>{zonedDate ? zonedDate.toLocaleString() : '-'}</Typography>
                                <TextDivider />
                                <Typography variant='body2'>{r.user}</Typography>
                            </Box>
                            <Box display='flex'>
                                <Typography className={this.props.classes.boldText}>{r.title}</Typography>
                                <Box ml={4} display='flex' alignItems='center'>
                                    <ExportRatingStars number={r.rating} />
                                </Box>
                            </Box>
                            <Box>
                                <Typography variant='body1'>{r.comment}</Typography>
github stone-payments / pos-mamba-sdk / packages / utils / date.js View on Github external
area: "São Paulo"
      id: "404"
      isDst: false
      location: "América"
      offsetHour: "-03"
      offsetMin: "00"
    */

    const { offsetHour, offsetMin } = window.Clock.getCurrentTimeZone();
    if (dateFormat) {
      return format(
        utcToZonedTime(dateString, `${offsetHour}${offsetMin}`),
        dateFormat,
      );
    }
    return utcToZonedTime(dateString, `${offsetHour}${offsetMin}`);
  }

  if (dateFormat) return format(parseDateISO(dateString), dateFormat);
  return parseDateISO(dateString);
}
github joelshepherd / tabliss / src / context / time.tsx View on Github external
function getTime(timeZone?: string) {
  if (timeZone) {
    return utcToZonedTime(new Date(), timeZone);
  }

  return new Date();
}
github birkir / kvikmyndr-app / src / store / models / Showtime.ts View on Github external
.preProcessSnapshot((snapshot) => {
  const date = utcToZonedTime(snapshot.playingAt || 0, 'UTC');
  return {
    ...snapshot,
    playingAt: new Date(date),
  };
})
.views(self => ({
github theia-ide / extension-registry / webui / src / pages / extension-detail / extension-detail-overview.tsx View on Github external
render() {
        if (!this.state.readme) {
            return '';
        }
        const { classes, extension } = this.props;
        let zonedDate;
        if (extension.timestamp) {
            const date = new Date(extension.timestamp);
            const timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
            zonedDate = utcToZonedTime(date, timeZone);
        }
        return <React.Fragment>
            <Box display='flex' >
                <Box className={classes.markdown} flex={5}>
                    {this.renderMarkdown(this.state.readme)}
                </Box>
                <Box flex={3} display='flex' justifyContent='flex-end'>
                    <Box width='80%'>
                        {this.renderButtonList('category', 'Categories', extension.categories)}
                        <Box mt={2}>
                            {this.renderButtonList('search', 'Tags', extension.tags)}
                        </Box>
                        <Box mt={2}>
                            <Typography variant='h6'>Resources</Typography>
                            {this.renderResourceLink('Homepage', extension.homepage)}
                            {this.renderResourceLink('Repository', extension.repository)}

date-fns-tz

Time zone support for date-fns v2 with the Intl API

MIT
Latest version published 3 months ago

Package Health Score

85 / 100
Full package analysis