Initial commit

src/components/Analysis/WeaknessPriorityList.jsx

@@ -0,0 +1,42 @@
+import React from 'react';
+
+const scoreToPercent = (score) => Math.round(Math.max(0, Math.min(1.5, score)) * 100);
+
+export default function WeaknessPriorityList({ weaknesses = [] }) {
+  if (!weaknesses.length) {
+    return (
+      <div className="rounded-2xl border border-dashed border-gray-300 dark:border-gray-700 bg-white/70 dark:bg-gray-900/70 p-4 text-sm text-gray-600 dark:text-gray-300">
+        Keine Schwächen-Daten verfügbar.
+      </div>
+    );
+  }
+
+  return (
+    <div className="rounded-2xl border border-rose-200 dark:border-rose-900 bg-white dark:bg-gray-900 p-5 shadow-sm">
+      <h3 className="text-lg font-semibold text-rose-700 dark:text-rose-300 mb-4">Top-3 Schwächen</h3>
+
+      <div className="space-y-3">
+        {weaknesses.map((item, index) => (
+          <div
+            key={item.name}
+            className="rounded-xl border border-rose-100 dark:border-rose-900/60 bg-rose-50/60 dark:bg-rose-950/20 p-3"
+          >
+            <div className="flex items-center justify-between gap-3">
+              <p className="font-semibold text-gray-900 dark:text-gray-100">
+                {index + 1}. {item.name}
+              </p>
+              <span className="text-xs px-2 py-1 rounded-full bg-rose-200/70 dark:bg-rose-800/60 text-rose-800 dark:text-rose-200 font-semibold">
+                {scoreToPercent(item.priorityScore)}
+              </span>
+            </div>
+            <div className="mt-2 grid grid-cols-3 gap-2 text-xs text-gray-600 dark:text-gray-300">
+              <p>Gap: {item.gapScore.toFixed(2)}</p>
+              <p>Konstanz: {item.consistencyScore.toFixed(2)}</p>
+              <p>Trend: {item.trendDelta.toFixed(2)}</p>
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}