GTBitsOfGood · johannesq23 · Nov 3, 2024 · Oct 30, 2024 · Oct 31, 2024 · Oct 31, 2024
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -75,6 +75,7 @@
     "react-redux": "^8.1.2",
     "redux": "^4.2.1",
     "redux-persist": "^6.0.0",
+    "rn-sliding-up-panel": "^2.4.6",
     "updates": "^14.5.0",
     "upgrade": "^1.1.0"
   },

diff --git a/src/assets/HomeIcon.tsx b/src/assets/HomeIcon.tsx
@@ -5,7 +5,7 @@ const HomeIcon: React.FC<{
   width?: number;
   height?: number;
   color?: string;
-}> = ({ width = 37, height = 37, color = "#9CA5C2" }) => (
+}> = ({ width = 37, height = 37, color = "#008AFC" }) => (
   <Svg width={width} height={height} viewBox="0 0 37 37" fill="none">
     <Path
       fill={color}

diff --git a/src/assets/ProfileIcon.tsx b/src/assets/ProfileIcon.tsx
@@ -1,19 +1,24 @@
 import * as React from "react";
 import Svg, { Path } from "react-native-svg";
 
-function ProfileIcon(props) {
+type Props = {
+  color?: string;
+  props?: React.ComponentProps<typeof Svg>;
+};
+
+function ProfileIcon({ color = "#9CA5C2", ...props }: Props) {
   return (
     <Svg
       width={37}
       height={37}
       viewBox="0 0 37 37"
       fill="none"
-      xmlns="http://www.w3.org/2000/svg"
+      // xmlns="http://www.w3.org/2000/svg"
       {...props}
     >
       <Path
         d="M.838 35.771a.74.74 0 00.749.729h34.49a.74.74 0 00.75-.729v-.87c.018-.262.053-1.57-.81-3.016-.543-.912-1.332-1.7-2.345-2.342-1.225-.777-2.783-1.338-4.669-1.677a27.707 27.707 0 01-2.844-.553c-2.493-.636-2.71-1.2-2.713-1.206a.726.726 0 00-.062-.16c-.021-.104-.071-.5.025-1.56.245-2.694 1.69-4.285 2.85-5.564.366-.403.711-.785.977-1.158 1.15-1.61 1.256-3.443 1.26-3.557a1.894 1.894 0 00-.082-.595c-.114-.35-.325-.568-.48-.73a2.736 2.736 0 01-.107-.113c-.012-.013-.042-.05-.015-.23.093-.583.158-1.17.193-1.76.053-.949.094-2.368-.152-3.75a5.72 5.72 0 00-.163-.782c-.258-.95-.673-1.764-1.25-2.434-.1-.11-2.514-2.653-9.521-3.174-.97-.072-1.927-.033-2.87.015a4.16 4.16 0 00-.83.102c-.723.187-.916.646-.967.902-.084.427.064.756.161.976.015.031.033.07.001.173-.162.252-.418.479-.679.694-.076.063-1.832 1.58-1.929 3.558-.26 1.506-.241 3.85.067 5.471.018.09.044.223.001.313-.331.296-.706.633-.705 1.4.003.078.11 1.91 1.26 3.521.265.373.61.754.975 1.157h.002c1.16 1.28 2.605 2.871 2.85 5.564.096 1.06.045 1.456.025 1.561a.722.722 0 00-.063.16c0 .006-.218.568-2.7 1.203a27.432 27.432 0 01-2.885.56c-1.832.309-3.38.857-4.604 1.63-1.009.637-1.8 1.427-2.35 2.346-.878 1.469-.855 2.806-.842 3.05v.875z"
-        fill="#9CA5C2"
+        fill={color}
       />
     </Svg>
   );

diff --git a/src/components/PauseButton.tsx b/src/components/PauseButton.tsx
@@ -55,7 +55,7 @@ export default function PauseButton({
       if (remainingTime <= 0) {
         setRemainingTime(remainingTime - 1);
         // clearInterval(timer);
-        console.log(remainingTime);
+        // console.log(remainingTime);
       } else if (!paused) {
         setRemainingTime(remainingTime - 1);
       }

diff --git a/src/components/SubjectComponent.tsx b/src/components/SubjectComponent.tsx
@@ -155,7 +155,9 @@ export default function SubjectComponent({
                   fontWeight: "600",
                 }}
               >
-                {secondsToTime(totalTimeSpent)}
+                {secondsToTime(
+                  Math.round((totalTimeSpent + Number.EPSILON) * 100) / 100,
+                )}
               </Text>
             </>
           ) : (
@@ -184,7 +186,10 @@ export default function SubjectComponent({
                   paddingTop: "3%",
                 }}
               >
-                {secondsToTime(averageTimePerQuestion)}
+                {secondsToTime(
+                  Math.round((averageTimePerQuestion + Number.EPSILON) * 100) /
+                    100,
+                )}
               </Text>
             </>
           ) : (

diff --git a/src/screens/Game/ReadingMain/ReadingMain.tsx b/src/screens/Game/ReadingMain/ReadingMain.tsx
@@ -53,6 +53,13 @@ export default function ReadingMain({ navigation, route }: Props) {
 
   const remainingTimeRef = useRef<RemainingTimeGetter>();
 
+  const nextParagraphTimeCheck = () => {
+    nextParagraph();
+    if (remainingTimeRef.current.getRemainingTime() <= 0) {
+      onTimeComplete(false);
+    }
+  };
+
   const nextSection = () => {
     dispatch(pause());
     Alert.alert(
@@ -189,7 +196,7 @@ export default function ReadingMain({ navigation, route }: Props) {
       </TouchableOpacity>
       <ContinueButton
         title="Next Paragraph"
-        onPressFn={nextParagraph}
+        onPressFn={nextParagraphTimeCheck}
         backgroundColor="#FE7D35"
         titleColor="white"
       />

diff --git a/src/screens/Game/SectionSummary/SectionSummary.tsx b/src/screens/Game/SectionSummary/SectionSummary.tsx
@@ -131,6 +131,20 @@ type Props = NativeStackScreenProps<RootStackParamList, "SectionSummary">;
 // }
 
 export default function SectionSummary({ route }: Props) {
+  function secondsToTime(seconds) {
+    const hours = Math.floor(seconds / 3600);
+    const minutes = Math.floor((seconds % 3600) / 60);
+    const secs = seconds % 60;
+
+    if (hours <= 0 && minutes <= 0) {
+      return `${secs} sec`;
+    }
+    if (hours <= 0) {
+      return `${minutes} min ${secs} sec`;
+    }
+    return `${hours} hr ${minutes} min ${secs} sec`;
+  }
+
   const subject = "subject" in route.params ? route.params.subject : null;
 
   const gameDetails = useSelector<
@@ -226,10 +240,9 @@ export default function SectionSummary({ route }: Props) {
             <TwoLineComponent
               icon={<FontAwesome5 name="clock" size={24} color={color} />}
               title="Total time spent"
-              stat={`${Math.floor((questions * timePer) / 60)} min ${
-                questions * timePer -
-                60 * Math.floor((questions * timePer) / 60)
-              } sec`}
+              stat={secondsToTime(
+                Math.round((timePer * questions + Number.EPSILON) * 100) / 100,
+              )}
               statColor={color}
             />
           ) : (
@@ -241,9 +254,9 @@ export default function SectionSummary({ route }: Props) {
             <TwoLineComponent
               icon={<FontAwesome5 name="clock" size={24} color={color} />}
               title="Average time per question"
-              stat={`${Math.floor(timePer / 60)} min ${
-                timePer - 60 * Math.floor(timePer / 60)
-              } sec`}
+              stat={secondsToTime(
+                Math.round((timePer + Number.EPSILON) * 100) / 100,
+              )}
               statColor={color}
             />
           ) : (

diff --git a/src/screens/Game/TriviaMain/TriviaMain.tsx b/src/screens/Game/TriviaMain/TriviaMain.tsx
@@ -259,12 +259,53 @@ export default function TriviaScreen({ navigation, route }: Props) {
       </View>
       <View>
         {answered ? (
-          <ContinueButton
-            title="Next"
-            backgroundColor="#34BC99"
-            titleColor="white"
-            onPressFn={() => onAnswerClick(true)}
-          />
+          <View>
+            <Text
+              style={{
+                fontSize: 24,
+                fontWeight: "bold",
+                color: "#2B3674",
+                textAlign: "center",
+                marginBottom: 6,
+              }}
+            >
+              Did you get it right?
+            </Text>
+            <View
+              style={{
+                display: "flex",
+                flexDirection: "row",
+                maxWidth: "100%",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <View
+                style={{
+                  width: "48%",
+                }}
+              >
+                <ContinueButton
+                  title="Yes"
+                  backgroundColor="#34BC99"
+                  titleColor="white"
+                  onPressFn={() => onAnswerClick(true)}
+                />
+              </View>
+              <View
+                style={{
+                  width: "48%",
+                }}
+              >
+                <ContinueButton
+                  title="No"
+                  backgroundColor="#34BC99"
+                  titleColor="white"
+                  onPressFn={() => onAnswerClick(false)}
+                />
+              </View>
+            </View>
+          </View>
         ) : (
           <ContinueButton
             title="Show Answer"

diff --git a/src/screens/Game/WritingMain/WritingMain.tsx b/src/screens/Game/WritingMain/WritingMain.tsx
@@ -50,6 +50,15 @@ export default function WritingMain({ navigation, route }: Props) {
 
   const remainingTimeRef = useRef<RemainingTimeGetter>();
 
+  const nextParagraph = () => {
+    updateStatsOnAnswer();
+    if (remainingTimeRef.current.getRemainingTime() <= 0) {
+      onTimeComplete(0);
+    } else {
+      getNewProblem();
+    }
+  };
+
   return (
     // <View style={styles.root}>
     //   <View>
@@ -193,10 +202,7 @@ export default function WritingMain({ navigation, route }: Props) {
       </TouchableOpacity>
       <ContinueButton
         title="Next Paragraph"
-        onPressFn={() => {
-          getNewProblem();
-          updateStatsOnAnswer();
-        }}
+        onPressFn={nextParagraph}
         backgroundColor="#9747FF"
         titleColor="white"
       />

diff --git a/src/screens/Home/HomeScreen.tsx b/src/screens/Home/HomeScreen.tsx
@@ -127,8 +127,9 @@ function HomeScreen({ navigation }: Props) {
         <TouchableOpacity
           accessibilityRole="button"
           style={styles.footerButton}
+          onPress={() => navigation.navigate("ProfileScreen")}
         >
-          <ProfileIcon></ProfileIcon>
+          <ProfileIcon props={undefined}></ProfileIcon>
           <Text style={styles.footerTextUnselected}>Profile</Text>
         </TouchableOpacity>