<commit_before>import React from 'react';
import { Row, Col, Breadcrumb, BreadcrumbItem } from 'reactstrap';
import { Link } from 'react-router-dom';
import ReactTable from 'react-table';
import PropTypes from 'prop-types';
import { Helmet } from 'react-helmet';

import {
  bugDetailsEndpoint,
  getJobsUrl,
  getLogViewerUrl,
} from '../helpers/url';
import SimpleTooltip from '../shared/SimpleTooltip';

import {
  calculateMetrics,
  prettyDate,
  tableRowStyling,
  removePath,
} from './helpers';
import Layout from './Layout';
import withView from './View';
import DateOptions from './DateOptions';

const BugDetailsView = props => {
  const {
    graphData,
    tableData,
    initialParamsSet,
    startday,
    endday,
    updateState,
    bug,
    summary,
    errorMessages,
    lastLocation,
    tableFailureStatus,
    graphFailureStatus,
  } = props;

  const columns = [
    {
      Header: 'Push Time',
      accessor: 'push_time',
    },
    {
      Header: 'Tree',
      accessor: 'tree',
    },
    {
      Header: 'Revision',
      accessor: 'revision',
      Cell: _props => (
        <a
          href={getJobsUrl({
            repo: _props.original.tree,
            revision: _props.value,
            selectedJob: _props.original.job_id,
          })}
          target="_blank"
          rel="noopener noreferrer"
        >
          {_props.value}
        </a>
      ),
    },
    {
      Header: 'Platform',
      accessor: 'platform',
    },
    {
      Header: 'Build Type',
      accessor: 'build_type',
    },
    {
      Header: 'Test Suite',
      accessor: 'test_suite',
      minWidth: 150,
    },
    {
      Header: 'Machine Name',
      accessor: 'machine_name',
      minWidth: 125,
    },
    {
      Header: 'Log',
      accessor: 'job_id',
      Cell: _props => {
        const { value, original } = _props;
        return (
          <SimpleTooltip
            text={
              <React.Fragment>
                {`${original.lines.length} unexpected-fail${
                  original.lines.length > 1 ? 's' : ''
                }`}
                <br />
                <a
                  className="small-text"
                  href={getLogViewerUrl(value, original.tree)}
                  target="_blank"
                  rel="noopener noreferrer"
                >
                  view details
                </a>
              </React.Fragment>
            }
            placement="left"
            tooltipText={
              original.lines.length && (
                <ul>
                  {original.lines.map((line, index) => (
                    <li
                      key={index} // eslint-disable-line react/no-array-index-key
                      className="failure_li text-truncate"
                    >
                      {removePath(line)}
                    </li>
                  ))}
                </ul>
              )
            }
          />
        );
      },
      minWidth: 110,
    },
  ];

  let graphOneData = null;
  let graphTwoData = null;

  if (graphData.length > 0) {
    ({ graphOneData, graphTwoData } = calculateMetrics(graphData));
  }

  return (
    <Layout
      {...props}
      graphOneData={graphOneData}
      graphTwoData={graphTwoData}
      header={
        <React.Fragment>
          <Row>
            <Helmet>
              <title>{`Bug ${bug} - ${summary}`}</title>
            </Helmet>
            <Col xs="12" className="text-left">
              <Breadcrumb listClassName="bg-white">
                <BreadcrumbItem>
                  <a title="Treeherder home page" href="/#/">
                    Treeherder
                  </a>
                </BreadcrumbItem>
                <BreadcrumbItem>
                  <Link
                    title="Intermittent Failures View main page"
                    to={lastLocation || '/'}
                  >
                    Main view
                  </Link>
                </BreadcrumbItem>
                <BreadcrumbItem active title="Bugdetails view">
                  Bugdetails view
                </BreadcrumbItem>
              </Breadcrumb>
            </Col>
          </Row>
          {!errorMessages.length && !tableFailureStatus && !graphFailureStatus && (
            <React.Fragment>
              <Row>
                <Col xs="12" className="mx-auto">
                  <h1>Details for Bug {!bug ? '' : bug}</h1><commit_msg>Bug 1596515 - IFV bug details title fix (#5640)<commit_after>import React from 'react';
import { Row, Col, Breadcrumb, BreadcrumbItem } from 'reactstrap';
import { Link } from 'react-router-dom';
import ReactTable from 'react-table';
import PropTypes from 'prop-types';
import { Helmet } from 'react-helmet';

import {
  bugDetailsEndpoint,
  getJobsUrl,
  getLogViewerUrl,
} from '../helpers/url';
import SimpleTooltip from '../shared/SimpleTooltip';

import {
  calculateMetrics,
  prettyDate,
  tableRowStyling,
  removePath,
} from './helpers';
import Layout from './Layout';
import withView from './View';
import DateOptions from './DateOptions';

const BugDetailsView = props => {
  const {
    graphData,
    tableData,
    initialParamsSet,
    startday,
    endday,
    updateState,
    bug,
    summary,
    errorMessages,
    lastLocation,
    tableFailureStatus,
    graphFailureStatus,
  } = props;

  const columns = [
    {
      Header: 'Push Time',
      accessor: 'push_time',
    },
    {
      Header: 'Tree',
      accessor: 'tree',
    },
    {
      Header: 'Revision',
      accessor: 'revision',
      Cell: _props => (
        <a
          href={getJobsUrl({
            repo: _props.original.tree,
            revision: _props.value,
            selectedJob: _props.original.job_id,
          })}
          target="_blank"
          rel="noopener noreferrer"
        >
          {_props.value}
        </a>
      ),
    },
    {
      Header: 'Platform',
      accessor: 'platform',
    },
    {
      Header: 'Build Type',
      accessor: 'build_type',
    },
    {
      Header: 'Test Suite',
      accessor: 'test_suite',
      minWidth: 150,
    },
    {
      Header: 'Machine Name',
      accessor: 'machine_name',
      minWidth: 125,
    },
    {
      Header: 'Log',
      accessor: 'job_id',
      Cell: _props => {
        const { value, original } = _props;
        return (
          <SimpleTooltip
            text={
              <React.Fragment>
                {`${original.lines.length} unexpected-fail${
                  original.lines.length > 1 ? 's' : ''
                }`}
                <br />
                <a
                  className="small-text"
                  href={getLogViewerUrl(value, original.tree)}
                  target="_blank"
                  rel="noopener noreferrer"
                >
                  view details
                </a>
              </React.Fragment>
            }
            placement="left"
            tooltipText={
              original.lines.length && (
                <ul>
                  {original.lines.map((line, index) => (
                    <li
                      key={index} // eslint-disable-line react/no-array-index-key
                      className="failure_li text-truncate"
                    >
                      {removePath(line)}
                    </li>
                  ))}
                </ul>
              )
            }
          />
        );
      },
      minWidth: 110,
    },
  ];

  let graphOneData = null;
  let graphTwoData = null;

  if (graphData.length > 0) {
    ({ graphOneData, graphTwoData } = calculateMetrics(graphData));
  }

  return (
    <Layout
      {...props}
      graphOneData={graphOneData}
      graphTwoData={graphTwoData}
      header={
        <React.Fragment>
          <Row>
            <Helmet>
              <title>{`Bug ${bug}${summary ? ` - ${summary}` : ''}`}</title>
            </Helmet>
            <Col xs="12" className="text-left">
              <Breadcrumb listClassName="bg-white">
                <BreadcrumbItem>
                  <a title="Treeherder home page" href="/#/">
                    Treeherder
                  </a>
                </BreadcrumbItem>
                <BreadcrumbItem>
                  <Link
                    title="Intermittent Failures View main page"
                    to={lastLocation || '/'}
                  >
                    Main view
                  </Link>
                </BreadcrumbItem>
                <BreadcrumbItem active title="Bugdetails view">
                  Bugdetails view
                </BreadcrumbItem>
              </Breadcrumb>
            </Col>
          </Row>
          {!errorMessages.length && !tableFailureStatus && !graphFailureStatus && (
            <React.Fragment>
              <Row>
                <Col xs="12" className="mx-auto">
                  <h1>Details for Bug {!bug ? '' : bug}</h1>
{'fraction_non_alphanumeric': 0.12151528776978417, 'fraction_numerical': 0.005058453237410072, 'mean_word_length': 1.3637088204038257, 'pattern_counts': {'":': 0, '<': 81, '<?xml version=': 0, '>': 91, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3510234', 'n_tokens_mistral': 2580, 'n_tokens_neox': 2458, 'n_words': 503}