prowler/ui/components/integrations/saml/saml-integration-card.tsx

"use client";

import { Trash2Icon } from "lucide-react";
import { useState } from "react";

import { deleteSamlConfig } from "@/actions/integrations";
import {
  Badge,
  Button,
  Card,
  CardAction,
  CardContent,
  CardHeader,
  useToast,
} from "@/components/shadcn";
import { CustomLink } from "@/components/shadcn/custom/custom-link";
import { Modal } from "@/components/shadcn/modal";

import { SamlConfigForm } from "./saml-config-form";

export const SamlIntegrationCard = ({ samlConfig }: { samlConfig?: any }) => {
  const [isSamlModalOpen, setIsSamlModalOpen] = useState(false);
  const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
  const [isDeleting, setIsDeleting] = useState(false);
  const { toast } = useToast();
  const id = samlConfig?.id;
  const statusLabel = id ? "Enabled" : "Disabled";

  const handleRemoveSaml = async () => {
    if (!id) return;

    setIsDeleting(true);
    try {
      const result = await deleteSamlConfig(id);

      if (result.success) {
        toast({
          title: "SAML configuration removed",
          description: result.success,
        });
        setIsDeleteModalOpen(false);
      } else if (result.errors?.general) {
        toast({
          variant: "destructive",
          title: "Error removing SAML configuration",
          description: result.errors.general,
        });
      }
    } catch {
      toast({
        variant: "destructive",
        title: "Error",
        description: "Failed to remove SAML configuration. Please try again.",
      });
    } finally {
      setIsDeleting(false);
    }
  };

  return (
    <>
      {/* Configure SAML Modal */}
      <Modal
        open={isSamlModalOpen}
        onOpenChange={setIsSamlModalOpen}
        title="Configure SAML SSO"
      >
        <SamlConfigForm
          setIsOpen={setIsSamlModalOpen}
          samlConfig={samlConfig}
        />
      </Modal>

      {/* Delete Confirmation Modal */}
      <Modal
        open={isDeleteModalOpen}
        onOpenChange={setIsDeleteModalOpen}
        title="Remove SAML Configuration"
        size="md"
      >
        <div className="flex flex-col gap-4">
          <p className="text-text-neutral-secondary text-sm">
            Are you sure you want to remove the SAML SSO configuration? Users
            will no longer be able to sign in using SAML.
          </p>
          <div className="flex w-full justify-end gap-4">
            <Button
              type="button"
              variant="ghost"
              size="lg"
              onClick={() => setIsDeleteModalOpen(false)}
              disabled={isDeleting}
            >
              Cancel
            </Button>
            <Button
              type="button"
              variant="destructive"
              size="lg"
              disabled={isDeleting}
              onClick={handleRemoveSaml}
            >
              <Trash2Icon className="size-4" />
              {isDeleting ? "Removing..." : "Remove"}
            </Button>
          </div>
        </div>
      </Modal>

      <Card variant="inner" padding="none" className="gap-4 p-4 md:p-5">
        <CardHeader>
          <div className="flex flex-col gap-1">
            <h4 className="text-lg font-bold">SAML SSO Integration</h4>
            <p className="text-xs text-gray-500">
              {id ? (
                "SAML Single Sign-On is enabled for this organization"
              ) : (
                <>
                  Configure SAML Single Sign-On for secure authentication.{" "}
                  <CustomLink href="https://docs.prowler.com/projects/prowler-open-source/en/latest/tutorials/prowler-app-sso">
                    Read the docs
                  </CustomLink>
                </>
              )}
            </p>
          </div>
          <CardAction className="pt-2">
            <Badge variant={id ? "success" : "outline"}>{statusLabel}</Badge>
          </CardAction>
        </CardHeader>
        <CardContent>
          <div className="flex justify-end gap-2">
            <Button size="sm" onClick={() => setIsSamlModalOpen(true)}>
              {id ? "Update" : "Enable"}
            </Button>
            {id && (
              <Button
                size="sm"
                variant="destructive"
                onClick={() => setIsDeleteModalOpen(true)}
              >
                <Trash2Icon size={16} />
                Remove
              </Button>
            )}
          </div>
        </CardContent>
      </Card>
    </>
  );
};