fix: frontend error handling — ErrorBoundary, type-safe errors, stable keys

- React ErrorBoundary wrapping entire app for graceful crash recovery
- fetchJSON error handling uses try/catch instead of .catch() chain
- CertificateDetailPage: instanceof checks replace unsafe type casts
- DataTable: keyField prop replaces array index keys

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
shankar0123
2026-03-20 01:20:32 -04:00
parent 7618c5a734
commit bb7a78352e
5 changed files with 91 additions and 31 deletions
+4 -4
View File
@@ -130,7 +130,7 @@ export default function CertificateDetailPage() {
)}
{renewMutation.isError && (
<div className="bg-red-500/10 border border-red-500/20 text-red-400 rounded-lg px-4 py-3 text-sm">
Failed to trigger renewal: {(renewMutation.error as Error).message}
Failed to trigger renewal: {renewMutation.error instanceof Error ? renewMutation.error.message : 'Unknown error'}
</div>
)}
{deployMutation.isSuccess && (
@@ -140,12 +140,12 @@ export default function CertificateDetailPage() {
)}
{deployMutation.isError && (
<div className="bg-red-500/10 border border-red-500/20 text-red-400 rounded-lg px-4 py-3 text-sm">
Failed to deploy: {(deployMutation.error as Error).message}
Failed to deploy: {deployMutation.error instanceof Error ? deployMutation.error.message : 'Unknown error'}
</div>
)}
{archiveMutation.isError && (
<div className="bg-red-500/10 border border-red-500/20 text-red-400 rounded-lg px-4 py-3 text-sm">
Failed to archive: {(archiveMutation.error as Error).message}
Failed to archive: {archiveMutation.error instanceof Error ? archiveMutation.error.message : 'Unknown error'}
</div>
)}
@@ -226,7 +226,7 @@ export default function CertificateDetailPage() {
<h2 className="text-lg font-semibold text-slate-200 mb-4">Deploy Certificate</h2>
{deployMutation.isError && (
<div className="bg-red-500/10 border border-red-500/20 text-red-400 rounded-lg px-3 py-2 text-sm mb-3">
{(deployMutation.error as Error).message}
{deployMutation.error instanceof Error ? deployMutation.error.message : 'Unknown error'}
</div>
)}
<label className="text-xs text-slate-400 block mb-2">Select Target</label>