import React from 'react';
import { Age } from 'fhir/r4';

interface FhirAgeDisplayProps {
    age: Age | undefined | null;
    className?: string;
    emptyText?: string;
}

export const formatFhirAge = (age: Age | undefined | null): string => {
    if (!age) {
        return '';
    }

    const value = age.value ?? '';
    const unit = age.unit ?? age.code ?? '';

    if (!value && !unit) {
        return '';
    }

    return `${value}${unit ? ` ${unit}` : ''}`;
};

export const FhirAgeDisplay: React.FC<FhirAgeDisplayProps> = ({
                                                                  age,
                                                                  className,
                                                                  emptyText = ''
                                                              }) => {
    const formattedAge = formatFhirAge(age);

    return (
        <span className={className}>{formattedAge || emptyText || '-'}</span>
    );
};