fix: prevent [object Object] rendering in 25 frontend components
Replace direct {error} JSX rendering with typeof check + .message fallback.
When error is an object (not a string), React showed [object Object].
Now renders error.message or fallback string.
This commit is contained in:
@@ -49,7 +49,7 @@ function ProviderTab() {
|
||||
<h2 className="text-lg font-semibold">Anbieter</h2>
|
||||
<button onClick={() => { setShowForm(!showForm); setEditId(null); setForm({ name: '', provider_type: 'openai', api_key: '', base_url: '', is_default: false }); }} className="px-3 py-1.5 text-sm bg-primary-600 text-white rounded-lg hover:bg-primary-700">+ Hinzufügen</button>
|
||||
</div>
|
||||
{error && <div className="text-sm text-red-600">{error}</div>}
|
||||
{error && <div className="text-sm text-red-600">{typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}</div>}
|
||||
{showForm && (
|
||||
<div className="border border-secondary-200 rounded-lg p-4 space-y-3 bg-secondary-50">
|
||||
<div className="grid grid-cols-2 gap-3">
|
||||
@@ -134,7 +134,7 @@ function PresetTab() {
|
||||
<h2 className="text-lg font-semibold">Modelle & Presets</h2>
|
||||
<button onClick={() => { setShowForm(!showForm); setEditId(null); setForm({ name: '', model_id: '', provider_id: '', temperature: 0.7, max_tokens: 2048, top_p: 1.0, system_prompt: '' }); }} className="px-3 py-1.5 text-sm bg-primary-600 text-white rounded-lg">+ Hinzufügen</button>
|
||||
</div>
|
||||
{error && <div className="text-sm text-red-600">{error}</div>}
|
||||
{error && <div className="text-sm text-red-600">{typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}</div>}
|
||||
{showForm && (
|
||||
<div className="border border-secondary-200 rounded-lg p-4 space-y-3 bg-secondary-50">
|
||||
<div className="grid grid-cols-2 gap-3">
|
||||
@@ -225,7 +225,7 @@ function AgentTab() {
|
||||
<h2 className="text-lg font-semibold">Agenten</h2>
|
||||
<button onClick={() => { setShowForm(!showForm); setEditId(null); setForm({ name: '', description: '', system_prompt: '', preset_id: '', tool_ids: [] }); }} className="px-3 py-1.5 text-sm bg-primary-600 text-white rounded-lg">+ Hinzufügen</button>
|
||||
</div>
|
||||
{error && <div className="text-sm text-red-600">{error}</div>}
|
||||
{error && <div className="text-sm text-red-600">{typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}</div>}
|
||||
{showForm && (
|
||||
<div className="border border-secondary-200 rounded-lg p-4 space-y-3 bg-secondary-50">
|
||||
<div className="grid grid-cols-2 gap-3">
|
||||
@@ -291,7 +291,7 @@ function ToolsTab() {
|
||||
<div className="space-y-4">
|
||||
<h2 className="text-lg font-semibold">Verfügbare Tools</h2>
|
||||
<p className="text-sm text-secondary-500">Diese Tools werden von Plugins bereitgestellt und können Agenten zugewiesen werden.</p>
|
||||
{error && <div className="text-sm text-red-600">{error}</div>}
|
||||
{error && <div className="text-sm text-red-600">{typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}</div>}
|
||||
{tools.length === 0 ? (
|
||||
<div className="text-sm text-secondary-400 py-8 text-center">Keine Tools verfügbar. Plugins können Tools registrieren.</div>
|
||||
) : (
|
||||
|
||||
@@ -555,7 +555,7 @@ export function CalendarPage() {
|
||||
<div className="flex flex-col h-full" data-testid="calendar-page">
|
||||
{error && (
|
||||
<div className="mb-2 p-3 bg-danger-50 border border-danger-200 rounded-md" role="alert" data-testid="calendar-error">
|
||||
<p className="text-sm text-danger-700">{error}</p>
|
||||
<p className="text-sm text-danger-700">{typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
@@ -98,7 +98,7 @@ export function CalendarKanbanPage() {
|
||||
className="mb-3 text-sm text-danger-700 bg-danger-50 border border-danger-200 rounded-md p-2"
|
||||
data-testid="kanban-error"
|
||||
>
|
||||
{error}
|
||||
{typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
@@ -501,7 +501,7 @@ function ChatWindow({ convId, category, onBack }: ChatWindowProps) {
|
||||
</div>
|
||||
)}
|
||||
{error && (
|
||||
<div className="text-sm text-red-600 bg-red-50 rounded p-3">{error}</div>
|
||||
<div className="text-sm text-red-600 bg-red-50 rounded p-3">{typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}</div>
|
||||
)}
|
||||
{!loading && messages.length === 0 && !aiStreaming && (
|
||||
<div className="text-center text-secondary-400 py-8">
|
||||
|
||||
@@ -114,7 +114,7 @@ export function DmsTrashPage() {
|
||||
<div className="p-6 max-w-7xl mx-auto" data-testid="dms-trash-page">
|
||||
<EmptyState
|
||||
title={t('dms.error')}
|
||||
description={error}
|
||||
description={typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}
|
||||
action={<Button onClick={() => window.location.reload()}>{t('dms.cancel')}</Button>}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -872,7 +872,7 @@ export function MailPage() {
|
||||
<div className="flex flex-col h-full" data-testid="mail-page">
|
||||
{error && (
|
||||
<div className="mb-2 p-3 bg-danger-50 border border-danger-200 rounded-md" role="alert" data-testid="mail-error">
|
||||
<p className="text-sm text-danger-700">{error}</p>
|
||||
<p className="text-sm text-danger-700">{typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
@@ -116,7 +116,7 @@ export function SettingsCurrenciesPage() {
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{error && <div className="p-3 text-sm text-red-700 bg-red-50 rounded-lg">{error}</div>}
|
||||
{error && <div className="p-3 text-sm text-red-700 bg-red-50 rounded-lg">{typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}</div>}
|
||||
|
||||
{showForm && (
|
||||
<form onSubmit={handleSubmit(onSubmit)} className="p-4 border border-secondary-200 rounded-lg space-y-3">
|
||||
|
||||
@@ -115,7 +115,7 @@ export function SettingsSequencesPage() {
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{error && <div className="p-3 text-sm text-red-700 bg-red-50 rounded-lg">{error}</div>}
|
||||
{error && <div className="p-3 text-sm text-red-700 bg-red-50 rounded-lg">{typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}</div>}
|
||||
|
||||
{showForm && (
|
||||
<form onSubmit={handleSubmit(onSubmit)} className="p-4 border border-secondary-200 rounded-lg space-y-3">
|
||||
|
||||
@@ -118,7 +118,7 @@ export function SettingsTaxesPage() {
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{error && <div className="p-3 text-sm text-red-700 bg-red-50 rounded-lg">{error}</div>}
|
||||
{error && <div className="p-3 text-sm text-red-700 bg-red-50 rounded-lg">{typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}</div>}
|
||||
|
||||
{showForm && (
|
||||
<form onSubmit={handleSubmit(onSubmit)} className="p-4 border border-secondary-200 rounded-lg space-y-3">
|
||||
|
||||
@@ -203,7 +203,7 @@ function WebhookFormModal({ open, onClose, webhook, onSubmit, isSubmitting, erro
|
||||
{/* Error */}
|
||||
{error && (
|
||||
<div className="rounded-md bg-danger-50 border border-danger-200 px-3 py-2 text-sm text-danger-700">
|
||||
{error}
|
||||
{typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
@@ -135,7 +135,7 @@ function TagFormModal({ open, onClose, tag, onSubmit, isSubmitting, error }: Tag
|
||||
{/* Error */}
|
||||
{error && (
|
||||
<div className="rounded-md bg-danger-50 border border-danger-200 px-3 py-2 text-sm text-danger-700">
|
||||
{error}
|
||||
{typeof error === "string" ? error : (error as any)?.message || "Ein Fehler ist aufgetreten"}
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user