router.refresh(); don't work in Next 15?

[J4v4Scr1pt]

Summary

I want to update a button based on if a user has answered a question or not. This button is rendered in my main navigation-header. So it's not part of any specific route, rather all routes. In NextJs 14 this worked as expected, but after an update to NextJs 15 this started to not trigger the router.refresh() it seems. If I do a manual F5 it works ofc.

I can't really understand why, some light on this would be much appreciated!

This is a simplified version of the whole structure to hopefully get an idea on how it looks and works.

MainLayoutFile(server):

........other code
<Navigation/>
<main>{children}</main>
........other code

Navigation(server):

........other code
<Header/>
<SideBar/>
........other code

Header (server):

........other code
<QuestionButton/>
........other code

QuestionButtonServer:

import { GET } from '@/utils/Api';
import QuestionButtonClient from './QuestionButton.client';
import { User } from '@/app/types';

export async function DailyQuestionButton() {
	const user = await GET<User>('GetUserSettings', 'question-state');
	return <QuestionButtonClient canAnswerQuestion={user?.CanAnswerQuestion} />;
}

QuestionButtonClient:

'use client';

import { Tooltip } from '@nextui-org/tooltip';
import { useTranslation } from '@/i18n/client';
import { QuestionButtonCanAnswer } from './QuestionButtonCanAnswer';
import { QuestionButtonCanNotAnswer } from './QuestionButtonCanNotAnswer';

export default function QuestionButton({
	canAnswerQuestion,
}: {
	canAnswerQuestion?: boolean;
}) {
	const { t } = useTranslation('common');

	return (
		<>
			<Tooltip content={t('Question')} offset={26}>
				{canAnswerQuestion ? (
					<QuestionButtonCanAnswer />
				) : (
				<QuestionButtonCanNotAnswer />
			</Tooltip>
		</>
	);
}

QuestionButtonCanAnswer:

import { useTranslation } from '@/i18n/client';
import { Button } from '@nextui-org/button';
import { useQueryState } from 'nuqs';

export function QuestionButtonCanAnswer() {
	const [, setShowQModal] = useQueryState('showQModal');
	const { t } = useTranslation('common');

	return (
		<Button
			onPress={() => setShowQModal('true')}
			isIconOnly
			color="primary"
			radius="full"
			className="group/dailyQ relative mr-8 h-[30px] w-fit">
				Answer Question
		</Button>
	);
}

Modal:

........other code
const onSendAnswerClick = async () => {
		if (answeredQuestion === null || !checkIsAnswered(answeredQuestion)) {
			return;
		}

		const success = await postAnswer(answeredQuestion);
		if (success) {
			router.refresh();
		} else {
			ShowToaster({ id: '1', type: 'danger', title: t('Error') });
			onCloseEvent();
		}
	};
........other code

PostAnswerAction:

'use server';

import { POST } from '@/utils/Api';
import { QuestionAnswer } from '../types';
import { revalidateTag } from 'next/cache';

export async function postAnswer(data: QuestionAnswer) {
	let success = true;
	try {
		const response = await POST<{ Success: boolean }>(
			'Question/Save',
			JSON.stringify(data)
		);
		success = response?.Success || false;
		revalidateTag('question-state');
	} catch {}
	return success;
}

The util GET:

export async function GET<T>(
	endpoint: string,
	cacheTag?: string,
	cache: RequestCache | undefined = 'force-cache'
): Promise<T | null | undefined> {
	const aspNetCookies = (await cookies()).toString();

	const res = await fetch(`${process.env.API_DotNET_INTERNAL}${endpoint}`, {
		method: 'GET',
		cache,
		headers: {
			'Content-Type': 'application/json',
			Cookie: aspNetCookies || '',
		},
		...(cacheTag && { next: { tags: [cacheTag] } }),
	});

	if (res.status >= 300 && res.status < 400) permanentRedirect(redirectLoginUrl);

	try {
		return await res.json();
	} catch (err) {
		console.error(err);
		return null;
	}
}

In next.config I do have:

staleTimes: {
			dynamic: 30,
		},

Additional information

"next": "15.1.4",
"react": "19.0.0",
"react-dom": "19.0.0",

Example

No response

[bobelmasry]

Faced same issue and not sure why they removed the refresh.
I used this instead:
window.location.reload()

[bberos]

same problem here...

[refirst11]

All "next dev --turbopack" operations run on cjs.
If necessary, you will also need to import libraries, etc.,
using const { ... } = require('module').

It was probably possible to mix them up until around next14.21, but it seems that after 15 it became completely CJS.