fix run build

This commit is contained in:
2026-05-19 13:41:17 +07:00
parent 55a0133ed4
commit 8b061f7489
2 changed files with 119 additions and 86 deletions
+17 -7
View File
@@ -1,10 +1,10 @@
"use client";
import { useEffect, useState } from "react";
import { Suspense, useEffect, useState } from "react";
import { useSearchParams } from "next/navigation";
import Link from "next/link";
export default function RegistrationCancelPage() {
function CancelContent() {
const searchParams = useSearchParams();
const token = searchParams.get("token");
const [cancelled, setCancelled] = useState(false);
@@ -21,6 +21,18 @@ export default function RegistrationCancelPage() {
}
}, [token]);
return (
<>
{!cancelled && (
<p className="mt-6 text-on-surface-variant text-xs opacity-60">
Đang cập nhật trạng thái...
</p>
)}
</>
);
}
export default function RegistrationCancelPage() {
return (
<main className="min-h-screen bg-[var(--color-background)] flex items-center justify-center px-[var(--spacing-gutter)] py-[80px]">
<div className="w-full max-w-[560px]">
@@ -59,11 +71,9 @@ export default function RegistrationCancelPage() {
</Link>
</div>
{!cancelled && (
<p className="mt-6 text-on-surface-variant text-xs opacity-60">
Đang cập nhật trạng thái...
</p>
)}
<Suspense fallback={null}>
<CancelContent />
</Suspense>
</div>
</div>
</main>
+102 -79
View File
@@ -1,10 +1,10 @@
"use client";
import { useEffect, useState } from "react";
import { Suspense, useEffect, useState } from "react";
import { useSearchParams } from "next/navigation";
import Link from "next/link";
export default function RegistrationSuccessPage() {
function SuccessContent() {
const searchParams = useSearchParams();
const token = searchParams.get("token");
const payerId = searchParams.get("PayerID");
@@ -43,99 +43,122 @@ export default function RegistrationSuccessPage() {
}, [token, payerId]);
return (
<main className="min-h-screen bg-[var(--color-background)] flex items-center justify-center px-[var(--spacing-gutter)] py-[80px]">
<div className="w-full max-w-[560px]">
{state === "loading" && (
<div className="glass-panel rounded-xl p-[48px] text-center">
<div className="flex justify-center mb-6">
<span className="material-symbols-outlined text-[48px] text-primary animate-spin">
progress_activity
</span>
</div>
<p className="text-on-surface-variant text-lg">
Đang xử thanh toán của bạn...
</p>
<>
{state === "loading" && (
<div className="glass-panel rounded-xl p-[48px] text-center">
<div className="flex justify-center mb-6">
<span className="material-symbols-outlined text-[48px] text-primary animate-spin">
progress_activity
</span>
</div>
)}
<p className="text-on-surface-variant text-lg">
Đang xử thanh toán của bạn...
</p>
</div>
)}
{state === "success" && (
<div className="glass-panel rounded-xl p-[48px] text-center relative overflow-hidden">
<div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-primary/20 to-transparent" />
{state === "success" && (
<div className="glass-panel rounded-xl p-[48px] text-center relative overflow-hidden">
<div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-primary/20 to-transparent" />
<div className="flex justify-center mb-6">
<span className="material-symbols-outlined text-[64px] text-green-400">
check_circle
</span>
</div>
<div className="flex justify-center mb-6">
<span className="material-symbols-outlined text-[64px] text-green-400">
check_circle
</span>
</div>
<h1 className="font-[var(--font-display-lg)] text-[clamp(1.5rem,3vw,2rem)] text-on-surface mb-3 leading-[1.2]">
Thanh toán thành công!
</h1>
<h1 className="font-[var(--font-display-lg)] text-[clamp(1.5rem,3vw,2rem)] text-on-surface mb-3 leading-[1.2]">
Thanh toán thành công!
</h1>
<p className="text-on-surface-variant text-base mb-8">
Cảm ơn bạn đã đăng tham dự IPv6 Summit.
</p>
<p className="text-on-surface-variant text-base mb-8">
Cảm ơn bạn đã đăng tham dự IPv6 Summit.
</p>
<div className="bg-[var(--color-surface-container-high)] rounded-lg p-6 mb-8 text-left space-y-3">
{registrationId && (
<div className="flex items-center justify-between">
<span className="text-on-surface-variant text-sm"> đăng </span>
<span className="text-primary font-mono font-medium">
#{registrationId}
</span>
</div>
)}
<div className="bg-[var(--color-surface-container-high)] rounded-lg p-6 mb-8 text-left space-y-3">
{registrationId && (
<div className="flex items-center justify-between">
<span className="text-on-surface-variant text-sm">Số tiền đã thanh toán</span>
<span className="text-on-surface font-medium">$120 USD</span>
<span className="text-on-surface-variant text-sm"> đăng </span>
<span className="text-primary font-mono font-medium">
#{registrationId}
</span>
</div>
</div>
<p className="text-on-surface-variant text-sm">
Chúng tôi sẽ liên hệ với bạn qua email đ xác nhận.
</p>
<div className="mt-8">
<Link
href="/"
className="inline-flex items-center gap-2 text-primary hover:text-on-surface transition-colors text-sm"
>
<span className="material-symbols-outlined text-[18px]">home</span>
Về trang chủ
</Link>
)}
<div className="flex items-center justify-between">
<span className="text-on-surface-variant text-sm">Số tiền đã thanh toán</span>
<span className="text-on-surface font-medium">$120 USD</span>
</div>
</div>
)}
{state === "error" && (
<div className="glass-panel rounded-xl p-[48px] text-center relative overflow-hidden">
<div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-primary/20 to-transparent" />
<div className="flex justify-center mb-6">
<span className="material-symbols-outlined text-[64px] text-red-400">
error
</span>
</div>
<h1 className="font-[var(--font-display-lg)] text-[clamp(1.5rem,3vw,2rem)] text-on-surface mb-3 leading-[1.2]">
lỗi xảy ra
</h1>
{errorMessage && (
<p className="text-on-surface-variant text-base mb-8">
{errorMessage}
</p>
)}
<p className="text-on-surface-variant text-sm">
Chúng tôi sẽ liên hệ với bạn qua email đ xác nhận.
</p>
<div className="mt-8">
<Link
href="/registration"
className="inline-flex items-center gap-2 px-6 py-3 rounded-lg gold-gradient-bg text-on-primary font-medium transition-opacity hover:opacity-90"
href="/"
className="inline-flex items-center gap-2 text-primary hover:text-on-surface transition-colors text-sm"
>
<span className="material-symbols-outlined text-[18px]">refresh</span>
Thử lại đăng
<span className="material-symbols-outlined text-[18px]">home</span>
Về trang chủ
</Link>
</div>
)}
</div>
)}
{state === "error" && (
<div className="glass-panel rounded-xl p-[48px] text-center relative overflow-hidden">
<div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-primary/20 to-transparent" />
<div className="flex justify-center mb-6">
<span className="material-symbols-outlined text-[64px] text-red-400">
error
</span>
</div>
<h1 className="font-[var(--font-display-lg)] text-[clamp(1.5rem,3vw,2rem)] text-on-surface mb-3 leading-[1.2]">
lỗi xảy ra
</h1>
{errorMessage && (
<p className="text-on-surface-variant text-base mb-8">
{errorMessage}
</p>
)}
<Link
href="/registration"
className="inline-flex items-center gap-2 px-6 py-3 rounded-lg gold-gradient-bg text-on-primary font-medium transition-opacity hover:opacity-90"
>
<span className="material-symbols-outlined text-[18px]">refresh</span>
Thử lại đăng
</Link>
</div>
)}
</>
);
}
export default function RegistrationSuccessPage() {
return (
<main className="min-h-screen bg-[var(--color-background)] flex items-center justify-center px-[var(--spacing-gutter)] py-[80px]">
<div className="w-full max-w-[560px]">
<Suspense
fallback={
<div className="glass-panel rounded-xl p-[48px] text-center">
<div className="flex justify-center mb-6">
<span className="material-symbols-outlined text-[48px] text-primary animate-spin">
progress_activity
</span>
</div>
<p className="text-on-surface-variant text-lg">
Đang tải...
</p>
</div>
}
>
<SuccessContent />
</Suspense>
</div>
</main>
);