date-fns#getYear JavaScript Examples

The following examples show how to use date-fns#getYear. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: CalendarNavigation.js    From react-nice-dates with MIT License 6 votes vote down vote up
export default function CalendarNavigation({ locale, month, minimumDate, maximumDate, onMonthChange }) {
  const handlePrevious = event => {
    onMonthChange(startOfMonth(subMonths(month, 1)))
    event.preventDefault()
  }

  const handleNext = event => {
    onMonthChange(startOfMonth(addMonths(month, 1)))
    event.preventDefault()
  }

  return (
    <div className='nice-dates-navigation'>
      <a
        className={classNames('nice-dates-navigation_previous', {
          '-disabled': isSameMonth(month, minimumDate)
        })}
        onClick={handlePrevious}
        onTouchEnd={handlePrevious}
      />

      <span className='nice-dates-navigation_current'>
        {format(month, getYear(month) === getYear(new Date()) ? 'LLLL' : 'LLLL yyyy', { locale })}
      </span>

      <a
        className={classNames('nice-dates-navigation_next', {
          '-disabled': isSameMonth(month, maximumDate)
        })}
        onClick={handleNext}
        onTouchEnd={handleNext}
      />
    </div>
  )
}
Example #2
Source File: date-filters.js    From product-collector with MIT License 5 votes vote down vote up
dateFilters = [
  {
    label: 'Últimos 7 días',
    startAt: format(sub(today, { days: 7 }), 'yyyy-MM-dd'),
    endAt: todayFormat,
  },
  {
    label: 'Últimos 15 días',
    startAt: format(sub(today, { days: 15 }), 'yyyy-MM-dd'),
    endAt: todayFormat,
  },
  {
    label: 'Mes actual',
    startAt: format(new Date(getYear(today), getMonth(today), 1), 'yyyy-MM-dd'),
    endAt: todayFormat,
  },
  {
    label: 'Últimos 30 días',
    startAt: format(sub(today, { days: 30 }), 'yyyy-MM-dd'),
    endAt: todayFormat,
  },
  {
    label: 'Últimos 90 días',
    startAt: format(sub(today, { days: 90 }), 'yyyy-MM-dd'),
    endAt: todayFormat,
  },
  {
    label: 'Año actual',
    startAt: format(new Date(getYear(today), 1, 1), 'yyyy-MM-dd'),
    endAt: todayFormat,
  },
  {
    label: 'Último año',
    startAt: format(sub(today, { years: 1 }), 'yyyy-MM-dd'),
    endAt: todayFormat,
  },
  {
    label: 'Últimos dos años',
    startAt: format(sub(today, { years: 2 }), 'yyyy-MM-dd'),
    endAt: todayFormat,
  },
]
Example #3
Source File: index.jsx    From botble-graphql-next with MIT License 4 votes vote down vote up
Footer = () => {
  return (
    <footer className={clsx('mt-auto py-2', styles.footer)}>
      <div className="container container-fluid px-2 lg:px-0">
        <div className="grid gap-4 grid-cols-1 mt-10 mb-5 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4">
          <div>
            <div className="flex items-center">
              <div className="rounded-full overflow-hidden inline-block">
                <img
                  src="/images/men.jpg"
                  alt="team"
                  loading="lazy"
                  width="60"
                  height="60"
                  className="object-cover"
                />
              </div>
              <div className="ml-3">
                <h4 className="font-semibold">TÔI YÊU LẬP TRÌNH</h4>
                <div className="text-gray-500">Code, cafe, book</div>
              </div>
            </div>
            <ul className="mt-6">
              <li>
                <InlineIcon
                  icon={home3Icon}
                  width="17"
                  className="mr-2 text-fresh-red"
                />
                Phú Nhuận, Hồ Chí Minh
              </li>
              <li className="mt-2">
                <InlineIcon
                  icon={globeAmericas}
                  width="17"
                  className="mr-2 text-fresh-red"
                />
                <a
                  href="https://12bay.vn"
                  target="_blank"
                  rel="noopener noreferrer"
                  className="hover:no-underline hover:text-fresh-red">
                  https://12bay.vn
                </a>
              </li>
              <li className="mt-2">
                <Icon
                  icon={mailIcon}
                  width="17"
                  className="mr-2 text-fresh-red"
                />
                <a
                  href="mailto:[email protected]"
                  className="hover:no-underline hover:text-fresh-red">
                  [email protected]
                </a>
              </li>
            </ul>
          </div>
          <div className={styles.group_link}>
            <h4 className="underline-title">Liên kết trang</h4>
            <ul>
              <li>
                <a href="/">Tympanus Codrops</a>
              </li>
              <li>
                <a href="/">Kipalog Blog</a>
              </li>
              <li>
                <a href="/">SitePoint</a>
              </li>
              <li>
                <a href="/">Creative Bloq</a>
              </li>
              <li>
                <a href="/">Techtalk</a>
              </li>
            </ul>
          </div>
          <div className={styles.group_link}>
            <h4 className="underline-title">Liên kết của tôi</h4>
            <ul>
              <li>
                <a
                  href="https://12bay.vn"
                  target="_blank"
                  rel="noopener noreferrer">
                  Săn vé máy bay
                </a>
              </li>
              <li>
                <a
                  href="https://github.com/nghiepit/botble-graphql-next"
                  target="_blank"
                  rel="noopener noreferrer">
                  Share source này
                </a>
              </li>
            </ul>
          </div>
          <div className={styles.group_link}>
            <h4 className="underline-title">Khác</h4>
            <div className="mt-5">
              <a href="/" className="inline-block bg-fresh-red px-2">
                Code
              </a>
              <a href="/" className="inline-block ml-2 bg-fresh-red px-2">
                Cafe
              </a>
              <a href="/" className="inline-block ml-2 bg-fresh-red px-2">
                Book
              </a>
            </div>
          </div>
        </div>
        <div className="mt-12 text-gray-500">
          © {getYear(new Date())} ToiYeuLapTrinh. All right reserved.
        </div>
      </div>
    </footer>
  );
}