commit b2ab304627d701a1d704b0a73679a4d3ca27f015
parent 88419f2e5916e6a6ef2a9b459024b15776bdb646
Author: Jacob R. Edwards <jacob@jacobedwards.org>
Date: Fri, 18 Oct 2024 16:50:27 -0700
Show network/api errors to the user
This is extremely important, and even more so since there do seem
to be errors with the backend trying to push invalid data to the
server. It can be improved in the future but for now at least users
know about it.
Diffstat:
4 files changed, 40 insertions(+), 6 deletions(-)
diff --git a/files/floorplans/floorplan/editor.js b/files/floorplans/floorplan/editor.js
@@ -522,17 +522,17 @@ export class FloorplanEditor {
// Should be called after each user "action"
finishAction() {
this.backend.history.mark()
- this.backend.push()
+ return this.backend.push()
}
undo() {
this.backend.undo()
- this.backend.push()
+ return this.backend.push()
}
redo() {
this.backend.redo()
- this.backend.push()
+ return this.backend.push()
}
addPoint(point, force) {
diff --git a/files/floorplans/floorplan/main.css b/files/floorplans/floorplan/main.css
@@ -27,6 +27,17 @@ header > h1 {
font-weight: normal;
}
+#status {
+ font-size: smaller;
+ text-decoration: underline;
+}
+
+div:has(#status) {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+}
+
header > .toolbar {
list-style: none;
padding: 0;
diff --git a/files/floorplans/floorplan/main.js b/files/floorplans/floorplan/main.js
@@ -132,10 +132,9 @@ function init() {
},
push: function() {
suffix.data = ""
+ status()
},
- pusherror: function(err) {
- notify("Failed to push: " + err)
- }
+ pusherror: fetchError
}
}
})
@@ -1760,3 +1759,17 @@ function defKey(obj) {
return i
}
}
+
+function status(msg) {
+ let s = document.getElementById("status")
+ s.classList[msg instanceof Error ? "add" : "remove"]("error")
+ s.textContent = msg ?? ""
+}
+
+function fetchError(err) {
+ if (err instanceof api.FetchError) {
+ status("Network error: " + err)
+ } else {
+ status(err)
+ }
+}
diff --git a/files/lib/api.js b/files/lib/api.js
@@ -15,6 +15,12 @@ if (dev.setting("devapi")) {
console.log(`Floorplan API: ${config.proto}://${config.host}/${config.version}`)
+export class FetchError extends Error {
+ constructor(message, options) {
+ super(message, options)
+ }
+}
+
function verify_response(response) {
let type = response.headers.get("Content-Type")
if (type != "application/json; charset=utf-8") {
@@ -56,6 +62,10 @@ function api_fetch(method, endpoint, body) {
}
return fetch(config.proto + "://" + config.host + "/" + config.version + "/" + requestPath(endpoint), params)
+ .catch(function(neterr) {
+ console.warn("Fetch error:", neterr)
+ throw new FetchError(neterr)
+ })
.then(verify_response)
.then(parse_response)
.then(status)