import { useMemo } from 'react';
import { CURRENCIES } from 'src/constants';
import { getBrandIcon } from 'src/utils/general';
import type { accountOptionsQuery } from 'src/pages/definitions/accountModal';

const currencyOptions = CURRENCIES.map(({ code, symbol }) => ({
    label: `${code} ${symbol}`,
    value: code,
}));

export const useSelectOptions = (data?: accountOptionsQuery) => {
    const brandOptions = useMemo(() => {
        return (
            data?.companyBrands.map(({ displayName, name }) => ({
                label: displayName,
                value: name,
                icon: getBrandIcon(name),
            })) || []
        );
    }, [data?.companyBrands]);

    const ownersOptions = useMemo(() => {
        return (
            data?.owners?.map(({ abbreviation }) => ({
                label: abbreviation,
                value: abbreviation,
            })) || []
        );
    }, [data?.owners]);

    const tierOptions = useMemo(() => {
        return (
            data?.serviceTiers.map(({ displayName, uuid }) => ({
                label: displayName,
                value: uuid,
            })) || []
        );
    }, [data?.serviceTiers]);

    return {
        currencyOptions,
        tierOptions,
        ownersOptions,
        brandOptions,
    };
};