import React from 'react';
import { Identifier } from 'fhir/r4';
import { Text } from '../components/ui/text';

interface FhirIdentifierDisplayProps {
    identifier: Identifier | Identifier[] | undefined | null;
    emptyText?: string;
    className?: string;
}

export const formatSingleIdentifier = (identifier: Identifier): string => {
    if (!identifier) {
        return '';
    }

    const parts = [
        identifier.system,
        identifier.value
    ].filter(part => part);

    return parts.join(' | ') || '';
};

export const formatFhirIdentifier = (
    identifiers: Identifier | Identifier[] | undefined | null,
    options: {
        separator?: string;
        emptyText?: string;
    } = {}
): string => {
    const {
        separator = ', ',
        emptyText = '-'
    } = options;

    if (!identifiers) {
        return emptyText;
    }

    const identifierArray = Array.isArray(identifiers) ? identifiers : [identifiers];

    if (identifierArray.length === 0) {
        return emptyText;
    }

    return identifierArray
        .map(identifier => formatSingleIdentifier(identifier))
        .filter(identifier => identifier)
        .join(separator);
};

export const useFhirIdentifier = (
    identifiers: Identifier | Identifier[] | undefined | null,
    options: {
        separator?: string;
        emptyText?: string;
    } = {}
): string => {
    return formatFhirIdentifier(identifiers, options);
};

const getIdentifierDisplayName = (identifier: Identifier): string => {
    if (identifier.type?.text) {
        return identifier.type.text;
    }

    if (identifier.type?.coding?.[0]?.display) {
        return identifier.type.coding[0].display;
    }

    if (identifier.type?.coding?.[0]?.code) {
        return identifier.type.coding[0].code;
    }

    if (identifier.use) {
        return identifier.use.charAt(0).toUpperCase() + identifier.use.slice(1);
    }

    return 'Identifier';
};

export const FhirIdentifierDisplay: React.FC<FhirIdentifierDisplayProps> = ({
                                                                                identifier,
                                                                                emptyText = 'No identifiers recorded',
                                                                                className
                                                                            }) => {
    if (!identifier || (Array.isArray(identifier) && identifier.length === 0)) {
        return <span className={className}>{emptyText || '-'}</span>;
    }

    if (Array.isArray(identifier) && identifier.length > 1) {
        return (
            <div className={className}>
                {identifier.map((singleIdentifier, index) => {
                    const displayName = getIdentifierDisplayName(singleIdentifier);
                    const value = singleIdentifier.value || '-';

                    return (
                        <div
                            key={index}
                            style={{
                                marginBottom: index < identifier.length - 1 ? '4px' : '0'
                            }}
                        >
                            <Text>
                                <strong>{displayName}:</strong> {value}
                            </Text>
                        </div>
                    );
                })}
            </div>
        );
    }

    const singleIdentifier = Array.isArray(identifier) ? identifier[0] : identifier;
    const displayName = getIdentifierDisplayName(singleIdentifier);
    const value = singleIdentifier.value || '-';

    return (
        <span className={className}>
            <Text>
                <strong>{displayName}:</strong> {value}
            </Text>
        </span>
    );
};