react-use-multi-timer

react-use-multi-timer is a React hook for managing multiple timers with ease.

Installation

You can install the package using npm or yarn:

1npm install react-use-multi-timer
2# or
3yarn add react-use-multi-timer
4
5import React from 'react';
6import useTextOrderTimer from 'react-use-multi-timer';
7
8function App() {
9  const { startAllModalHandlerTimer, stoptAllModalHandlerTimer, timerStates } = useTextOrderTimer();
10
11  const handleStartTimer = () => {
12    // Duration in seconds for the timer
13    const durationInSeconds = 10;
14
15     // Start a timer with ID "YourTimerID" that counts down from 10 seconds
16    startAllModalHandlerTimer("YourTimerID", durationInSeconds, () => {
17      console.log("Timer completed");
18    });
19  };
20
21  const handleStopTimer = () => {
22     // Stop a timer with ID "YourTimerID"
23    stoptAllModalHandlerTimer("YourTimerID");
24  };
25
26  return (
27    <div className="App">
28      <button onClick={handleStartTimer}>Start Timer</button>
29      <button onClick={handleStopTimer}>Stop Timer</button>
30        {/* Display the remaining time in seconds for the timer with ID "YourTimerID" */}
31      <div>Time left: {timerStates["YourTimerID"]}</div>
32    </div>
33  );
34}
35
36export default App;
37