diff --git a/squarenotsquare/src/screens/HighScore.js b/squarenotsquare/src/screens/HighScore.js index b2ce8d7..516f66d 100644 --- a/squarenotsquare/src/screens/HighScore.js +++ b/squarenotsquare/src/screens/HighScore.js @@ -1,4 +1,4 @@ -import React, { useEffect, useRef } from "react"; +import React, { useEffect, useRef, useState } from "react"; import { BackHandler, SafeAreaView, Text, TouchableOpacity, View } from "react-native"; import { styles } from './styles/AppStyles'; import Slider from "../components/Slider"; @@ -8,36 +8,65 @@ import DbAPI from "../realm/DbAPI"; function HighScore(){ const dispatch = useDispatch(); - const scores = useRef(DbAPI.getHighScores()); + const scores = useRef([]); + const [scoresLoaded, setScoresLoaded] = useState(false); useEffect(() => { BackHandler.addEventListener('hardwareBackPress', () => {return true}); }, []) + useEffect(() => { + if (!scoresLoaded) { + loadScores() + .then(() => { + setTimeout( () => { + setScoresLoaded(true); + }, 1000) + }); + } + }, [scoresLoaded]) + function onPressMainMenu(){ dispatch(goHome()); } - const now = new Date(Date.now()); + async function loadScores(){ + scores.current = DbAPI.getHighScores(); + } + + function renderScore(score, index){ + return ( + + {(index+1) + '. '} + + {score.value + ' - ' + score.user} + + + ) + } + + function renderScores(){ + return scores.current.map((score, index) => { + return renderScore(score, index); + }) + } return ( - - - Not Implemented - - Main Menu + + {renderScores()} + )