Refresh every view a change touches

How to do it

Group keys so one call can refresh a family, such as everything under an account's orders. When the answer holds the full updated record, write it into the detail query at once, then mark the lists stale. In htmx, send an HX-Trigger header that names the event other panels listen for.

Example

export function useUpdateOrder(accountId: string) {
  return useMutation({
    mutationFn: (change: OrderChange) => api.updateOrder(accountId, change),
    onSuccess: (order, _change, _result, context) => {
      context.client.setQueryData(['accounts', accountId, 'orders', order.id], order);
      return context.client.invalidateQueries({ queryKey: orderKeys.all(accountId) });
    },
  });
}

@app.patch("/orders/<order_id>/status")
def change_status(order_id):
    order = orders.change_status(current_user().account_id, order_id, request.form["status"])
    response = make_response(render_template("orders/_row.html", order=order))
    response.headers["HX-Trigger"] = "order-changed"
    return response

How to check

A test edits an order's status on its detail screen, then opens the list and the dashboard count. Both show the new status without a page reload.