import React from "react";
import { useFieldState } from "@/components/form/hook/use-field-state";
import { Label, LabelProps } from "@/components/ui/label";
import { cn } from "@/lib/utils/cn";

export type FormLabelProps = LabelProps & {
    name: string;
};

export const FormLabel: React.FC<FormLabelProps> = (props) => {
    const {
        className,
        name,
        ...rest
    } = props;

    const {
        error
    } = useFieldState(name);

    return (
        <Label
          {...rest}
          className={cn("data-[error=true]:text-destructive", className)}
          data-slot="form-label"
          data-error={!!error} />
    );
};