react

"mulling over state management stuff"
orestis 2021-04-20T13:00:53.112500Z

I'm trying to figure out a good error handling strategy and I'm hitting dead ends. I guess my hope is that I could somehow come up with a way to show a generic "something went wrong" toast or modal while keeping the UI in a state that can be still used to retry the operation but it seems like a pipe dream.

orestis 2021-04-20T13:01:26.113200Z

Error boundaries have only limited usefulness because they have their own state so you need to have a way to reset their internal state to re-render which is not very practical.

orestis 2021-04-20T13:04:15.113800Z

I would be curious to hear how the mainstream clojure frameworks handle errors. A cursory search doesn't bring up anything concrete.

lilactown 2021-04-20T14:10:04.114800Z

There are different kinds of errors that require different handling

lilactown 2021-04-20T14:10:38.115600Z

Validation errors, operational errors (e.g. backend is down), and coding errors

lilactown 2021-04-20T14:10:42.115800Z

Probably more

lilactown 2021-04-20T14:11:47.116400Z

It’s a good architectural problem

lilactown 2021-04-20T14:12:28.117300Z

IME error boundaries are good at catching coding errors & operational errors (esp. with suspense), not good at catching validation errors

lilactown 2021-04-20T14:13:17.118100Z

“Keeping the UI in a state that can be still used to retry the operation” what makes this hard?

lilactown 2021-04-20T14:17:49.120700Z

> Error boundaries [...] need to have a way to reset their internal state to re-render which is not very practical this is an annoying thing about error boundaries. it forces you to unmount the component tree and remount it. TBD if this helps us toward better practices or not, but you can handle this by changing the key the error boundary has

lilactown 2021-04-20T14:18:50.122400Z

for your toast idea, you could use an error boundary that doesn’t handle the actual error; rather, in its didCatch method you could signal the toast to appear, and then do nothing. or re-mount the children below it

orestis 2021-04-20T15:12:33.123800Z

Yeah errors is very much a complected term. HTTP tries to categorize them but it’s still messy.

orestis 2021-04-20T15:15:15.126200Z

> “Keeping the UI in a state that can be still used to retry the operation” > what makes this hard? With suspense for data fetching, what triggers the fetch might be far away, or the state of the UI might be subtly broken. Nothing a bit of discipline can’t fix of course, but it seems there’s not much discussion about this. Perhaps flux or relay have some opinions about this.

lilactown 2021-04-20T16:19:39.126900Z

I think using declarative queries a la GraphQL does help here because you can scope the error to what actually uses the data being requested

lilactown 2021-04-20T16:20:27.127700Z

GraphQL also allows fine-grained errors, i.e. some attributes may succeed and others can fail, so you can show errors for only components that depend on attributes that failed to resolve

Aron 2021-04-20T16:50:49.128800Z

I have one way of doing errors that so far is working out, but I am actually not certain if it's sane. 1. I have global state, but obviously everything namespaced so no collisions 2. Errors have their own top level namespace, otherwise it's duplicated down 3. this way I can check for errors, keep more than one error, but also just clear from anywhere anytime

Aron 2021-04-20T16:52:29.129300Z

I tried collecting, passing, keeping locally, all were problematic and buggy in the end.

orestis 2021-04-20T16:59:45.129900Z

So components can check for specific errors @ashnur ?

Aron 2021-04-20T17:04:03.130300Z

yeah, and some errors are less important, but sometimes I want a history of errors

Aron 2021-04-20T17:04:26.130800Z

so then I can put a vector under the same namespace the input or whatever I need it for is

Aron 2021-04-20T17:05:06.131400Z

but I think this stuff that I can't really use atoms like clojure intended it is a problem

orestis 2021-04-20T17:32:23.134300Z

We are using Suspense for data via reseda. It seems though that errors should be a top-level prop for components, next to data. Like your approach @ashnur. I’m just surprised that Clojure frontend frameworks don’t seem to have a story for this, as it’s something that’s hard to retrofit as I find out :)