import React from 'react';

import {CodeTrunk, ShieldCheck, ShieldKeyhole} from '@gravity-ui/icons';
import type {DropdownMenuItem} from '@gravity-ui/uikit';
import {Button, DropdownMenu, Icon, Link, Text, Tooltip} from '@gravity-ui/uikit';
import block from 'bem-cn-lite';
import {I18n} from 'i18n';
import {CollectionItemEntities} from 'shared';
import {getEntryNameByKey} from 'shared/modules';
import type {SharedEntryBindingsItem} from 'shared/schema';
import navigateHelper from 'ui/libs/navigateHelper';
import {COLLECTIONS_PATH, WORKBOOKS_PATH} from 'ui/units/collections-navigation/constants';

import {CollectionIcon} from '../CollectionIcon/CollectionIcon';
import {EntryIcon} from '../EntryIcon/EntryIcon';
import {WorkbookIcon} from '../WorkbookIcon/WorkbookIcon';

import './EntityRow.scss';

const i18n = I18n.keyset('component.entity-row.view');
const b = block('entity-row');

export type EntryRowProps = {
    className?: string;
    actions?: DropdownMenuItem[];
    entity: SharedEntryBindingsItem;
    onClickRelationButton?: () => void;
    showRightSide?: boolean;
};

const getName = (entity: SharedEntryBindingsItem) => {
    switch (entity.entity) {
        case CollectionItemEntities.WORKBOOK:
            return entity.title;
        case CollectionItemEntities.ENTRY:
            return getEntryNameByKey({key: entity.displayKey});
    }
};

const getHref = (entity: SharedEntryBindingsItem) => {
    switch (entity.entity) {
        case CollectionItemEntities.WORKBOOK:
            return `${WORKBOOKS_PATH}/${entity.workbookId}`;
        case CollectionItemEntities.ENTRY:
            return navigateHelper.redirectUrlSwitcher(entity);
    }
};

export const EntityRow = React.memo(
    ({entity, className, actions, onClickRelationButton, showRightSide = true}: EntryRowProps) => {
        const entryName = getName(entity);
        const renderRelationBtn =
            onClickRelationButton && entity.entity === CollectionItemEntities.WORKBOOK;

        const renderIcon = () => {
            switch (entity.entity) {
                case CollectionItemEntities.WORKBOOK:
                    return <WorkbookIcon className={b('icon')} title={entity.title} size="xs" />;
                case CollectionItemEntities.ENTRY:
                    return <EntryIcon entry={entity} className={b('icon')} />;
            }
        };

        return (
            <div className={b(null, className)}>
                <div className={b('entity')}>
                    <Link
                        view="primary"
                        target="_blank"
                        className={b('text-block')}
                        title={entryName}
                        href={getHref(entity)}
                    >
                        {renderIcon()}
                        <span className={b('name')}>{entryName}</span>
                    </Link>
                    {renderRelationBtn && (
                        <div className={b('workbook-relations')}>
                            <Tooltip
                                className={b('notice')}
                                content={i18n('relation-tooltip-text')}
                            >
                                <Button view="flat" size="s" onClick={onClickRelationButton}>
                                    <Icon data={CodeTrunk} width={16} height={16} />
                                </Button>
                            </Tooltip>
                        </div>
                    )}
                </div>
                {showRightSide && (
                    <div className={b('right-block')}>
                        <div className={b('entity')}>
                            <Link
                                view="primary"
                                target="_blank"
                                className={b('text-block')}
                                title={entryName}
                                href={`${COLLECTIONS_PATH}/${entity.collectionId}`}
                            >
                                <CollectionIcon className={b('icon')} size={18} />
                                <span className={b('name')}>{entity.collectionTitle}</span>
                            </Link>
                        </div>
                        <div className={b('delegation-status')}>
                            <Icon
                                data={entity.isDelegated ? ShieldCheck : ShieldKeyhole}
                                size={16}
                                className={b('delegation-status-icon')}
                            />
                            <Text variant="body-1">
                                {entity.isDelegated ? i18n('delegated') : i18n('not-delegated')}
                            </Text>
                        </div>
                        {actions && <DropdownMenu items={actions} />}
                    </div>
                )}
            </div>
        );
    },
);
