Displays 'such empty' if no task has been completed

frontend/index.js

@@ -91,19 +91,25 @@ async function populateScreen() {
         }
     }
 
-    for (let i = (history.length -1); i >= 0; i-=1) {
+    try {
+        for (let i = (history.length -1); i >= 0; i-=1) {
+            historyPage.innerHTML += `
+            <div class="full">
+                <article class="card">
+                    <header>
+                        <p>User: ${history[i].user}</p>
+                        <p>Task: ${history[i].task}</p>
+                        <p>Time: ${history[i].time}</p>
+                        <p>Points gained: ${history[i].pointsGained}</p>
+                    </header>   
+                </article>
+            </div>`
+        }
+    } catch (e) {
         historyPage.innerHTML += `
-        <div class="full">
-            <article class="card">
-                <header>
-                    <p>User: ${history[i].user}</p>
-                    <p>Task: ${history[i].task}</p>
-                    <p>Time: ${history[i].time}</p>
-                    <p>Points gained: ${history[i].pointsGained}</p>
-                </header>   
-            </article>
-        </div>`
+        <sub>Such empty</sub>`
     }
+
     for (let i = 0; i < stats.length; i++) {
         // put user points in box
         statsPage.innerText += `${stats[i].name}: ${stats[i].points} \n`