import React from 'react';
import { Nav } from '@orchard/frontend-react-components';
import cx from 'classnames';
import { formatMessage } from 'src/utils';

export interface LinkProps {
    className: string;
    term: string;
    urlMatch?: string | string[];
    activeClassName?: string;
    url: string;
}

const LegacyLink: React.FC<LinkProps> = ({
    className,
    activeClassName,
    term,
    url,
    urlMatch,
}) => {
    const matchingUrl = urlMatch || url;
    const urlMatchReplaceArr =
        typeof matchingUrl === 'string' ? [matchingUrl] : matchingUrl ?? [];

    const isActive = urlMatchReplaceArr.some(urlM =>
        window.location.pathname.match(urlM)
    );
    const computedClassName = cx(className, {
        [activeClassName ?? '']: isActive,
    });

    return (
        <Nav.Link className={computedClassName} href={url}>
            {formatMessage(term)}
        </Nav.Link>
    );
};

export default LegacyLink;