add backend API maintenance screen

This commit is contained in:
Owen
2025-12-20 15:42:33 -05:00
committed by Owen Schwartz
parent 8af95ea1ca
commit b8ffc601d4
4 changed files with 145 additions and 32 deletions

View File

@@ -1,51 +1,57 @@
import { headers } from 'next/headers';
import { db } from '@server/db';
import { resources } from '@server/db';
import { eq } from 'drizzle-orm';
import { headers } from "next/headers";
import { internal } from "@app/lib/api";
import { AxiosResponse } from "axios";
import { GetMaintenanceInfoResponse } from "@server/routers/resource";
export const dynamic = "force-dynamic";
export const revalidate = 0;
export default async function MaintenanceScreen() {
let resource = null;
let title = 'Service Temporarily Unavailable';
let message = 'We are currently experiencing technical difficulties. Please check back soon.';
let estimatedTime;
let title = "Service Temporarily Unavailable";
let message =
"We are currently experiencing technical difficulties. Please check back soon.";
let estimatedTime: string | null = null;
try {
const headersList = await headers();
const host = headersList.get('host') || '';
const hostname = host.split(':')[0];
// Check if we're in build mode
const isBuildTime = process.env.NEXT_PHASE === 'phase-production-build';
const [res] = await db
.select()
.from(resources)
.where(eq(resources.fullDomain, hostname))
.limit(1);
if (!isBuildTime) {
try {
const headersList = await headers();
const host = headersList.get("host") || "";
const hostname = host.split(":")[0];
resource = res;
title = resource?.maintenanceTitle || title;
message = resource?.maintenanceMessage || message;
estimatedTime = resource?.maintenanceEstimatedTime;
} catch (err) {
const msg = err instanceof Error ? err.message : String(err);
console.warn("Skipping DB lookup during build or missing config:", msg);
const res = await internal.get<AxiosResponse<GetMaintenanceInfoResponse>>(
`/maintenance/info?fullDomain=${encodeURIComponent(hostname)}`
);
if (res && res.status === 200) {
const maintenanceInfo = res.data.data;
title = maintenanceInfo?.maintenanceTitle || title;
message = maintenanceInfo?.maintenanceMessage || message;
estimatedTime = maintenanceInfo?.maintenanceEstimatedTime || null;
}
} catch (err) {
console.warn(
"Failed to fetch maintenance info",
err instanceof Error ? err.message : String(err)
);
}
}
return (
<div className="min-h-screen flex items-center justify-center bg-gray-100">
<div className="max-w-2xl w-full bg-white/10 backdrop-blur-lg rounded-3xl p-8 shadow-2xl border border-white/20">
<div className="text-center">
<div className="text-6xl mb-6 animate-pulse">
🔧
</div>
<div className="text-6xl mb-6 animate-pulse">🔧</div>
<h1 className="text-4xl font-bold text-black mb-4">
{title}
</h1>
<p className="text-xl text-black/90 mb-6">
{message}
</p>
<p className="text-xl text-black/90 mb-6">{message}</p>
{estimatedTime && (
<div className="mt-8 p-4 bg-white/15 rounded-xl">
@@ -61,4 +67,4 @@ export default async function MaintenanceScreen() {
</div>
</div>
);
}
}