</div> <div className="row"> {this.state.details && this.state.details.albums && this.state.details.albums.items.map(item => { return ( <div className="col-xs-12 col-sm-6 col-md-3 my-3"> this.state.details && this.state.details.albums && <div className="row"> <button className="previous" onClick={() => this.handleIndex(-1)} disabled={this.state.details.albums.total <= 12}> <i className="fa fa-arrow-left"></i> <span>{'\u00A0'}previous</span> <h6 className="total" >{this.state.reminder} {'\u00A0'}of {this.state.details.albums.total}</h6> </div> <button className="next" onClick={() => this.handleIndex(1)} disabled={this.state.reminder === this.state.details.albums.total}> <span>next{'\u00A0'}</span> <i className="fa fa-arrow-right"></i>