scraper-react/src/components/ScrapeRequest/ScrapeRequest.js

import React from 'react';
import { useTranslation } from 'react-i18next';
import PropTypes from 'prop-types';
import ScrappeStatus from '../ScrappeStatus/ScrappeStatus';

const ScrapeRequest = ({ scrape, index }) => {
    const { t } = useTranslation();

    console.log("In req", scrape)

    function handleSubmit(event) {
        event.preventDefault();
    }
    return (
        <tr>
            <td>
                <p>
                </p><h3>#{index} {scrape.location}</h3>
                <span className="text-muted">Count {scrape.count} +</span>
                <span> | </span>
                <span className="text-muted">{t('scrapeRequest.EstimatedTime')} {(new Date(scrape.estimate)).toLocaleString()}</span>
                <span> | </span>
                {t('scrapeRequest.ViewScrape')} <a href="scrappe.html"> {scrape.sourceUrl}</a>
                <p></p>
                <p>
                </p>
            </td>
            <td>
                {scrape.filters.map(element => (
                    <span key={element.value} className="badge bg-primary m-1">{element.name}</span>
                ))}
            </td>
            <td>
                <ScrappeStatus status={scrape.status} handleSubmit={handleSubmit} />
            </td>
        </tr>
    );
}

ScrapeRequest.propTypes = {
    scrape: PropTypes.object,
    index: PropTypes.number
};

export default ScrapeRequest;