Cards

src/components/Tinder/Tinder.js

@@ -25,26 +25,43 @@ const db = [
     }
   ];
 
-  const Tinder = () => {
+  const Tinder = (props) => {
+
+    const route = props.getValue;
+
     const characters = db;
     const [lastDirection, setLastDirection] = useState();
     const [cardId, setCardId] = useState([]);
-  
-    const swiped = (direction, id) => {
-      setLastDirection(direction);
-      if (direction === 'right') {
-        cardId.push(id);
-      };
-    };
-
+    const [allIds, setAllIds] = useState([]);
+    const [cardLenth, setCardLenth] = useState(false);
 
     let uniqueTags = [];
+    let allTags = [];
+
+    const swiped = (direction, id) => {
+        setLastDirection(direction);
+        allIds.push(id);
+        if (direction === 'right') {
+            cardId.push(id);
+        };
+    };
 
     const getId = () => {
+
         uniqueTags = cardId.filter(function(elem, pos) {
             return cardId.indexOf(elem) === pos;
         });
-        console.log(uniqueTags);
+
+        allTags = allIds.filter(function(elem, pos){
+            return allIds.indexOf(elem) === pos;
+        });
+
+        characters.length === allTags.length ? setCardLenth(true) : setCardLenth(false);
+
+        if(cardLenth) {
+            route('/map')
+        }
+        
     }
   
     return (
@@ -58,7 +75,7 @@ const db = [
                 onSwipe={(dir) => {
                     swiped(dir, character.id);
                     getId();
-                    console.log(uniqueTags);
+                    // console.log(uniqueTags);
                 }}
                 >
                 <div className='card'>
@@ -72,11 +89,6 @@ const db = [
                 </TinderCard>
             ))}
             </div>
-            {lastDirection ? (
-            <h2 className='infoText'>You swiped {lastDirection}</h2>
-            ) : (
-            null
-            )}
         </div>
     );
   };