@taglivros/tag-hooks v2.0.1

TAG Hooks

A Collection of React Hooks created by @taglivros

useCountdown hook

this hook provides a simple countdown with hours, minutes and seconds

Reference

Methods

Properties

Usage

import React, { useEffect } from 'react'
import { useCountdown } from '@taglivros/tag-hooks'

const App = () => {
  const {
    initializeCountdown,
    startCountdown,
    days,
    hours,
    minutes,
    seconds } = useCountdown()
  useEffect(() => {
    initializeCountdown({ endDate: new Date(2022, 5, 5, 5) })// insert here a valid date
    startCountdown()
  })

  return (
    <div>
      <h1>{days}</h1>
      <h1>{hours}</h1>
      <h1>{minutes}</h1>
      <h1>{seconds}</h1>
    </div>
  )
}

🚨 Note: You should wrap the component that uses useCountdown with <CountdownProvider> in an higher level due its useContext use:

import React from 'react'
import { CountdownProvider } from '@taglivros/tag-hooks'

const AppWrapper = () => {
  return (
    <CountdownProvider>
      <App />
    </CountdownProvider>
  )
}