Composing our ReactPaginate component and organizing its parts in a logistical way

Pagination-reactpaginate-component

<ReactPaginate id="react-paginate"
      // labels
      
      previousLabel={'Previous'}
      nextLabel={'Next'}
      breakLabel={'…'}
      
      // classNames
      containerClassName={'react-paginate'}
      previousClassName={'previous'}
      breakClassName={'break-me'}
      nextClassName={'next'}
      pageClassName={'page'}
      activeClassName={'active'}
      pageLinkClassName={'page-link'}
      disabledClassName={'disabled'}
      
      // functionality
      pageCount={this.state.drinkAndPageInfo.page_count} //total pages
      marginPagesDisplayed={2}
      pageRangeDisplayed={5}
      forcePage={5}
      onPageChange={(event) => {this.handlePageClick(event)} /*Fxn when page clicked*/}
      disableInitialCallback={true}
/>