diff --git a/extension/src/ash.css b/extension/src/ash.css index a983ecf..0c5b72a 100644 --- a/extension/src/ash.css +++ b/extension/src/ash.css @@ -239,3 +239,16 @@ tr.code-bad { td.code-bad { text-decoration: line-through; } + +.error { + display: flex; + align-items: center; + gap: .5em; +} + +.error::before { + content: "! "; + color: red; + font-weight: 900; + font-size: 2em; +} diff --git a/extension/src/background.js b/extension/src/background.js index cc98aa2..c9f20a9 100644 --- a/extension/src/background.js +++ b/extension/src/background.js @@ -56,7 +56,7 @@ function interceptSubmit(details) { code: activity.code, success: codeCorrect, }), - }).then(res => console.log('submitted code: ', res)).error(e => console.error('failed to submit code', e)); + }).then(res => console.log('submitted code: ', res)).catch(e => console.error('failed to submit code', e)); } function interceptCode(details) { diff --git a/extension/src/popup.js b/extension/src/popup.js index b215244..9676c9b 100644 --- a/extension/src/popup.js +++ b/extension/src/popup.js @@ -44,14 +44,34 @@ return root; } - const res = await fetch(SERVER_URL + '/api/codes'); + function message(message, error = false) { + const ele = document.createElement('p'); + if (error) { + ele.classList.add('error'); + const s = document.createElement('span'); + s.innerText = message; + ele.appendChild(s); + } else { + ele.innerText = message; + } + root.appendChild(ele); + } + + const res = await fetch(SERVER_URL + '/api/codes').catch((e) => { + message(`Something went wrong: ` + e); + console.error(e); + }); if (!res.ok) { - // TODO: Handle error + message('Server returned error code ' + res.status + ': ' + res.statusText, true); return; } const { activities } = await res.json(); - activities.sort(activity => activity.time); - for (const activity of activities) { - root.appendChild(activityEle(activity)); + if (activities.length === 0) { + message('No codes are available right now :/'); + } else { + activities.sort(activity => activity.time); + for (const activity of activities) { + root.appendChild(activityEle(activity)); + } } })();