 
       @initializeFirstPageArray()
 
-    API.type("groups").get(@props.params.group_id).then (group) =>
+    API.type('groups').get(@props.params.group_id).then (group) =>
       @setState
         group: group
 
-    API.type("subject_sets").get(group_id: @props.params.group_id).then (sets) =>
+    API.type('subject_sets').get(group_id: @props.params.group_id).then (sets) =>
       @setState
         subject_sets: sets
 

                </div>
              </div>
            </div>

            <div className="collection-mark-transcribe-container">
              <a href="/#/Mark">
                <div className="collection-button mark-button">MARK</div>
              </a>
              <a href="/#/Transcribe">
                <div className="collection-button transcribe-button">TRANSCRIBE</div>
              </a>
            </div>

            <div className="collection-progressbar-container">
              <div className="collection-progressbar"
                   aria-valuenow={parseInt((@state.group.stats?.completeness ? 0) * 100)}
                   aria-valuemin="0" aria-valuemax="100"
                   style={{width: parseInt((@state.group.stats?.completeness ? 0) * 100) + "%"}}></div>
            </div>

            <div className="collection-browse-controls-content">
              <div className="collection-progress-details">
                <div className="collection-progress-overall">
                  <div className="collection-progress-overall-label">Completed Playbills:</div>
                  <div className="collection-progress-overall-value">{@state.group_stats.total_completed}</div>
                </div>

                <div className="collection-progress-box-container">
                  <div className="collection-progress-box">
                    <div className="collection-progress-top">{@state.group_stats.total_marks}</div>
                    <div className="collection-progress-bottom">Marked Fields</div>
                  </div>

                  <div className="collection-progress-box collection-progress-box-right">
                    <div className="collection-completed-top">{@state.group_stats.total_transcriptions}</div>
                    <div className="collection-completed-bottom">Transcribed Fields</div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>


  render: ->
    if ! @state.group?
      <div className='group-page'>
        <h2>Loading...</h2>
      </div>
    else
      <div className='collection-page-content'>
        <div className='collection-title-container'>
          <div className='collection-title'>{@state.group_name}</div>
        </div>

        <div className='collection-container'>
          <div className='collection-thumbnails'>{ @state.first_page_array }</div>
          <div className='collection-browse-controls-container'>
            <div className='collection-browse-controls-content'>
              <div className='collection-description'>{@state.group_description}</div>

              <div className='collection-performance-dates-container'>
                <div className='collection-performance-dates-label'>Performance Dates</div>

                <div className='min-max-dates-container'>
                  <div className='min-date min-max-date'>{@state.min_year}</div>
                  <div className='max-date min-max-date'>{@state.max_year}</div>
                </div>

                <div className='collection-range-slider'>
                  <ReactSlider
                    onAfterChange={@updateYearSliderState}
                    ref='ReactYearSlider'
                    min={@state.min_year}
                    max={@state.max_year}
                    value={[@state.start_year, @state.end_year]} withBars />
                </div>

                <div className='custom-select collection-institution'>
                  <SelectDropdown options_array={@state.all_institutions}
                                  placeholder={@state.placeholder_institution}
                                  value={@state.selected_institution}
                                  onSelect={@updateSelectedInstitution} />
                </div>

                <div className='custom-select collection-playwright'>
                  <SelectDropdown options_array={@state.all_playwrights}
                                  placeholder={@state.placeholder_playwright}
                                  value={@state.selected_playwright}
