import React from 'react';
import { DataRow } from 'app/shared/modules/tables/dataTable/dataTable';
import { PoolPointsSummaryDataCell } from './poolPointsSummaryTextCell';

interface Props {
  data: {
    label: string;
    firstValue: string;
  },
  operator?: boolean;
  extraClass?: string;
}

export const PoolPointsSummaryRow = ({ data, operator, extraClass }: Props) => {
  const cellFontStyle = 'c-pool-points-summary__text c-pool-points-summary__text--row';

  return (
    <DataRow extraClass={extraClass}>
      <PoolPointsSummaryDataCell value={data.label} defaultColumnWidth={85} extraClass={cellFontStyle} />
      <PoolPointsSummaryDataCell align='right' defaultColumnWidth={4} operator={operator} extraClass={cellFontStyle}/>
      <PoolPointsSummaryDataCell value={data.firstValue} align='right' defaultColumnWidth={4} extraClass={cellFontStyle} />
    </DataRow>
  );
};