import React from 'react';
import BasementCss from './basement.module.css';
import { router } from '../router';

export type Props = {
  contactUrl: string;
  iconUrl: string;
  characterUrl: string;
};

export const Basement = (props: Props): JSX.Element => {
  console.debug('routes:', router.routes); // DEBUG

  return (
    <div className={BasementCss.basement}>
      <div className={BasementCss.basementGrid}>
        <div className={BasementCss.bottomContacts}>
          <a href="/">
            <img
              src={props.iconUrl}
              alt="event_emitter_eltex_loc"
              className={BasementCss.eventEmitterEltexLoc}
            />
            <span>redmine-issue-event-emitter</span>
          </a>
          <p>
            <a href={props.contactUrl}>
              {' '}
              Проект
              <span className={BasementCss.textBoxTextOrange}>
                {' '}
                Павел Гнедов
              </span>
            </a>
          </p>
        </div>

        <div className={BasementCss.discuss}>
          <div className={BasementCss.discussButton}>
            <a href="https://t.me/pavelgnedov">
              <p className={BasementCss.discussText}> ОБСУДИТЬ </p>
            </a>
          </div>
          <img
            src={props.characterUrl}
            width="100"
            alt="Сharacter"
            className={BasementCss.character02}
          />
        </div>
      </div>
    </div>
  );
};

export default Basement;
