From e158b5ccd6408abb9828a15dc776937ed4954d07 Mon Sep 17 00:00:00 2001
From: Harmony <hkunzler@cargurus.com>
Date: Mon, 30 Mar 2020 15:41:10 -0400
Subject: [PATCH] switching between sprints

---
 src/App.js                               |  2 +-
 src/Items/items.module.css               |  1 +
 src/NewItem/NewItem.js                   |  2 -
 src/SignedIn/SignedIn.js                 | 19 ++-------
 src/SignedIn/signedIn.module.css         |  6 ---
 src/boxes/Boxes.js                       |  2 +-
 src/cards/Cards.js                       |  4 +-
 src/cards/cards.module.css               |  3 ++
 src/deleteItem/deleteItem.module.css     |  1 +
 src/sprintSelect/SprintSelect.js         | 54 ++++++++++++++++++++++++
 src/sprintSelect/sprintSelect.module.css |  6 +++
 11 files changed, 73 insertions(+), 27 deletions(-)
 create mode 100644 src/sprintSelect/SprintSelect.js
 create mode 100644 src/sprintSelect/sprintSelect.module.css

diff --git a/src/App.js b/src/App.js
index 428eada..a7d185f 100644
--- a/src/App.js
+++ b/src/App.js
@@ -13,7 +13,7 @@ const config = {
 };
 const uiConfig = {
   signInFlow: 'popup',
-  signInSuccessUrl: '/signedIn',
+  signInSuccessUrl: '/',
   signInOptions: [
     firebase.auth.GoogleAuthProvider.PROVIDER_ID,
   ]
diff --git a/src/Items/items.module.css b/src/Items/items.module.css
index cf1a917..6b3d2f9 100644
--- a/src/Items/items.module.css
+++ b/src/Items/items.module.css
@@ -8,6 +8,7 @@ button{
 }
 .checkmark{
   color: green;
+  cursor: pointer;
 }
 .redx{
   color: red;
diff --git a/src/NewItem/NewItem.js b/src/NewItem/NewItem.js
index a40e46e..93c6376 100644
--- a/src/NewItem/NewItem.js
+++ b/src/NewItem/NewItem.js
@@ -4,7 +4,6 @@ import uuid from "uuid";
 
 export default function NewItem({ addItem, boxId, sprint }) {
   const [value, setValue ] = useState("");
-console.log(sprint);
   const handleSubmit = e => {
     e.preventDefault();
     let retroRef;
@@ -28,7 +27,6 @@ console.log(sprint);
       title: value,
     }
     let objectId = retroRef.push(item);
-    console.log(objectId.key);
     databaseRef.ref(url + `/` + objectId.key + `/id`).set(objectId.key)
     setValue("")
   }
diff --git a/src/SignedIn/SignedIn.js b/src/SignedIn/SignedIn.js
index 383e7a2..925d4dd 100644
--- a/src/SignedIn/SignedIn.js
+++ b/src/SignedIn/SignedIn.js
@@ -1,11 +1,9 @@
-import React, { useState } from "react";
-import firebase from'firebase'
-import { Link } from "@reach/router";
-import Boxes from "../boxes/Boxes";
+import React from "react";
+import firebase from'firebase';
+import SprintSelect from "../sprintSelect/SprintSelect"
 import styles from "./signedIn.module.css";
 
 export default function SignedIn() {
-  const [sprint, setSprint] = useState(1);
   return (
     <div>
       <div className={styles.alignRight}>
@@ -17,16 +15,7 @@ export default function SignedIn() {
           <button className={styles.signOutButton} onClick={() => firebase.auth().signOut()}>Sign Out</button>
         </div>
       </div>
-      <nav>
-      <Link onClick={() => setSprint(sprint + 1)} to={`/` + sprint}>Sprint (+))</Link>
-      {console.log(sprint)}
-      </nav>
-      <h3>Sprint {sprint}</h3>
-        <div className={styles.grid}>
-          <Boxes sectionName={"What Went Well"}  sprint={sprint} boxId={'1'}/>
-          <Boxes sectionName={"What Could Be Better"}  sprint={sprint} boxId={'2'}/>
-          <Boxes sectionName={"Questions"} sprint={sprint} boxId={'3'}/>
-        </div>
+      <SprintSelect />
     </div>
   )
 }
diff --git a/src/SignedIn/signedIn.module.css b/src/SignedIn/signedIn.module.css
index 84e38d4..f27abc5 100644
--- a/src/SignedIn/signedIn.module.css
+++ b/src/SignedIn/signedIn.module.css
@@ -1,12 +1,6 @@
 body{
   background: lightseagreen;
 }
-.grid{
-  display: grid;
-  grid-template-columns: auto auto auto;
-  grid-column-gap: 1em;
-  margin: 1rem;
-}
 .alignRight{
   width: 100%;
   display: flex;
diff --git a/src/boxes/Boxes.js b/src/boxes/Boxes.js
index 243ff2f..bc5f79a 100644
--- a/src/boxes/Boxes.js
+++ b/src/boxes/Boxes.js
@@ -6,7 +6,7 @@ export default function Boxes({ sectionName, boxId, sprint }) {
   return (
     <div>
       <div className={styles.box}>
-        <Cards sectionName={sectionName} boxId={boxId} sprint={sprint}/>
+        <Cards sectionName={sectionName} boxId={boxId} sprint={sprint} />
       </div>
     </div>
   )
diff --git a/src/cards/Cards.js b/src/cards/Cards.js
index 72a2e49..ffee83b 100644
--- a/src/cards/Cards.js
+++ b/src/cards/Cards.js
@@ -5,12 +5,12 @@ import NewItem from '../NewItem/NewItem.js'
 import DeleteItem from '../deleteItem/DeleteItem.js'
 import styles from "./cards.module.css";
 
-export function Cards({item, setItem, boxId, sprint, sectionName}) {
+export function Cards({item, setItem, boxId, sprint, sectionName, sprint_id}) {
   return (
     <>
     <h3>{sectionName}</h3>
       {item.map((i, index) => (
-                      <div className={styles.cardBackground} key={i.id}>
+                      <div className={i.sprint_id === sprint ? styles.cardBackground : styles.hide} key={i.id}>
                         <Item
                             item={i}
                             index={index}
diff --git a/src/cards/cards.module.css b/src/cards/cards.module.css
index 3315527..03543fe 100644
--- a/src/cards/cards.module.css
+++ b/src/cards/cards.module.css
@@ -3,3 +3,6 @@
   margin: .5em;
   padding: 1em;
 }
+.hide{
+  display: none;
+}
diff --git a/src/deleteItem/deleteItem.module.css b/src/deleteItem/deleteItem.module.css
index f84475f..2211e78 100644
--- a/src/deleteItem/deleteItem.module.css
+++ b/src/deleteItem/deleteItem.module.css
@@ -6,4 +6,5 @@
   font-size: .5em;
   font-weight: bolder;
   letter-spacing: 1px;
+  cursor: pointer;
 }
diff --git a/src/sprintSelect/SprintSelect.js b/src/sprintSelect/SprintSelect.js
new file mode 100644
index 0000000..050a28e
--- /dev/null
+++ b/src/sprintSelect/SprintSelect.js
@@ -0,0 +1,54 @@
+import React, { useState, useEffect, useMemo } from 'react';
+import Boxes from "../boxes/Boxes";
+import { databaseRef } from '../store/firebase.js'
+import styles from "../sprintSelect/sprintSelect.module.css";
+
+export function SprintSelect({item}) {
+  const [sprint, setSprint] = useState(1);
+  let sprintArray = [];
+  let sortedSprint;
+  sortedSprint = item.map((i, index) => (
+          sprintArray.push(i.sprint_id)
+        ))
+        .reduce((unique, item) => {
+          return unique.includes(item) ? unique : [...unique, item]
+        }, [])
+        .sort();
+  let dropdownSprint;
+  dropdownSprint = sortedSprint.map((i, index) => (
+          <option onClick={() => setSprint(i)}>{i}</option>
+        ));
+  return (
+    <div>
+      <label>Choose Sprint:</label>
+      <select>
+      {dropdownSprint}
+      </select>
+      <h3>Sprint {sprint}</h3>
+        <div className={styles.grid}>
+          <Boxes sectionName={"What Went Well"}  sprint={sprint} boxId={'1'} />
+          <Boxes sectionName={"What Could Be Better"}  sprint={sprint} boxId={'2'}/>
+          <Boxes sectionName={"Questions"} sprint={sprint} boxId={'3'}/>
+        </div>
+    </div>
+  )
+}
+
+export default function FirebaseWrapper() {
+  const [cards, setCards] = useState(null)
+  let retro = databaseRef.ref(`retros/1/www`);
+  const retroRef = useMemo(() => databaseRef.ref(retro), []);
+  useEffect(() => {
+    retroRef.on('value', function(snapshot) {
+      const values = Object.values(snapshot.val())
+      setCards(values)
+    });
+    return () => {
+      retroRef.off();
+    }
+  }, [retroRef]);
+  if(!cards) {
+    return <div>loading...</div>;
+  };
+  return <SprintSelect item={cards} setItem={()=> {}}/>
+}
diff --git a/src/sprintSelect/sprintSelect.module.css b/src/sprintSelect/sprintSelect.module.css
new file mode 100644
index 0000000..68a2df7
--- /dev/null
+++ b/src/sprintSelect/sprintSelect.module.css
@@ -0,0 +1,6 @@
+.grid{
+  display: grid;
+  grid-template-columns: auto auto auto;
+  grid-column-gap: 1em;
+  margin: 1rem;
+}