diff --git a/app/Livewire/NotificationCount.php b/app/Livewire/NotificationCount.php
deleted file mode 100644
index 3eefbac5..00000000
--- a/app/Livewire/NotificationCount.php
+++ /dev/null
@@ -1,35 +0,0 @@
-<?php
-
-declare(strict_types=1);
-
-namespace App\Livewire;
-
-use Illuminate\Contracts\View\View;
-use Illuminate\Support\Facades\Auth;
-use Livewire\Component;
-
-final class NotificationCount extends Component
-{
-    public int $count = 0;
-
-    /**
-     * @var string[]
-     */
-    protected $listeners = [
-        'NotificationMarkedAsRead' => 'updateCount',
-    ];
-
-    public function updateCount(int $count): int
-    {
-        return $count;
-    }
-
-    public function render(): View
-    {
-        $this->count = Auth::user()->unreadNotifications()->count(); // @phpstan-ignore-line
-
-        return view('livewire.notification-count', [
-            'count' => $this->count,
-        ]);
-    }
-}
diff --git a/app/Livewire/NotificationIndicator.php b/app/Livewire/NotificationIndicator.php
deleted file mode 100644
index d7baa23b..00000000
--- a/app/Livewire/NotificationIndicator.php
+++ /dev/null
@@ -1,32 +0,0 @@
-<?php
-
-declare(strict_types=1);
-
-namespace App\Livewire;
-
-use Illuminate\Contracts\View\View;
-use Illuminate\Support\Facades\Auth;
-use Livewire\Attributes\On;
-use Livewire\Component;
-
-final class NotificationIndicator extends Component
-{
-    public bool $hasNotification = false;
-
-    #[On('NotificationMarkedAsRead')]
-    public function setHasNotification(int $count): bool
-    {
-        return $count > 0;
-    }
-
-    public function render(): View
-    {
-        $this->hasNotification = $this->setHasNotification(
-            Auth::user()->unreadNotifications()->count(), // @phpstan-ignore-line
-        );
-
-        return view('livewire.notification-indicator', [
-            'hasNotification' => $this->hasNotification,
-        ]);
-    }
-}
diff --git a/resources/views/livewire/notification-count.blade.php b/resources/views/livewire/notification-count.blade.php
index 7e6ca155..4c160d61 100644
--- a/resources/views/livewire/notification-count.blade.php
+++ b/resources/views/livewire/notification-count.blade.php
@@ -1,3 +1,18 @@
+<?php
+
+declare(strict_types=1);
+
+use Illuminate\Support\Facades\Auth;
+
+use function Livewire\Volt\{on};
+use function Livewire\Volt\{state};
+
+state(['count' => Auth::user()->unreadNotifications()->count()]);
+
+on(['NotificationMarkedAsRead' => fn (int $count) => $count ]);
+
+?>
+
 <span class="rounded-full bg-green-100 px-3 text-base text-green-500">
     {{ $count }}
 </span>
diff --git a/resources/views/livewire/notification-indicator.blade.php b/resources/views/livewire/notification-indicator.blade.php
index 5591ac6b..65416902 100644
--- a/resources/views/livewire/notification-indicator.blade.php
+++ b/resources/views/livewire/notification-indicator.blade.php
@@ -1,3 +1,22 @@
+<?php
+
+declare(strict_types=1);
+
+use Illuminate\Support\Facades\Auth;
+
+use function Livewire\Volt\{on};
+use function Livewire\Volt\{state};
+
+state(['hasNotification' => Auth::user()->unreadNotifications()->count() > 0 ]);
+
+on(['NotificationMarkedAsRead' => fn (int $count) => $count > 0 ]);
+
+?>
+
 <span
-    class="{{ $hasNotification ? 'shadow-solid absolute right-0 top-0 block size-2 rounded-full bg-primary-600 text-white' : 'hidden' }}"
+    @class([
+        'shadow-solid absolute right-0 top-0 block size-2 rounded-full bg-primary-600 text-white',
+        'hidden' => ! $hasNotification,
+        'block' => $hasNotification,
+    ])
 ></span>
diff --git a/tests/Feature/Livewire/Components/NotificationCountTest.php b/tests/Feature/Livewire/Components/NotificationCountTest.php
new file mode 100644
index 00000000..8179bf18
--- /dev/null
+++ b/tests/Feature/Livewire/Components/NotificationCountTest.php
@@ -0,0 +1,19 @@
+<?php
+
+declare(strict_types=1);
+
+use Livewire\Volt\Volt;
+
+beforeEach(function (): void {
+    $this->user = $this->login();
+});
+
+it('renders successfully', function (): void {
+    Volt::test('notification-count')
+        ->assertStatus(200);
+});
+
+it('can display user count notification', function (): void {
+    Volt::test('notification-count')
+        ->assertSee($this->user->unreadNotifications()->count());
+});
diff --git a/tests/Feature/Livewire/Components/NotificationIndicatorTest.php b/tests/Feature/Livewire/Components/NotificationIndicatorTest.php
new file mode 100644
index 00000000..0791a500
--- /dev/null
+++ b/tests/Feature/Livewire/Components/NotificationIndicatorTest.php
@@ -0,0 +1,19 @@
+<?php
+
+declare(strict_types=1);
+
+use Livewire\Volt\Volt;
+
+beforeEach(function (): void {
+    $this->user = $this->login();
+});
+
+it('renders successfully', function (): void {
+    Volt::test('notification-indicator')
+        ->assertStatus(200);
+});
+
+it('mask indicator if user can have unread notification', function (): void {
+    Volt::test('notification-indicator')
+        ->assertSet('hasNotification', false);
+});