i'm very novice, i trying make a countdown for reload the page every 15min for all users on my website. Actually is work but only for client side, i dont know how to do for make it "server side"
Like same countdown for everybody on website.
Maybe need to take servers side date ? but idk wow to do that .
import Countdown from "react-countdown";
import { useState, useEffect } from "react";
const twoDigits = (num) => String(num).padStart(2, '0')
// Renderer callback with condition
const renderer = ({ minutes, seconds, completed }) => {
if (completed) {
// Render a complete state
return (window.location.reload(), []);
} else {
// Render a countdown
return (
<span>
{twoDigits(minutes)}:{twoDigits(seconds)}
</span>
);
}
};
const getLocalStorageValue = (s) => localStorage.getItem(s);
function RebaseCountdown() {
const [data, setData] = useState(
{ date: Date.now(), delay: 900000, }
);
const wantedDelay = 900000;
useEffect(() => {
const savedDate = getLocalStorageValue("end_date");
if (savedDate != null && !isNaN(savedDate)) {
const currentTime = Date.now();
const delta = parseInt(savedDate, 10) - currentTime;
//Do you reach the end?
if (delta > wantedDelay) {
//Yes we clear our saved end date
if (localStorage.getItem("end_date").length > 0)
localStorage.removeItem("end_date");
} else {
//No update the end date with the current date
setData({ date: currentTime, delay: delta });
}
}
}, []);
return (
<div>
<Countdown
date={data.date + data.delay}
renderer={renderer}
intervalDelay={3}
autoStart={true}
onStart={(delta) => {
//Save the end date
if (localStorage.getItem("end_date") == null)
localStorage.setItem(
"end_date",
JSON.stringify(data.date + data.delay)
);
}}
onComplete={() => {
if (localStorage.getItem("end_date") != null)
localStorage.removeItem("end_date");
}}
/>
</div>
)
}
export default RebaseCountdown