import React, { useEffect, useState } from 'react';
import { useVendorById } from 'src/apollo/queries/vendor-search';
import { USER_FEATURES } from 'src/constants';
import { isFeatureFlagEnabled } from 'src/utils/feature-flag';

interface ContractTermLabelNameProps {
    labelId: string | null | undefined;
    className?: string;
    dataTestId?: string;
}

export const ContractTermLabelName: React.FC<ContractTermLabelNameProps> = ({
    labelId,
    className = 'ContractTermLabelName',
    dataTestId = 'ContractTermLabelNameTestId',
}) => {
    const [labelName, setLabelName] = useState<string>('');
    const { data: vendorData, getVendorById } = useVendorById();

    const isFeatureCreateTermsWithNoTracksAndProducts: boolean =
        isFeatureFlagEnabled(
            USER_FEATURES.ABACUS_CREATE_TERMS_WITH_NO_TRACKS_AND_PRODUCTS
        );

    useEffect(() => {
        if (vendorData?.orchardLabel) {
            const vendorItem = vendorData.orchardLabel;
            if ('name' in vendorItem) {
                setLabelName(vendorItem.name);
            } else {
                setLabelName('');
            }
        }
    }, [vendorData]);

    useEffect(() => {
        if (labelId != null) {
            const parsedLabelId = parseInt(labelId, 10);
            if (!isNaN(parsedLabelId)) {
                void getVendorById(parsedLabelId);
            }
        }
    }, []);

    return (
        <span className={className} data-testid={dataTestId}>
            {isFeatureCreateTermsWithNoTracksAndProducts
                ? labelName !== '' && labelId !== null
                    ? `${labelName} (${labelId})`
                    : 'No Account Listed'
                : `${labelName} (${labelId})`}
        </span>
    );
};

export default ContractTermLabelName;