From 0ed28e7c09c4d0a643dc8d188938cb3a03183c53 Mon Sep 17 00:00:00 2001
From: Tim Glasgow <tim.glasgow@atonalsoftware.com>
Date: Sat, 6 Aug 2022 10:41:02 -0500
Subject: [PATCH] stop game after completed

---
 squarenotsquare/src/screens/Game.js           | 21 ++++++++++++++++++-
 .../src/screens/styles/AppStyles.js           |  2 +-
 squarenotsquare/src/themes/Icons.js           |  3 ++-
 3 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/squarenotsquare/src/screens/Game.js b/squarenotsquare/src/screens/Game.js
index bd8de74..6ffe40d 100644
--- a/squarenotsquare/src/screens/Game.js
+++ b/squarenotsquare/src/screens/Game.js
@@ -79,9 +79,18 @@ function Game(props){
       scrollDestination.current = newDestination;
       challengeState.current = challengeState.current + 1;
       setScrollOrigin(newOrigin);
+
+      if (challengeState.current >= 20) {
+        completeChallenge();
+      }
     }
   }
 
+  function completeChallenge(){
+    clearInterval(localTimer.current);
+    setTimerState(4);
+  }
+
   function generateSquare(pairIndex){
     return (
       <TouchableOpacity
@@ -153,8 +162,18 @@ function Game(props){
           destination={scrollDestination.current}
           duration={250}
         >
-          <View style={[styles.gameStart]} />
+          <View style={[styles.gameView]} />
           {squareMemo}
+          <View style={[styles.gameView, styles.flexRow, styles.spaceEvenly, styles.centeredItems]}>
+            <MaterialIcon
+              name={Icons.squareIcons.check}
+              color={Colors.material.green800}
+              size={Metrics.icons.buttonIcon}
+            />
+            <Text style={[styles.headerTitleFont, styles.greyText]}>
+              Finish
+            </Text>
+          </View>
         </Autoscroll>
       </View>
     </SafeAreaView>
diff --git a/squarenotsquare/src/screens/styles/AppStyles.js b/squarenotsquare/src/screens/styles/AppStyles.js
index 3ae74b4..aeac431 100644
--- a/squarenotsquare/src/screens/styles/AppStyles.js
+++ b/squarenotsquare/src/screens/styles/AppStyles.js
@@ -80,7 +80,7 @@ export const styles = StyleSheet.create({
   },
 
   smallMargin: {margin: Metrics.margins.default},
-  gameStart: {margin: Metrics.margins.gameStartMargin},
+  gameView: {margin: Metrics.margins.gameStartMargin},
   buttonMargin: {
     marginBottom: Metrics.margins.buttonMargin,
     marginTop: Metrics.margins.buttonMargin
diff --git a/squarenotsquare/src/themes/Icons.js b/squarenotsquare/src/themes/Icons.js
index 9f67027..91ddd10 100644
--- a/squarenotsquare/src/themes/Icons.js
+++ b/squarenotsquare/src/themes/Icons.js
@@ -3,7 +3,8 @@ class AppIcons {
     square: 'square',
     settings: 'cog-outline',
     toggleOn: 'toggle-switch-on',
-    toggleOfff: 'toggle-switch-off',
+    toggleOff: 'toggle-switch-off',
+    check: 'check'
   };
 
   wrongShapes = {