OpenNeo/impress
OpenNeo/impress
1
0
Fork 1
Code Pull requests Activity

Better error handling for item page preview HTTP error

Browse source 
If something goes wrong, like the site goes down or has an intermittent
error, try a full pageload. That way, we're both retrying, and in a way
that gives the user more control and visibility into what's going on,
and what they can potentially do about it. (e.g. if there's a useful
error message, they will see it!)
This commit is contained in:
Emi Matchu 2024-09-08 13:36:30 -07:00
parent 09572b5c05
commit 27774d908f
1 changed files with 14 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
app/assets/javascripts/items/show.js
View file

@ -4,9 +4,11 @@ document.addEventListener("change", (e) => {
try { try {
const mainPickerForm = document.querySelector( const mainPickerForm = document.querySelector(
"#item-preview species-color-picker form"); "#item-preview species-color-picker form",
const mainSpeciesField = );
mainPickerForm.querySelector("[name='preview[species_id]']"); const mainSpeciesField = mainPickerForm.querySelector(
"[name='preview[species_id]']",
);
mainSpeciesField.value = e.target.value; mainSpeciesField.value = e.target.value;
mainPickerForm.requestSubmit(); // `submit` doesn't get captured by Turbo! mainPickerForm.requestSubmit(); // `submit` doesn't get captured by Turbo!
} catch (error) { } catch (error) {
@ -14,6 +16,14 @@ document.addEventListener("change", (e) => {
} }
}); });
// If the preview frame fails to load, try a full pageload.
document.addEventListener("turbo:frame-missing", (e) => {
if (!e.target.matches("#item-preview")) return;
e.detail.visit(e.detail.response.url);
e.preventDefault();
});
class SpeciesColorPicker extends HTMLElement { class SpeciesColorPicker extends HTMLElement {
#internals; #internals;
@ -44,7 +54,7 @@ class SpeciesFacePicker extends HTMLElement {
#handleClick(e) { #handleClick(e) {
if (e.target.matches("input[type=radio]")) { if (e.target.matches("input[type=radio]")) {
this.dispatchEvent(new Event("change", {bubbles: true})); this.dispatchEvent(new Event("change", { bubbles: true }));
} }
} }
} }