Tabs in survey results

apps/src/code-studio/pd/workshop_dashboard/reports/local_summer_workshop_daily_survey/results.jsx

@@ -1,4 +1,5 @@
 import React, {PropTypes} from 'react';
+import {Tab, Tabs} from 'react-bootstrap';
 
 export default class Results extends React.Component {
   static propTypes = {
@@ -70,30 +71,20 @@ export default class Results extends React.Component {
     );
   }
 
-  renderSessionResults(session) {
-    return (
-      <div>
-        Session results for {session}
-        {this.renderSessionResultsTable(session)}
-        {this.renderSessionResultsFreeResponse(session)}
-        <hr/>
-      </div>
-    );
-  }
-
   renderAllSessionsResults() {
     return this.props.sessions.map((session, i) => (
-      <div key={i}>
-        {this.renderSessionResults(session)}
-      </div>
+      <Tab eventKey={i + 1} key={i} title={session}>
+        {this.renderSessionResultsTable(session)}
+        {this.renderSessionResultsFreeResponse(session)}
+      </Tab>
     ));
   }
 
   render() {
     return (
-      <div>
+      <Tabs id="SurveyTab">
         {this.renderAllSessionsResults()}
-      </div>
+      </Tabs>
     );
   }
 }

dashboard/app/helpers/pd/workshop_survey_results_helper.rb

@@ -178,8 +178,8 @@ def generate_workshop_daily_session_summary(workshop, related_workshops)
   def generate_workshops_survey_summary(workshops, include_free_response: false)
     surveys = get_surveys_for_workshops(workshops)
 
-    surveys[:pre_workshop] = get_pre_workshop_surveys(workshops)
-    surveys[:post_workshop] = get_post_workshop_surveys(workshops)
+    surveys['Pre Workshop'] = get_pre_workshop_surveys(workshops)
+    surveys['Post Workshop'] = get_post_workshop_surveys(workshops)
 
     workshop_summary = {}
 
@@ -219,34 +219,34 @@ def get_pre_workshop_surveys(workshops)
 
   def get_surveys_for_workshops(workshops)
     {
-      day_1: (rand(10..20) * workshops.size).times.map do |_|
+      'Day 1' => (rand(10..20) * workshops.size).times.map do |_|
         {
           how_was_intro: rand(3..5),
           bakers_speech_feedback: %w(Cool Awesome Funny Weird).sample
         }
       end,
-      day_2: (rand(10..20) * workshops.size).times.map do |_|
+      'Day 2' => (rand(10..20) * workshops.size).times.map do |_|
         {
           how_was_day_2_activity: rand(3..5),
           how_was_day_2_food: rand(2..5),
           cats_or_dogs: %w(Cats Cats! Dogs Puppies! Lizards).sample
         }
       end,
-      day_3: (rand(10..20) * workshops.size).times.map do |_|
+      'Day 3' => (rand(10..20) * workshops.size).times.map do |_|
         {
           how_was_day_3_activity: rand(3..5),
           how_were_animals: rand(4..5),
           favorite_sport: %w(Football Baseball Basketball Soccer Hockey Judo).sample
         }
       end,
-      day_4: (rand(10..20) * workshops.size).times.map do |_|
+      'Day 4' => (rand(10..20) * workshops.size).times.map do |_|
         {
           how_was_day_4_activity: rand(3..5),
           how_was_meeting_lebron: rand(1..5),
           favorite_tv_show: %w(Westworld Brooklyn\ 99 West\ Wing The\ Wire Breaking\ Bad).sample
         }
       end,
-      day_5: (rand(10..20) * workshops.size).times.map do |_|
+      'Day 5' => (rand(10..20) * workshops.size).times.map do |_|
         {
           how_was_day_5_activity: rand(4..5),
           how_was_meeting_andy_sandberg: rand(4..5),
@@ -270,36 +270,36 @@ def get_post_workshop_surveys(workshops)
 
   def get_questions_for_forms
     {
-      pre_workshop: {
+      'Pre Workshop' => {
         how_excited: {text: 'How excited are you?'},
         lunch_aspirations: {text: 'What do you hope lunch will be?', free_response: true}
       },
-      day_1: {
+      'Day 1' => {
         how_was_intro: {text: 'How was the course introduction?'},
         bakers_speech_feedback: {text: 'What did you think of Baker?', free_response: true}
       },
-      day_2: {
+      'Day 2' => {
         how_was_day_2_activity: {text: 'How were the day 2 activities?'},
         how_was_day_2_food: {text: 'How was the food on day 2?'},
         cats_or_dogs: {text: 'Do you like cats or dogs?', free_response: true}
       },
-      day_3: {
+      'Day 3' => {
         how_was_day_3_activity: {text: 'How were the day 3 activities?'},
         how_were_animals: {text: 'How successful was the animal-based activity?'},
         favorite_sport: {text: 'What is your favorite sport?', free_response: true}
       },
-      day_4: {
+      'Day 4' => {
         how_was_day_4_activity: {text: 'How were the day 4 activities?'},
         how_was_meeting_lebron: {text: 'Did you enjoy meeting LeBron?'},
         favorite_tv_show: {text: 'What is your favorite TV show?', free_response: true}
       },
-      day_5: {
+      'Day 5' => {
         how_was_day_5_activity: {text: 'How was the day 5 activity?'},
         how_was_meeting_andy_sandberg: {text: 'How awesome was meeting Andy Sandberg?'},
         how_got_home: {text: 'How did you get home?', free_response: true},
         how_do_you_feel: {text: 'How do you really feel?', free_response: true}
       },
-      post_workshop: {
+      'Post Workshop' => {
         overall: {text: 'Overall, how successful was the workshop?'},
         how_prepared: {text: 'How prepared do you feel for the coming year?'},
         any_feedback: {text: 'Any feedback?', free_response: true},