import { Datetime, Number } from '@Format';
import Lang from 'lang.js';
import MinMaxView from './MinMax';
import React from 'react';
import trans from '../../../translations';

const lang = new Lang({ messages: trans });
lang.setLocale(document.documentElement.lang || 'de');

type ResultInformationProps = {
  lastTime: Date;
  date: string;
  isPassive: boolean;
  isStopped: boolean;
  maximumFractionDigits: number;
  nextTaskTime: string;
  value: number;
  minimum: number;
  maximum: number;
};
const ResultInformation: React.FC<ResultInformationProps> = ({
  date,
  isPassive,
  isStopped,
  maximumFractionDigits,
  nextTaskTime,
  value,
  minimum,
  maximum
}) => {
  return (
    <>
      {isPassive ? (
        <div className='alert alert-success' role='alert'>
          {lang.get('stats.alwaysRunning')}
        </div>
      ) : isStopped ? (
        <div className='alert alert-danger' role='alert'>
          {lang.get('stats.stopped')}
        </div>
      ) : (
        <div>
          <div className='alert alert-success' role='alert'>
            {lang.get('stats.nextMeasurementTime')}
            <div>{nextTaskTime}</div>
          </div>
        </div>
      )}
      {value && (
        <>
          <div className='font-weight-bold'>{lang.get('stats.lastData')}:</div>
          <Number digits={maximumFractionDigits} value={value} />
        </>
      )}
      {date && (
        <>
          <div className='font-weight-bold'>{lang.get('stats.lastTime')}:</div>
          <Datetime datetime={new Date()} />
        </>
      )}
      <MinMaxView min={minimum} max={maximum} digits={maximumFractionDigits} />
    </>
  );
};

export default ResultInformation;
