import React from 'react';
import { FaRegEdit } from '@react-icons/all-files/fa/FaRegEdit';
import { FaDatabase } from '@react-icons/all-files/fa/FaDatabase';
import useTranslate from '~hooks/useTranslate/useTranslate';
import styles from './admin-card-button.module.scss';

const index = ({ item, isToplist = false }) => {
  const path = (type, relation, pageId) => {
    switch (type) {
      case 'page':
        return `site-pages/${pageId}`;
      case 'operator':
        return `operators/${relation.operator_id}/sites-data?site=${process.env.GATSBY_SITE_NAME}`;
      case 'game':
        return `games/${relation.id}/sites?site_name=${process.env.GATSBY_SITE_NAME}`;
      case 'author':
        return `site-authors/${relation.id || relation?.relation_id}`;
      case 'payment_method':
        return `deposit-methods/${relation?.id}`;
      default:
        return '';
    }
  };

  return (
    <div className={styles.container}>
      {!isToplist && (
        <a
          className={styles.button}
          target="_blank"
          href={`${process.env.HERCULES_BACKEND_URL}${path('page', null, item.id)}`}
          rel="noreferrer"
          type="button"
          aria-label={useTranslate('ariaLabel-editPage', 'Edit Page')}
        >
          <FaRegEdit />
        </a>
      )}
      <a
        className={styles.button}
        target="_blank"
        href={`${process.env.HERCULES_BACKEND_URL}${path(
          isToplist ? 'operator' : item.type,
          isToplist ? item : { ...item.relation, relation_id: item.relation_id }
        )}`}
        rel="noreferrer"
        type="button"
        aria-label={useTranslate('ariaLabel-editRelationData', 'Edit Relation Data')}
      >
        <FaDatabase />
      </a>
    </div>
  );
};

export default index;
