Apostrophe-Headless Bearer Token Expiration

I'm working on implementing a React FE that uses apostrophe-headless to get all of it's data. I want users to be able to log in so that they can have access to content that non-logged-in users will not have access to.

Currently logging in is no problem. Logging out is no problem as long as I don't change the path or refresh the page. But when I do refresh and attempt a logout, I'm getting {"error":"bearer token invalid"} even though I'm passing the bearer token that is sent after a successful log in. Again, it works as expected if I don't refresh the page. And to prevent any questions on the matter, I'm using mobx to keep the tokens in state and I'm also encrypting and saving them in a cookie for state rehydration on refresh. So, they're definitely not getting lost and getting sent in the request headers in the same way before and after the refresh.

Firstly, I'd like to know if this is the right approach. Secondly, I'd like to know if this is a bug or expected behavior. Do I need to be re-requesting auth from the API every time there is a refresh to the page? I was under the impression that the bearer tokens didn't expire until the configured time had passed. currently I have that set to:

bearerTokens: { lifetime: 86400 * 7 * 4 }