render() {
        const { error, isLoaded, storeInProgress, storeKey } = this.state;
        if (error) {
            return <div>Error: {error.message}</div>;
        } else if (!isLoaded) {
            return <div>Loading...</div>;
        } else {
            return (
                <div className={`asset-detail ${storeInProgress ? "asset-detail-no-overflow" : ""}`}>
                    <h2>Asset detail</h2>
                    <form onSubmit={(e) => this.handleSubmit(e)}>
                        <div class="form-group">
                            <label for="formGroupKey">Key</label>
                            <input type="text" class="form-control" id="formGroupKey" placeholder="Key" disabled={storeKey ? "disabled" : ""}
                                value={this.state.data.key} onChange={(e) => this.formValueChanged("key", e)} required />
                        </div>
                        <div class="form-group">
                            <label for="formGroupDescription">Description</label>
                            <input type="text" class="form-control" id="formGroupDescription" placeholder="Description"
                                value={this.state.data.desc} onChange={(e) => this.formValueChanged("desc", e)} required />
                        </div>
                        <div class="form-group">
                            <label for="formGroupAmount">Amount</label>
                            <input type="number" step="1" class="form-control" id="formGroupAmount" placeholder="Amount"
                                value={this.state.data.amount} onChange={(e) => this.formValueChanged("amount", e)} min="0" required />
                        </div>
                        <div class="form-group">
                            <label for="formGroupPrice">Price</label>
                            <input type="number" step=".01" class="form-control" id="formGroupPrice" placeholder="Price"
                                value={this.state.data.price} onChange={(e) => this.formValueChanged("price", e)} min="0" required />
                        </div>
                        <div class="detail-buttons">
                            <button type="submit" class="btn btn-primary btn-submit" disabled={storeInProgress ? "disabled" : ""}>
                                Store asset
                                <span className={`btn-submit-spinner ${!storeInProgress ? "hide-element" : ""}`}>
                                    <div class="loader submit-btn-loader">Loading...</div>
                                </span>
                            </button>
                            <button type="button" class="btn btn-secondary" disabled={storeInProgress ? "disabled" : ""}
                                onClick={this.backClicked.bind(this)}>Back to list</button>
                        </div>
                    </form>
                </div>
            );
        }
    }
/**
     * Detail Renderer
     * @returns HTML template of the asset detail view
     */
Detail Renderer
@returns HTML template of the asset detail view
Detail Renderer @returns HTML template of the asset detail view
render() {
        const { error, isLoaded, storeInProgress, storeKey } = this.state;
        if (error) {
            return <div>Error: {error.message}</div>;
        } else if (!isLoaded) {
            return <div>Loading...</div>;
        } else {
            return (
                <div className={`asset-detail ${storeInProgress ? "asset-detail-no-overflow" : ""}`}>
                    <h2>Asset detail</h2>
                    <form onSubmit={(e) => this.handleSubmit(e)}>
                        <div class="form-group">
                            <label for="formGroupKey">Key</label>
                            <input type="text" class="form-control" id="formGroupKey" placeholder="Key" disabled={storeKey ? "disabled" : ""}
                                value={this.state.data.key} onChange={(e) => this.formValueChanged("key", e)} required />
                        </div>
                        <div class="form-group">
                            <label for="formGroupDescription">Description</label>
                            <input type="text" class="form-control" id="formGroupDescription" placeholder="Description"
                                value={this.state.data.desc} onChange={(e) => this.formValueChanged("desc", e)} required />
                        </div>
                        <div class="form-group">
                            <label for="formGroupAmount">Amount</label>
                            <input type="number" step="1" class="form-control" id="formGroupAmount" placeholder="Amount"
                                value={this.state.data.amount} onChange={(e) => this.formValueChanged("amount", e)} min="0" required />
                        </div>
                        <div class="form-group">
                            <label for="formGroupPrice">Price</label>
                            <input type="number" step=".01" class="form-control" id="formGroupPrice" placeholder="Price"
                                value={this.state.data.price} onChange={(e) => this.formValueChanged("price", e)} min="0" required />
                        </div>
                        <div class="detail-buttons">
                            <button type="submit" class="btn btn-primary btn-submit" disabled={storeInProgress ? "disabled" : ""}>
                                Store asset
                                <span className={`btn-submit-spinner ${!storeInProgress ? "hide-element" : ""}`}>
                                    <div class="loader submit-btn-loader">Loading...</div>
                                </span>
                            </button>
                            <button type="button" class="btn btn-secondary" disabled={storeInProgress ? "disabled" : ""}
                                onClick={this.backClicked.bind(this)}>Back to list</button>
                        </div>
                    </form>
                </div>
            );
        }
    }
render ( ) { const { error , isLoaded , storeInProgress , storeKey } = this . state ; if ( error ) { return < div > Error:  { error . message } < / div > ; } else if ( ! isLoaded ) { return < div > Loading... < / div > ; } else { return ( < div className = { ` ${ storeInProgress ? "asset-detail-no-overflow" : "" } ` } > < h2 > Asset detail < / h2 > < form onSubmit = { ( e ) => this . handleSubmit ( e ) } > < div class = "form-group" > < label for = "formGroupKey" > Key < / label > < input type = "text" class = "form-control" id = "formGroupKey" placeholder = "Key" disabled = { storeKey ? "disabled" : "" } value = { this . state . data . key } onChange = { ( e ) => this . formValueChanged ( "key" , e ) } required / > < / div > < div class = "form-group" > < label for = "formGroupDescription" > Description < / label > < input type = "text" class = "form-control" id = "formGroupDescription" placeholder = "Description" value = { this . state . data . desc } onChange = { ( e ) => this . formValueChanged ( "desc" , e ) } required / > < / div > < div class = "form-group" > < label for = "formGroupAmount" > Amount < / label > < input type = "number" step = "1" class = "form-control" id = "formGroupAmount" placeholder = "Amount" value = { this . state . data . amount } onChange = { ( e ) => this . formValueChanged ( "amount" , e ) } min = "0" required / > < / div > < div class = "form-group" > < label for = "formGroupPrice" > Price < / label > < input type = "number" step = ".01" class = "form-control" id = "formGroupPrice" placeholder = "Price" value = { this . state . data . price } onChange = { ( e ) => this . formValueChanged ( "price" , e ) } min = "0" required / > < / div > < div class = "detail-buttons" > < button type = "submit" class = "btn btn-primary btn-submit" disabled = { storeInProgress ? "disabled" : "" } > 
                                Store asset
                                 < span className = { ` ${ ! storeInProgress ? "hide-element" : "" } ` } > < div class = "loader submit-btn-loader" > Loading... < / div > < / span > < / button > < button type = "button" class = "btn btn-secondary" disabled = { storeInProgress ? "disabled" : "" } onClick = { this . backClicked . bind ( this ) } > Back to list < / button > < / div > < / form > < / div > ) ; } }
Detail Renderer
 @returns HTML template of the asset detail view
Detail Renderer @returns HTML template of the asset detail view