feat(agents): own agents page with tree sidebar in StartLayout, like settings/help

2026-08-17 11:46:08 +02:00
parent cbb17c4ddd
commit 7c6f33983d
5 changed files with 173 additions and 3 deletions
@@ -0,0 +1,35 @@
+import React from 'react';
+
+export function AgentsOverviewPage() {
+  return (
+    <div className="max-w-4xl mx-auto">
+      <h1 className="text-2xl font-bold text-secondary-900 mb-4">Agenten Übersicht</h1>
+      <p className="text-secondary-600 mb-6">
+        Verwalten Sie KI-Agenten, führen Sie diese aus und überwachen Sie deren Ausführungen.
+      </p>
+      <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+        <div className="p-6 bg-white rounded-xl border border-secondary-200">
+          <div className="w-12 h-12 bg-primary-100 rounded-lg flex items-center justify-center mb-3">
+            <svg className="w-6 h-6 text-primary-600" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M3 13l2-6h14l2 6M3 13v4a2 2 0 002 2h14a2 2 0 002-2v-4" /></svg>
+          </div>
+          <h3 className="font-semibold text-secondary-900">Agenten</h3>
+          <p className="text-sm text-secondary-500 mt-1">KI-Agenten erstellen, konfigurieren und ausführen</p>
+        </div>
+        <div className="p-6 bg-white rounded-xl border border-secondary-200">
+          <div className="w-12 h-12 bg-warning-100 rounded-lg flex items-center justify-center mb-3">
+            <svg className="w-6 h-6 text-warning-600" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 10V3L4 14h7v7l9-11h-7z" /></svg>
+          </div>
+          <h3 className="font-semibold text-secondary-900">Automation</h3>
+          <p className="text-sm text-secondary-500 mt-1">Automatisierte Workflows und Trigger</p>
+        </div>
+        <div className="p-6 bg-white rounded-xl border border-secondary-200">
+          <div className="w-12 h-12 bg-success-100 rounded-lg flex items-center justify-center mb-3">
+            <svg className="w-6 h-6 text-success-600" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z" /></svg>
+          </div>
+          <h3 className="font-semibold text-secondary-900">KI</h3>
+          <p className="text-sm text-secondary-500 mt-1">KI-Assistent und Proactive AI</p>
+        </div>
+      </div>
+    </div>
+  );
+}
@@ -0,0 +1,12 @@
+import React from 'react';
+
+export function AgentsPlaceholderPage() {
+  return (
+    <div className="max-w-4xl mx-auto">
+      <h1 className="text-2xl font-bold text-secondary-900 mb-4">Agenten</h1>
+      <p className="text-secondary-600">
+        Diese Seite wird gerade erstellt. Wählen Sie ein Thema aus dem Menü links.
+      </p>
+    </div>
+  );
+}