new features

src/pages/UnderMaintenancePage/UnderMaintenancePage.tsx

@@ -0,0 +1,43 @@
+"use client"
+
+import type { IUnderMaintenancePageProps } from "./UnderMaintenancePage.d"
+import type { JSX } from "react"
+
+import { FunctionComponent, useEffect } from "react"
+import { useRouter, useSearchParams } from "next/navigation"
+import { Construction } from "lucide-react"
+
+import api from "@shared/api"
+
+import styles from "./UnderMaintenancePage.module.scss"
+
+const PING_INTERVAL_MS = 5000
+
+export const UnderMaintenancePage: FunctionComponent<IUnderMaintenancePageProps> = (): JSX.Element => {
+	const router = useRouter()
+	const searchParams = useSearchParams()
+	const redirectPath = searchParams.get("path") || "/"
+
+	const { isSuccess } = api.useQuery("get", "/api/ping/", {}, {
+		refetchInterval: PING_INTERVAL_MS,
+		retry: false,
+	})
+
+	useEffect(() => {
+		if (isSuccess) {
+			router.replace(redirectPath)
+		}
+	}, [isSuccess, redirectPath, router])
+
+	return (
+		<div className={styles.root} data-testid="UnderMaintenancePage">
+			<div className={styles.card}>
+				<div className={styles.icon}>
+					<Construction size={48} strokeWidth={1.5} />
+				</div>
+				<h1 className={styles.title}>Платформа недоступна</h1>
+				<p className={styles.description}>Попробуйте зайти позже.</p>
+			</div>
+		</div>
+	)
+}