Mar 19, 2026
0
Level 20
On 2nd click for the navigation it does not clears the filters inputs like search and other things?
For the first time when I click to my sidebar notifications button it does two things:
- Navigate to the notifications page.
- Clears the notification badges for the new emails.
And then I tried some filter to the notifications and when I am done with the filtering and click on the notifications button again it works again for step 1 and step 2 but the issue arrives here in the form of the not letting the search and other inputs gets cleared but the data is at the initial state without applied any filter and url is also clean.
I have tried with the preserveState to be false for the below function markNewMailsRead() but did not worked.
Is there something I am missing or any solution for this issue.
My sidebar link component
<SidebarLink @click="markNewMailsRead" :href="route('notifications.index')"
:active="isActiveLink('notifications.index')">
<div class="flex items-center justify-between w-full">
<!-- Left -->
<div class="flex items-center gap-4">
<Bell class="size-5" />
<span>Notifications</span>
</div>
<!-- Badge -->
<div v-if="totalNewMails" class="relative">
<!-- Pulse ring -->
<span class="absolute inset-0 rounded-full bg-primary animate-ping"></span>
<!-- Count -->
<span class="relative flex items-center justify-center
w-6 h-6 p-1
rounded-full bg-primary
text-xs font-bold text-black">
{{ totalNewMails > 99 ? '99+' : totalNewMails }}
</span>
</div>
</div>
</SidebarLink>
// INFO: New Mail mark as read ( to just make the live new count 0)
const markNewMailsRead = () => {
router.post(route('notifications.new-mails.read'), {}, {
preserveScroll: true,
preserveState: true,
});
};
Please or to participate in this conversation.