Move loading indicators deeper in the react node tree

[lache-melvin]

Describe the bug

We use the common convention of conditionally displaying a loading indicator or content depending on the status of queries. However, this ternary logic often feels a bit too far up the tree. Unnecessarily removing so much content is quite jarring as a user, and can make you wonder if you clicked something with greater impact that you realised.

e.g.

Sorting this table...

...causes the header to be replaced by the loading indicator, where we only need the rows to reload

Similarly, saving or running a notification...

...causes almost a full page refresh, where a loading indication could probably just sit next to the button clicked:

Expected behaviour

Render loading state as far down the tree as possible, so as to keep as much content constant for the user as possible.

Additional context

Should review where this logic lives... maybe it makes sense to have a blanker loading page on the initial load, but minimise the impact of mutations