/* eslint-disable react/jsx-no-target-blank */
/* eslint-disable jsx-a11y/anchor-has-content */
/* eslint-disable jsx-a11y/control-has-associated-label */
// @ts-nocheck
import { __assign } from "tslib";
import './EventCard.css';
import React from 'react';
import { NavLink } from 'react-router-dom';
import { IconPlay } from '../../icons/IconPlay/IconPlay';
import { cn } from '../../utils/bem';
import { getSizeByMap } from '../../utils/getSizeByMap';
import { forwardRefWithAs } from '../../utils/types/PropsWithAsAttributes';
import { Button } from '../Button/Button';
import { usePropsHandler } from '../EventInterceptor/usePropsHandler';
import { Picture } from '../Picture/Picture';
import { Tag } from '../Tag/Tag';
import { TagGroup } from '../TagGroup/TagGroup';
import { Typography } from '../Typography/Typography';
import { User } from '../User/User';
export var cnEventCard = cn('EventCard');
var sizeMapTitle = {
    m: 'sm',
    l: 'lg'
};
export var EventCard = forwardRefWithAs(function (props, ref) {
    var _a = usePropsHandler(cnEventCard(), props), routePath = _a.routePath, view = _a.view, picture = _a.picture, date = _a.date, tags = _a.tags, isOnline = _a.isOnline, languages = _a.languages, title = _a.title, _b = _a.size, size = _b === void 0 ? 'm' : _b, invertedStyle = _a.invertedStyle, locations = _a.locations, speakers = _a.speakers, slug = _a.slug, registrationStatus = _a.registrationStatus, redirectTo = _a.redirectTo, eventType = _a.eventType, fullUrl = _a.fullUrl, eventTypeText = _a.eventTypeText, location = _a.location, eventWithoutPage = _a.eventWithoutPage, _c = _a.onlineTitle, onlineTitle = _c === void 0 ? 'Онлайн' : _c, _d = _a.offlineTitle, offlineTitle = _d === void 0 ? 'Оффлайн' : _d, video = _a.video;
    var redirectToPage = redirectTo;
    if (Number(process.env.REACT_APP_EVENT_TYPE) !== Number(eventType) &&
        !redirectToPage &&
        fullUrl) {
        redirectToPage = fullUrl;
    }
    return (React.createElement("div", { className: cnEventCard({
            view: view,
            size: size,
            invertedStyle: invertedStyle,
            noHover: eventWithoutPage
        }) },
        !eventWithoutPage && (React.createElement(React.Fragment, null,
            redirectToPage && (React.createElement("a", { className: cnEventCard('Link'), href: redirectToPage, target: "_blank", rel: "noreferrer" })),
            !redirectToPage && routePath && React.createElement(NavLink, { className: cnEventCard('Link'), to: routePath }))),
        picture && (React.createElement("div", { className: cnEventCard('Picture') },
            React.createElement(Picture, __assign({}, picture)))),
        React.createElement("div", { className: cnEventCard('Inner') },
            React.createElement("div", { className: cnEventCard('Date') },
                React.createElement(Typography.Text, { size: "xs", weight: "bold", transform: "uppercase" }, date),
                locations && (React.createElement(Typography.Text, { size: "xs", weight: "bold", transform: "uppercase" },
                    "|",
                    ' ',
                    isOnline
                        ? onlineTitle
                        : locations.map(function (location) { return "".concat(location.country, ", ").concat(location.location); }))),
                location && (React.createElement(Typography.Text, { size: "xs", weight: "bold", transform: "uppercase" },
                    "| ",
                    isOnline ? onlineTitle : "".concat(location.country, ", ").concat(location.location)))),
            React.createElement("div", { className: cnEventCard('Title') },
                React.createElement(Typography.Title, { size: getSizeByMap(sizeMapTitle, size), weight: "bold" }, title)),
            eventTypeText && (React.createElement("div", { className: cnEventCard('SubTitle') },
                React.createElement(Typography.Text, { size: "s" }, eventTypeText))),
            React.createElement("div", { className: cnEventCard('Tags') }, tags && React.createElement(TagGroup, { items: tags })),
            React.createElement("div", { className: cnEventCard('Speakers') },
                video && (React.createElement("div", { className: cnEventCard('VideoCircle'), style: { zIndex: (speakers === null || speakers === void 0 ? void 0 : speakers.length) > 0 ? speakers.length + 1 : 1 } },
                    React.createElement(Button, { view: "primary", form: "circle", iconRight: IconPlay, size: "4xl", iconSize: "s", onlyIcon: true }))),
                speakers &&
                    speakers.map(function (speaker, index) {
                        var _a;
                        return (React.createElement(React.Fragment, { key: index + slug + title }, speaker.photo && (React.createElement(User, { size: "m", avatarUrl: (_a = speaker.photo) === null || _a === void 0 ? void 0 : _a.url, style: { zIndex: speakers.length - index } }))));
                    })),
            languages && (React.createElement("div", { className: cnEventCard('Bottom') },
                React.createElement(TagGroup, { items: languages, mode: "label", gap: "xs" }))),
            registrationStatus && (React.createElement("div", { className: cnEventCard('Bottom') },
                React.createElement(Tag, { mode: "label", label: registrationStatus.title, colorBorder: registrationStatus.color, gap: "xs" }))))));
});
