feat: Implement public announcements page with a new title field and rich text editor for content.

app/Filament/Resources/Publication/Announcements/AnnouncementResource.php

@@ -15,8 +15,9 @@
 use Filament\Actions\ForceDeleteAction;
 use Filament\Actions\RestoreAction;
 use Filament\Forms\Components\CheckboxList;
+use Filament\Forms\Components\RichEditor;
 use Filament\Forms\Components\Select;
-use Filament\Forms\Components\Textarea;
+use Filament\Forms\Components\TextInput;
 use Filament\Resources\Resource;
 use Filament\Schemas\Schema;
 use Filament\Support\Enums\Width;
@@ -40,7 +41,7 @@ class AnnouncementResource extends Resource
 
     protected static ?string $slug = 'publication/announcements';
 
-    protected static ?string $recordTitleAttribute = 'content';
+    protected static ?string $recordTitleAttribute = 'title';
 
     protected static ?int $navigationSort = 2;
 
@@ -48,13 +49,17 @@ public static function form(Schema $schema): Schema
     {
         return $schema
             ->components([
-                Textarea::make('content')
+                TextInput::make('title')
+                    ->label('Judul')
+                    ->placeholder('Masukkan judul pengumuman')
+                    ->required()
+                    ->maxLength(200)
+                    ->columnSpanFull(),
+
+                RichEditor::make('content')
                     ->label('Konten')
                     ->placeholder('Diberitahukan kepada seluruh media untuk update dokumen...')
-                    ->autocomplete(false)
-                    ->autofocus()
                     ->required()
-                    ->rows(4)
                     ->columnSpanFull(),
 
                 Select::make('type')
@@ -86,12 +91,20 @@ public static function table(Table $table): Table
         return $table
             ->recordTitleAttribute('content')
             ->columns([
+                TextColumn::make('title')
+                    ->label('Judul')
+                    ->searchable()
+                    ->sortable()
+                    ->wrap(),
+
                 TextColumn::make('content')
                     ->label('Konten')
                     ->searchable()
                     ->sortable()
                     ->wrap()
-                    ->limit(100),
+                    ->limit(100)
+                    ->html()
+                    ->toggleable(isToggledHiddenByDefault: true),
 
                 TextColumn::make('type')
                     ->label('Tipe')
@@ -112,7 +125,7 @@ public static function table(Table $table): Table
             ])
             ->recordActions([
                 EditAction::make()
-                    ->modalWidth(Width::Large),
+                    ->modalWidth(Width::TwoExtraLarge),
 
                 DeleteAction::make(),
 

app/Filament/Resources/Publication/Announcements/Pages/ManageAnnouncements.php

@@ -25,7 +25,7 @@ protected function getHeaderActions(): array
                     $action->makeModalSubmitAction('createAnother', arguments: ['another' => true])
                         ->label('Simpan dan Tambah Lagi'),
                 ])
-                ->modalWidth(Width::Large),
+                ->modalWidth(Width::TwoExtraLarge),
         ];
     }
 }

app/Livewire/Home/Announcement.php

@@ -0,0 +1,33 @@
+<?php
+
+namespace App\Livewire\Home;
+
+use App\Models\Announcement as AnnouncementModel;
+use Livewire\Attributes\Title;
+use Livewire\Component;
+use Livewire\WithPagination;
+
+#[Title('Pengumuman')]
+class Announcement extends Component
+{
+    use WithPagination;
+
+    public function render()
+    {
+        $announcements = AnnouncementModel::query()
+            ->public()
+            ->latest()
+            ->paginate(6)
+            ->through(function ($item) {
+                $item->formatted_date = $item->created_at?->translatedFormat('d F Y') ?: '-';
+
+                return $item;
+            });
+
+        return view('livewire.home.announcements', [
+            'pageTitle' => 'Pengumuman',
+            'pageDescription' => 'Dapatkan informasi dan pengumuman terbaru.',
+            'announcements' => $announcements,
+        ]);
+    }
+}

app/Models/Announcement.php

@@ -3,6 +3,8 @@
 namespace App\Models;
 
 use App\Enums\AnnouncementType;
+use Illuminate\Database\Eloquent\Attributes\Scope;
+use Illuminate\Database\Eloquent\Builder;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\Relations\BelongsToMany;
@@ -21,6 +23,18 @@ protected function casts(): array
         ];
     }
 
+    #[Scope]
+    protected function public(Builder $query): void
+    {
+        $query->where('type', AnnouncementType::PUBLIC);
+    }
+
+    #[Scope]
+    protected function company(Builder $query): void
+    {
+        $query->where('type', AnnouncementType::COMPANY);
+    }
+
     public function partnerMedia(): BelongsToMany
     {
         return $this->belongsToMany(PartnerMedia::class, 'announcement_media');

database/migrations/2025_12_12_090552_create_announcements_table.php

@@ -14,6 +14,7 @@ public function up(): void
     {
         Schema::create('announcements', function (Blueprint $table) {
             $table->id();
+            $table->string('title', 200);
             $table->text('content');
             $table->enum('type', AnnouncementType::values())->default(AnnouncementType::PUBLIC)->comment(AnnouncementType::comment());
             $table->timestamp('created_at')->useCurrent();

resources/views/components/partials/header.blade.php

@@ -46,7 +46,9 @@ class="nav-link {{ Route::is('about-us') ? 'active' : '' }}">Tentang Kami</a>
                             <a wire:navigate href="{{ route('news.index') }}"
                                 class="nav-link {{ Route::is('news.index') || Route::is('news.show') ? 'active' : '' }}">Berita</a>
                         </li>
-                        <li class="nav-item"><a href="demo-it-business-about.html" class="nav-link">Pengumuman</a>
+                        <li class="nav-item">
+                            <a wire:navigate href="{{ route('announcement') }}"
+                                class="nav-link {{ Route::is('announcement') ? 'active' : '' }}">Pengumuman</a>
                         </li>
                         <li class="nav-item"><a href="{{ route('home') }}#contact" class="nav-link">Kontak</a>
                         </li>

resources/views/livewire/home/announcements.blade.php

@@ -0,0 +1,71 @@
+<div>
+    <section class="pt-0 cover-background ipad-top-space-margin sm-pb-0"
+        style="background-image:
+      linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
+      url('https://images.pexels.com/photos/12199409/pexels-photo-12199409.jpeg');">
+        <div class="shape-image-animation bottom-0 p-0 w-100 d-none d-md-block">
+            <svg xmlns="http://www.w3.org/2000/svg" widht="3000" height="400" viewBox="0 180 2500 200" fill="#ffffff">
+                <path class="st1" d="M 0 250 C 1200 400 1200 50 3000 250 L 3000 550 L 0 550 L 0 250">
+                    <animate attributeName="d" dur="5s"
+                        values="M 0 250 C 1200 400 1200 50 3000 250 L 3000 550 L 0 550 L 0 250;
+                            M 0 250 C 400 50 400 400 3000 250 L 3000 550 L 0 550 L 0 250;
+                            M 0 250 C 1200 400 1200 50 3000 250 L 3000 550 L 0 550 L 0 250"
+                        repeatCount="indefinite" />
+                </path>
+            </svg>
+        </div>
+        <div class="container">
+            <div class="row align-items-center justify-content-center h-500px sm-h-300px">
+                <div class="col-12 col-lg-6 col-md-10 position-relative text-center page-title-extra-large d-flex flex-wrap flex-column align-items-center justify-content-center"
+                    data-anime='{ "el": "childs", "translateY": [30, 0], "opacity": [0,1], "duration": 600, "delay": 0, "staggervalue": 300, "easing": "easeOutQuad" }'>
+                    <span
+                        class="ps-25px pe-25px pt-5px pb-5px mb-15px text-uppercase text-white fs-12 ls-1px fw-600 border-radius-100px bg-gradient-dark-gray-transparent d-flex"><i
+                            class="bi bi-megaphone text-white icon-small me-10px"></i>{{ $pageTitle }}</span>
+                    <h5 class="mb-20px text-white fw-600 ls-minus-1px">{{ $pageDescription }}</h5>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <section class="pt-0">
+        <div class="container">
+            <div class="row">
+                <div class="col-12">
+                    <ul class="blog-wrapper grid-loading grid grid-1col gutter-extra-large">
+                        <li class="grid-sizer"></li>
+                        <!-- start blog item -->
+                        @foreach ($announcements as $announcement)
+                            <li class="grid-item">
+                                <div
+                                    class="card border-0 border-radius-4px overflow-hidden box-shadow-quadruple-large box-shadow-quadruple-large-hover">
+                                    <div class="card-body p-0">
+                                        <div class="post-content ps-3 pe-3 pt-3 pb-3">
+                                            <div class="mb-5px">
+                                                <span
+                                                    class="text-uppercase text-medium-gray fs-12 fw-600 ls-05px d-inline-block">
+                                                    <i
+                                                        class="bi bi-calendar-event me-5px"></i>{{ $announcement->formatted_date }}
+                                                </span>
+                                            </div>
+                                            <h5
+                                                class="card-title mb-10px fw-600 fs-19 lh-28 text-dark-gray text-primary-hover">
+                                                {{ $announcement->title }}
+                                            </h5>
+                                            <p class="mb-0">
+                                                {!! $announcement->content !!}
+                                            </p>
+                                        </div>
+                                    </div>
+                                </div>
+                            </li>
+                        @endforeach
+                        <!-- end blog item -->
+                    </ul>
+                </div>
+                <div class="col-12 mt-4 d-flex justify-content-center">
+                    {{ $announcements->links() }}
+                </div>
+            </div>
+        </div>
+    </section>
+</div>

routes/web.php

@@ -1,6 +1,7 @@
 <?php
 
 use App\Livewire\Home\AboutUs;
+use App\Livewire\Home\Announcement;
 use App\Livewire\Home\Index;
 use App\Livewire\Home\News\Index as NewsIndex;
 use App\Livewire\Home\News\Show as NewsShow;
@@ -13,3 +14,5 @@
     Route::get('/', NewsIndex::class)->name('news.index');
     Route::get('/{news:slug}', NewsShow::class)->name('news.show');
 });
+
+Route::get('/announcements', Announcement::class)->name('announcement');