src/components/app/sidebars/simulation/TaskComponent.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

import approx from "approximate-number";
import React from "react";
import {convertSecondsToFormattedTime} from "../../../../util/date-time";

const TaskComponent = ({task, flopsLeft}) => {
    let stateInfo;

    if (flopsLeft === task.totalFlopCount) {
        stateInfo = (
            <div>
                <span className="fa fa-hourglass-half mr-2"/>
                Waiting
            </div>
        );
    } else if (flopsLeft > 0) {
        stateInfo = (
            <div>
                <span className="fa fa-refresh mr-2"/>
                Running ({approx(task.totalFlopCount - flopsLeft)} / {approx(task.totalFlopCount)} FLOPS)
            </div>
        );
    } else {
        stateInfo = (
            <div>
                <span className="fa fa-check mr-2"/>
                Completed
            </div>
        );
    }

    return (
        <li className="list-group-item flex-column align-items-start">
            <div className="d-flex w-100 justify-content-between">
                <h5 className="mb-1">{approx(task.totalFlopCount)} FLOPS</h5>
                <small>Starts at {convertSecondsToFormattedTime(task.startTick)}</small>
            </div>
            {stateInfo}
        </li>
    );
};

export default TaskComponent;