38 lines
1.8 KiB
TypeScript
38 lines
1.8 KiB
TypeScript
|
"use client";
|
||
|
|
|
||
|
|
// [DBG-r3p1] error boundary ของ taskpane — แสดง error จริงแทนหน้า
|
||
|
|
// "Application error: a client-side exception has occurred" ของ Next
|
||
|
|
// (ไว้ใช้ debug ใน webview ของ Word ที่เปิด devtools ไม่ได้ — คงไว้ถาวร
|
||
|
|
// เพราะดีกว่าข้อความกลาง ๆ ของ Next เสมอ สำหรับ add-in ที่ผู้ใช้เปิด console ไม่ได้)
|
||
|
|
export default function WordAddinError({
|
||
|
|
error,
|
||
|
|
reset,
|
||
|
|
}: {
|
||
|
|
error: Error & { digest?: string };
|
||
|
|
reset: () => void;
|
||
|
|
}) {
|
||
|
|
return (
|
||
|
|
<div className="flex min-h-screen flex-col gap-3 p-4">
|
||
|
|
<h2 className="font-display text-base font-semibold text-ink">task pane ทำงานผิดพลาด</h2>
|
||
|
|
<p className="text-sm text-ink-soft">
|
||
|
|
เกิดข้อผิดพลาดฝั่งหน้าเว็บ — แจ้งข้อความด้านล่าง (ถ่ายภาพหน้าจอนี้มาด้วย) แล้วกดลองใหม่
|
||
|
|
</p>
|
||
|
|
<pre
|
||
|
|
className="max-h-64 overflow-auto whitespace-pre-wrap rounded-lg border border-line bg-canvas p-3 text-xs text-error-ink"
|
||
|
|
aria-label="รายละเอียดข้อผิดพลาด"
|
||
|
|
>
|
||
|
|
{error.message}
|
||
|
|
{error.digest ? `\n[digest ${error.digest}]` : ""}
|
||
|
|
{error.stack ? `\n\n${error.stack}` : ""}
|
||
|
|
</pre>
|
||
|
|
<button
|
||
|
|
type="button"
|
||
|
|
className="focus-ring w-fit rounded-md border border-line bg-white px-3 py-1.5 text-sm text-ink hover:border-primary hover:text-primary"
|
||
|
|
onClick={reset}
|
||
|
|
>
|
||
|
|
ลองใหม่
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|