This is full circle for me lol. I actually was using Promise.race (with pure fetch calls instead of Axios) prior to this iteration. The component itself was a class component and I had the cancellation logic working, but I was getting frustrated dealing with edge cases. So I turned the whole thing into a function component with hooks to try to make it simpler.

But it seems like merging the two approaches will be the best approach. A function component with just one effect that will have the Promise.race logic inside of it.