81 lines
2.1 KiB
TypeScript
81 lines
2.1 KiB
TypeScript
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||
/* eslint-disable react-hooks/exhaustive-deps */
|
||
import { differenceInMilliseconds, isAfter, parseISO } from "date-fns";
|
||
import ky from "ky";
|
||
import { useEffect, useState } from "react";
|
||
import Countdown from "react-countdown";
|
||
import { useLocation, useNavigate, useParams } from "react-router-dom";
|
||
|
||
function ScheduledPage() {
|
||
const params = useParams();
|
||
const { search } = useLocation();
|
||
const navigate = useNavigate();
|
||
const [countdownSeconds, setCountdownSeconds] = useState<number>();
|
||
const [showWait, setShowWait] = useState<boolean>();
|
||
|
||
async function connect() {
|
||
try {
|
||
const result: any = await ky
|
||
.get(
|
||
`${import.meta.env.VITE_CRM_API_URL}/scheduledSessions/${
|
||
params.sessionId
|
||
}`
|
||
)
|
||
.json();
|
||
|
||
if (isAfter(parseISO(result.startAt), new Date())) {
|
||
const diffMs = differenceInMilliseconds(
|
||
parseISO(result.startAt),
|
||
new Date()
|
||
);
|
||
|
||
setCountdownSeconds(diffMs);
|
||
return;
|
||
}
|
||
|
||
if (!result.activeSessionId) {
|
||
setShowWait(true);
|
||
|
||
setTimeout(() => {
|
||
connect();
|
||
}, 1000);
|
||
return;
|
||
}
|
||
|
||
navigate(`/stream/${result.activeSessionId}${search}`);
|
||
} catch (error) {
|
||
if (error instanceof Error) {
|
||
console.log(error.message);
|
||
}
|
||
}
|
||
}
|
||
|
||
useEffect(() => {
|
||
connect();
|
||
}, []);
|
||
|
||
return (
|
||
<div className="min-h-screen p-8 text-[#F2F2F2] flex flex-col justify-center items-center">
|
||
{countdownSeconds && (
|
||
<div className="space-y-4 w-[340px]">
|
||
<p className="text-2xl font-gilroy">Сеанс начнется через:</p>
|
||
<p className="text-6xl font-gilroy">
|
||
<Countdown
|
||
date={Date.now() + countdownSeconds + 15000}
|
||
onComplete={() => window.location.reload()}
|
||
/>
|
||
</p>
|
||
</div>
|
||
)}
|
||
|
||
{showWait && (
|
||
<div className="space-y-4 w-[340px]">
|
||
<p className="text-2xl font-gilroy">Пожалуйста, подождите...</p>
|
||
</div>
|
||
)}
|
||
</div>
|
||
);
|
||
}
|
||
|
||
export default ScheduledPage;
|