feat: enhance notification system with creator information and notification sending functionality

app/Models/Notification.php

@@ -23,4 +23,9 @@ public function user(): BelongsTo
     {
         return $this->belongsTo(User::class);
     }
+
+    public function creator(): BelongsTo
+    {
+        return $this->belongsTo(User::class, 'created_by');
+    }
 }

app/Services/Admin/Manage/AnnouncementService.php

@@ -3,10 +3,16 @@
 namespace App\Services\Admin\Manage;
 
 use App\Models\Announcement;
+use App\Models\Student;
+use App\Services\NotificationService;
 use Illuminate\Contracts\Pagination\LengthAwarePaginator;
 
 class AnnouncementService
 {
+    public function __construct(
+        private readonly NotificationService $notificationService,
+    ) {}
+
     public function paginated(int $perPage = 25, string $search = '', ?int $departmentId = null): LengthAwarePaginator
     {
         return Announcement::query()
@@ -20,13 +26,27 @@ public function paginated(int $perPage = 25, string $search = '', ?int $departme
 
     public function create(array $data): Announcement
     {
-        return Announcement::create([
+        $announcement = Announcement::create([
             'title' => $data['title'],
             'content' => $data['content'],
             'department_id' => $data['department_id'] ?? null,
             'enrollment_year' => $data['enrollment_year'] ?? null,
             'created_by' => auth()->id(),
         ]);
+
+        $recipientUserIds = Student::query()
+            ->when($announcement->department_id, fn ($q, $departmentId) => $q->where('department_id', $departmentId))
+            ->when($announcement->enrollment_year, fn ($q, $year) => $q->where('enrollment_year', $year))
+            ->pluck('user_id');
+
+        $this->notificationService->sendToUsers(
+            $recipientUserIds,
+            $announcement->title,
+            $announcement->content,
+            $announcement->created_by,
+        );
+
+        return $announcement;
     }
 
     public function update(Announcement $announcement, array $data): Announcement

app/Services/NotificationService.php

@@ -5,13 +5,40 @@
 use App\Models\Notification;
 use App\Models\User;
 use Illuminate\Contracts\Pagination\LengthAwarePaginator;
+use Illuminate\Support\Collection;
 
 class NotificationService
 {
+    /**
+     * @param  Collection<int, int>|array<int, int>  $userIds
+     */
+    public function sendToUsers(Collection|array $userIds, string $title, ?string $content = null, ?int $createdBy = null): void
+    {
+        $userIds = collect($userIds)->filter()->unique()->values();
+
+        if ($userIds->isEmpty()) {
+            return;
+        }
+
+        $createdBy ??= auth()->id();
+        $now = now();
+
+        Notification::insert($userIds->map(fn (int $userId) => [
+            'user_id' => $userId,
+            'created_by' => $createdBy,
+            'title' => $title,
+            'content' => $content,
+            'is_read' => false,
+            'created_at' => $now,
+            'updated_at' => $now,
+        ])->all());
+    }
+
     public function paginated(User $user, int $perPage = 15): LengthAwarePaginator
     {
         return Notification::query()
             ->where('user_id', $user->id)
+            ->with('creator.profile')
             ->orderByDesc('created_at')
             ->orderByDesc('id')
             ->paginate($perPage);

database/migrations/2026_08_25_000004_create_notifications_table.php

@@ -11,6 +11,7 @@ public function up(): void
         Schema::create('notifications', function (Blueprint $table) {
             $table->id();
             $table->foreignId('user_id')->constrained()->cascadeOnDelete();
+            $table->foreignId('created_by')->nullable()->constrained('users')->nullOnDelete();
             $table->string('title', 150)->nullable();
             $table->text('content')->nullable();
             $table->boolean('is_read')->nullable()->default(false);

database/migrations/2026_08_30_150000_add_created_by_to_notifications_table.php

@@ -0,0 +1,22 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::table('notifications', function (Blueprint $table) {
+            $table->foreignId('created_by')->nullable()->after('user_id')->constrained('users')->nullOnDelete();
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::table('notifications', function (Blueprint $table) {
+            $table->dropConstrainedForeignId('created_by');
+        });
+    }
+};

resources/js/components/notification-bell.tsx

@@ -6,6 +6,13 @@ import { useState } from 'react';
 import { ConfirmDialog } from '@/components/confirm-dialog';
 import { Button } from '@/components/ui/button';
 import { Combobox, ComboboxContent } from '@/components/ui/combobox';
+import {
+    Dialog,
+    DialogContent,
+    DialogDescription,
+    DialogHeader,
+    DialogTitle,
+} from '@/components/ui/dialog';
 import { cn } from '@/lib/utils';
 import { destroy, markAllRead, clearAll, read } from '@/routes/notifications';
 import type { Notification, NotificationPage } from '@/types/notification';
@@ -23,6 +30,7 @@ export function NotificationBell() {
 
     const [open, setOpen] = useState(false);
     const [clearAllOpen, setClearAllOpen] = useState(false);
+    const [detail, setDetail] = useState<Notification | null>(null);
 
     const hasMore = notifications.current_page < notifications.last_page;
     const hasNotifications = notifications.data.length > 0;
@@ -47,6 +55,14 @@ export function NotificationBell() {
         router.delete(destroy(notification.id).url, { preserveScroll: true });
     }
 
+    function handleOpenDetail(notification: Notification) {
+        setDetail(notification);
+
+        if (!notification.is_read) {
+            handleMarkRead(notification);
+        }
+    }
+
     return (
         <>
             <Combobox open={open} onOpenChange={setOpen}>
@@ -70,9 +86,9 @@ export function NotificationBell() {
 
                 <ComboboxContent
                     align="end"
-                    className="w-96 max-w-[90vw] min-w-96 p-0"
+                    className="flex w-96 max-w-[90vw] min-w-96 flex-col p-0"
                 >
-                    <div className="flex items-center justify-between border-b p-3">
+                    <div className="flex shrink-0 items-center justify-between border-b p-3">
                         <span className="font-medium">Notifikasi</span>
                         <div className="flex gap-1">
                             <Button
@@ -96,7 +112,7 @@ export function NotificationBell() {
                         </div>
                     </div>
 
-                    <div className="max-h-96 overflow-y-auto">
+                    <div className="min-h-0 flex-1 overflow-y-auto">
                         {hasNotifications ? (
                             <div className="flex flex-col divide-y">
                                 {notifications.data.map((notification) => (
@@ -108,7 +124,13 @@ export function NotificationBell() {
                                                 'bg-primary/5',
                                         )}
                                     >
-                                        <div className="flex items-start gap-2">
+                                        <button
+                                            type="button"
+                                            className="flex flex-1 cursor-pointer items-start gap-2 text-left"
+                                            onClick={() =>
+                                                handleOpenDetail(notification)
+                                            }
+                                        >
                                             {!notification.is_read && (
                                                 <span className="mt-1.5 h-2 w-2 shrink-0 rounded-full bg-primary" />
                                             )}
@@ -117,11 +139,14 @@ export function NotificationBell() {
                                                     {notification.title ?? '-'}
                                                 </p>
                                                 {notification.content && (
-                                                    <p className="mt-0.5 text-xs text-muted-foreground">
+                                                    <p className="mt-0.5 line-clamp-2 text-xs text-muted-foreground">
                                                         {notification.content}
                                                     </p>
                                                 )}
                                                 <p className="mt-1 text-xs text-muted-foreground">
+                                                    {notification.creator
+                                                        ?.profile?.full_name &&
+                                                        `${notification.creator.profile.full_name} · `}
                                                     {format(
                                                         new Date(
                                                             notification.created_at,
@@ -130,7 +155,7 @@ export function NotificationBell() {
                                                     )}
                                                 </p>
                                             </div>
-                                        </div>
+                                        </button>
                                         <div className="flex shrink-0 items-center gap-1">
                                             {!notification.is_read && (
                                                 <Button
@@ -202,6 +227,35 @@ export function NotificationBell() {
                 confirmLabel="Hapus"
                 onConfirm={handleClearAll}
             />
+
+            <Dialog
+                open={detail !== null}
+                onOpenChange={(open) => {
+                    if (!open) {
+                        setDetail(null);
+                    }
+                }}
+            >
+                <DialogContent className="flex max-h-[85vh] flex-col overflow-hidden">
+                    <DialogHeader>
+                        <DialogTitle>{detail?.title ?? '-'}</DialogTitle>
+                        <DialogDescription>
+                            {detail?.creator?.profile?.full_name &&
+                                `${detail.creator.profile.full_name} · `}
+                            {detail &&
+                                format(
+                                    new Date(detail.created_at),
+                                    'd MMM yyyy, HH:mm',
+                                )}
+                        </DialogDescription>
+                    </DialogHeader>
+                    {detail?.content && (
+                        <p className="overflow-y-auto text-sm whitespace-pre-wrap text-foreground">
+                            {detail.content}
+                        </p>
+                    )}
+                </DialogContent>
+            </Dialog>
         </>
     );
 }

resources/js/types/notification.ts

@@ -3,6 +3,7 @@ export type Notification = {
     title: string | null;
     content: string | null;
     is_read: boolean;
+    creator: { profile: { full_name: string } | null } | null;
     created_at: string;
     updated_at: string;
 };