- Updated Mini App design guidelines to include detailed instructions on UI changes, accessibility rules, and verification processes. - Refactored multiple components to utilize `MiniAppScreen` and `MiniAppScreenContent` for consistent layout structure across the application. - Improved error handling in `GlobalError` and `NotFound` components by integrating new layout components for better user experience. - Introduced new hooks for admin functionality, streamlining access checks and data loading processes. - Enhanced documentation to reflect changes in design policies and component usage, ensuring clarity for future development.
56 lines
1.7 KiB
TypeScript
56 lines
1.7 KiB
TypeScript
/**
|
|
* Next.js root error boundary. Replaces the root layout when an unhandled error occurs.
|
|
* Must define its own html/body. For most runtime errors the in-app AppErrorBoundary is used.
|
|
*/
|
|
|
|
"use client";
|
|
|
|
import { useEffect } from "react";
|
|
import "./globals.css";
|
|
import { getLang, translate } from "@/i18n/messages";
|
|
import { callMiniAppReadyOnce } from "@/lib/telegram-ready";
|
|
import { THEME_BOOTSTRAP_SCRIPT } from "@/lib/theme-bootstrap-script";
|
|
import { Button } from "@/components/ui/button";
|
|
import { MiniAppScreen, MiniAppScreenContent } from "@/components/layout/MiniAppScreen";
|
|
|
|
export default function GlobalError({
|
|
error,
|
|
reset,
|
|
}: {
|
|
error: Error & { digest?: string };
|
|
reset: () => void;
|
|
}) {
|
|
const lang = getLang();
|
|
|
|
useEffect(() => {
|
|
callMiniAppReadyOnce();
|
|
}, []);
|
|
|
|
return (
|
|
<html
|
|
lang={lang === "ru" ? "ru" : "en"}
|
|
data-theme="dark"
|
|
suppressHydrationWarning
|
|
>
|
|
<head>
|
|
<script dangerouslySetInnerHTML={{ __html: THEME_BOOTSTRAP_SCRIPT }} />
|
|
</head>
|
|
<body className="antialiased">
|
|
<MiniAppScreen>
|
|
<MiniAppScreenContent className="items-center justify-center gap-4 px-4 text-foreground">
|
|
<h1 className="text-xl font-semibold">
|
|
{translate(lang, "error_boundary.message")}
|
|
</h1>
|
|
<p className="text-center text-muted-foreground">
|
|
{translate(lang, "error_boundary.description")}
|
|
</p>
|
|
<Button type="button" onClick={() => reset()}>
|
|
{translate(lang, "error_boundary.reload")}
|
|
</Button>
|
|
</MiniAppScreenContent>
|
|
</MiniAppScreen>
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|