feat(validation): add editing versioning revalidation and aligned reports

validation-suite/frontend/atlas/components/action-button.tsx

@@ -0,0 +1,39 @@
+"use client";
+
+import { Check } from "lucide-react";
+
+export type ActionState = "normal" | "loading" | "success" | "error";
+
+export function ActionButton({
+  children,
+  icon,
+  state = "normal",
+  loadingText,
+  successText = "Gespeichert",
+  disabled,
+  disabledReason,
+  variant = "secondary",
+  className = "",
+  ...props
+}: React.ButtonHTMLAttributes<HTMLButtonElement> & {
+  icon?: React.ReactNode;
+  state?: ActionState;
+  loadingText?: string;
+  successText?: string;
+  disabledReason?: string;
+  variant?: "primary" | "secondary" | "danger" | "success";
+}) {
+  const isDisabled = disabled || state === "loading";
+  const variantClass = state === "success" ? "btn-success" : state === "error" ? "btn-danger" : `btn-${variant}`;
+  return (
+    <button
+      {...props}
+      disabled={isDisabled}
+      title={isDisabled ? disabledReason : props.title}
+      className={`btn ${variantClass} ${className}`}
+    >
+      {state === "loading" ? <span className="spinner" /> : state === "success" ? <Check className="h-4 w-4" /> : icon}
+      <span>{state === "loading" ? loadingText ?? "Laedt..." : state === "success" ? successText : children}</span>
+    </button>
+  );
+}