render()

in source/console/src/Components/Dashboard/Dashboard.js [48:112]


    render() {
        const { Items } = this.state;

        const welcome = (
            <div className="welcome">
                <h2>To get started select Create test from the top menu.</h2>
            </div>
        )

        const tableBody = (
            <tbody>
            {
                Items.map(item => (
                    <tr key={item.testId}>
                        <td>{item.testName}</td>
                        <td>{item.testId}</td>
                        <td className="desc">{item.testDescription}</td>
                        <td>{item.startTime}</td>
                        <td className={item.status}>{item.status}</td>
                        <td>{item.nextRun}</td>
                        <td className="recurrence">{item.scheduleRecurrence}</td>
                        <td className="td-center">
                            <Link id={`detailLink-${item.testId}`} to= {{ pathname: `/details/${item.testId}`, state: { testId: item.testId } }}>
                                <FontAwesomeIcon icon={faArrowAltCircleRight} size="lg" />
                            </Link>
                        </td>
                    </tr>
                ))
            }
            </tbody>
        )

        return (
            <div>
                <div className="box">
                    <h1>Test Scenarios</h1>
                    <Button id="refreshButton" onClick={ this.getItems } size="sm">Refresh</Button>
                </div>
                <div className="box">
                    <Table className="dashboard" borderless responsive >
                        <thead>
                            <tr>
                                <th>Name</th>
                                <th>Id</th>
                                <th>Description</th>
                                <th>Last Run (UTC)</th>
                                <th>Status</th>
                                <th>Next Run (UTC)</th>
                                <th>Recurrence</th>
                                <th className="td-center">Details</th>
                            </tr>
                        </thead>
                        { tableBody }
                    </Table>
                    {
                        this.state.isLoading &&
                        <div className="loading">
                            <Spinner color="secondary" />
                        </div>
                    }
                </div>
                { !this.state.isLoading && Items.length === 0 && welcome }
            </div>
        )
    }