I did a lot of research. The problem is that you can't update the cookie from the server component. I am leaving a video link; he explained very nicely why you can't set a cookie from the server component. As a solution, I have used Redis to store the refresh and access token. If you use Redis, there is another problem. Radis doesn't support edge runtime. So you can't access directly to redis functions from middleware. Make a nextjs API like is-logged-in, then use it from middleware by fetch.
Here is the link.