Displays 'such empty' if no task exists

frontend/index.js

@@ -70,24 +70,32 @@ async function populateScreen() {
     // if it is a user make the tasks add points
     // or if admin make it do nothing
     if (sessionStorage.getItem("role") === "user") {
-        for (let i = 0; i < tasks.length; i++) {
-            taskPage.innerHTML += `
+        try {
+            for (let i = 0; i < tasks.length; i++) {
+                taskPage.innerHTML += `
             <div id="${tasks[i].tid}" class="half" style="height: fit-content">
                 <div class="button" onclick="completeTask(${tasks[i].tid})">
                     <p id="taskName">${tasks[i].name}</p>
                     <p id="${tasks[i].tid}-p">${tasks[i].points} points</p>
                 </div>
             </div>`
+            }
+        } catch (e) {
+            taskPage.innerHTML +=`<sub>such empty</sub>`
         }
     } else if (sessionStorage.getItem("role") === "admin") {
-        for (let i = 0; i < tasks.length; i++) {
-            taskPage.innerHTML += `
+        try {
+            for (let i = 0; i < tasks.length; i++) {
+                taskPage.innerHTML += `
             <div id="${tasks[i].tid}" class="half" style="height: fit-content">
                 <div class="button" disabled data-tooltip="Admins can't get points">
                     <p id="taskName">${tasks[i].name}</p>
                     <p id="${tasks[i].tid}-p">${tasks[i].points} points</p>
                 </div>
             </div>`
+            }
+        } catch (e) {
+            taskPage.innerHTML +=`<sub>such empty</sub>`
         }
     }