import React from 'react';
import { screen } from '@testing-library/react';
import { renderInAppContext } from '@theorchard/suite-testing';
import { BrandIcon } from '@theorchard/suite-icons';
import { Link, LinkProps } from 'src/components/shared/link';

describe('<Link/>', () => {
    const testId = 'link-1234';
    const props: LinkProps = {
        icon: <BrandIcon brand="orchard" />,
        isExternal: true,
        label: 'OA',
        url: 'https://example.com/oa',
    };

    const render = (componentProps: LinkProps) =>
        renderInAppContext(<Link data-testid={testId} {...componentProps} />);

    it('renders without crashing', () => {
        render(props);
        const link = screen.getByTestId(testId);
        expect(link).toBeInTheDocument();
    });

    it('renders an external link with the correct attributes', () => {
        render(props);
        const link = screen.getByTestId(testId);
        expect(link).toHaveAttribute('href', props.url);
        expect(link).toHaveAttribute('target', '_blank'); // External links should open in a new tab
        expect(link).toHaveAttribute('rel', 'noopener noreferrer'); // Security best practice
    });
});