/**
 * React Component for displaying the total production and production rate
 * of scripts on the 'Active Scripts' UI page
 */
import * as React from "react";

import { WorkerScript } from "../../Netscript/WorkerScript";
import { IPlayer } from "../../PersonObjects/IPlayer";
import { Money } from "../React/Money";

type IProps = {
  p: IPlayer;
  workerScripts: Map<number, WorkerScript>;
};

export function ScriptProduction(props: IProps): React.ReactElement {
  const prodRateSinceLastAug = props.p.scriptProdSinceLastAug / (props.p.playtimeSinceLastAug / 1000);

  let onlineProduction = 0;
  for (const ws of props.workerScripts.values()) {
    onlineProduction += ws.scriptRef.onlineMoneyMade / ws.scriptRef.onlineRunningTime;
  }

  return (
    <p id="active-scripts-total-prod">
      Total online production of Active scripts:&nbsp;
      <span className="money-gold">
        <span id="active-scripts-total-production-active">
          <Money money={onlineProduction} />
        </span>{" "}
        / sec
      </span>
      <br />
      Total online production since last Aug installation:&nbsp;
      <span id="active-scripts-total-prod-aug-total" className="money-gold">
        <Money money={props.p.scriptProdSinceLastAug} />
      </span>
      &nbsp;(
      <span className="money-gold">
        <span id="active-scripts-total-prod-aug-avg" className="money-gold">
          <Money money={prodRateSinceLastAug} />
        </span>{" "}
        / sec
      </span>
      )
    </p>
  );
}
