How to get rid of clear all in notifications sidebar

how to disable this ? since i dont want my user to accidentally clear all his/her notification on one button

14 Replies

You can override the specific blade file and remove the button/link or comment it etc, just be mindful for future filament releases if any updates done to that blade file it will not auto update and you will have to manually update it, but here is how you do it

in your 
- resources
    - vendor
      - filament-notifications
        - components
          - modal
            - actions.blade.php

in your 
- resources
    - vendor
      - filament-notifications
        - components
          - modal
            - actions.blade.php

this is the original file content you can remove or comment the clearNotifications
@props([
    'notifications',
    'unreadNotificationsCount',
])

<div {{ $attributes->class('mt-2 flex gap-x-3') }}>
    @if ($unreadNotificationsCount)
        <x-filament::link
            color="primary"
            tabindex="-1"
            tag="button"
            wire:click="markAllNotificationsAsRead"
        >
            {{ __('filament-notifications::database.modal.actions.mark_all_as_read.label') }}
        </x-filament::link>
    @endif

    <x-filament::link
        color="danger"
        tabindex="-1"
        tag="button"
        wire:click="clearNotifications"
        x-on:click="close()"
    >
        {{ __('filament-notifications::database.modal.actions.clear.label') }}
    </x-filament::link>
</div>

this is the original file content you can remove or comment the clearNotifications
@props([
    'notifications',
    'unreadNotificationsCount',
])

<div {{ $attributes->class('mt-2 flex gap-x-3') }}>
    @if ($unreadNotificationsCount)
        <x-filament::link
            color="primary"
            tabindex="-1"
            tag="button"
            wire:click="markAllNotificationsAsRead"
        >
            {{ __('filament-notifications::database.modal.actions.mark_all_as_read.label') }}
        </x-filament::link>
    @endif

    <x-filament::link
        color="danger"
        tabindex="-1"
        tag="button"
        wire:click="clearNotifications"
        x-on:click="close()"
    >
        {{ __('filament-notifications::database.modal.actions.clear.label') }}
    </x-filament::link>
</div>

so final file should look

@props([
    'notifications',
    'unreadNotificationsCount',
])

<div {{ $attributes->class('mt-2 flex gap-x-3') }}>
    @if ($unreadNotificationsCount)
        <x-filament::link
            color="primary"
            tabindex="-1"
            tag="button"
            wire:click="markAllNotificationsAsRead"
        >
            {{ __('filament-notifications::database.modal.actions.mark_all_as_read.label') }}
        </x-filament::link>
    @endif

{{--    <x-filament::link--}}
{{--        color="danger"--}}
{{--        tabindex="-1"--}}
{{--        tag="button"--}}
{{--        wire:click="clearNotifications"--}}
{{--        x-on:click="close()"--}}
{{--    >--}}
{{--        {{ __('filament-notifications::database.modal.actions.clear.label') }}--}}
{{--    </x-filament::link>--}}
</div>

@props([
    'notifications',
    'unreadNotificationsCount',
])

<div {{ $attributes->class('mt-2 flex gap-x-3') }}>
    @if ($unreadNotificationsCount)
        <x-filament::link
            color="primary"
            tabindex="-1"
            tag="button"
            wire:click="markAllNotificationsAsRead"
        >
            {{ __('filament-notifications::database.modal.actions.mark_all_as_read.label') }}
        </x-filament::link>
    @endif

{{--    <x-filament::link--}}
{{--        color="danger"--}}
{{--        tabindex="-1"--}}
{{--        tag="button"--}}
{{--        wire:click="clearNotifications"--}}
{{--        x-on:click="close()"--}}
{{--    >--}}
{{--        {{ __('filament-notifications::database.modal.actions.clear.label') }}--}}
{{--    </x-filament::link>--}}
</div>

TegarJKOP•2mo ago

Hi, i tried it , it works but need some adjusment for the folder structure

TegarJKOP•2mo ago

here's mine, need to put inside database folder first, then modal folder

TegarJKOP•2mo ago

in your - resources -> views -> vendor -> filament-notifications -> components -> database -> modal -> actions.blade.php Thank you!

TegarJKOP•2mo ago

hello do you know which one is this in the original file, im blind at reading code im sorry

TegarJKOP•2mo ago

Up anyone

toeknee•2mo ago

just target the CSS?

.fi-modal-content div.fi-no-notification button > svg.fi-icon-btn-icon  {display:none;}

.fi-modal-content div.fi-no-notification button > svg.fi-icon-btn-icon  {display:none;}

We don't advise allowing this to grow though and it should be cleaned.

TegarJKOP•2mo ago

how do i make the notif show specific date time instead of days ago or weeks ago

toeknee•2mo ago

As it stands, I can't see how you can. You could override the notifications view and format the date. Or submit a PR to add a dateFormat support.

TegarJKOP•2mo ago

I managed to do it by edit the date format from diffForHumans to this, but is it okay if i edit directly in the vendor folder and not override it?

TegarJKOP•2mo ago

im new to laravel sorry if my question sound silly

Rolland•2mo ago

extend the class do not edit directly under vendor

TegarJKOP•2mo ago

i have tried it but it doesnt work

toeknee•2mo ago

Absolutely do not edit the vendor. See here. https://filamentphp.com/docs/3.x/notifications/customizing-notifications#using-a-custom-notification-object

Customizing notifications - Notifications - Filament

Gaming

Programming

How to get rid of clear all in notifications sidebar