Refactor About page settings: replace management section with a video upload feature, update view to display static management information, and clean up related settings for improved content management and user experience.

app/Filament/Pages/AboutPageSettings.php

@@ -71,10 +71,12 @@ class AboutPageSettings extends SettingsPage
                             ->disk('public')
                             ->directory('about-us')
                             ->required(),
-                        TextInput::make('our_story_video_source')
+                        FileUpload::make('our_story_video_source')
-                            ->label('Video Source URL')
+                            ->label('Video Source File')
-                            ->url()
+                            ->acceptedFileTypes(['video/mp4', 'video/webm', 'video/ogg'])
-                            ->maxLength(255)
+                            ->maxSize(102400) // 100MB
+                            ->disk('public')
+                            ->directory('about-us-videos')
                             ->required(),
                     ]),
 
@@ -160,49 +162,6 @@ class AboutPageSettings extends SettingsPage
                             ->collapsible(),
                     ]),
 
-                Section::make('Our Management Section')
-                    ->description("Manage the 'Our Management' team details on the About Us page.")
-                    ->icon('heroicon-o-briefcase')
-                    ->schema([
-                        TextInput::make('our_management_title')
-                            ->label('Title')
-                            ->required()
-                            ->maxLength(100),
-                        Textarea::make('our_management_subtitle')
-                            ->label('Subtitle')
-                            ->rows(2)
-                            ->maxLength(255)
-                            ->required(),
-                        Repeater::make('our_management_team')
-                            ->label('Team Members')
-                            ->schema([
-                                FileUpload::make('image')
-                                    ->label('Image')
-                                    ->image()
-                                    ->maxSize(2048)
-                                    ->disk('public')
-                                    ->directory('about-us-team')
-                                    ->required(),
-                                TextInput::make('name')
-                                    ->label('Name')
-                                    ->required()
-                                    ->maxLength(100),
-                                TextInput::make('title')
-                                    ->label('Title/Position')
-                                    ->required()
-                                    ->maxLength(100),
-                                Textarea::make('description')
-                                    ->label('Description')
-                                    ->rows(3)
-                                    ->maxLength(255)
-                                    ->required(),
-                            ])
-                            ->minItems(1)
-                            ->columns(1)
-                            ->reorderable()
-                            ->collapsible(),
-                    ]),
-
                 Section::make('Our Facilities Section')
                     ->description("Manage the 'Our Facilities' details on the About Us page.")
                     ->icon('heroicon-o-building-library')

app/Filament/Resources/TeamMemberResource.php

@@ -0,0 +1,94 @@
+<?php
+
+namespace App\Filament\Resources;
+
+use App\Filament\Resources\TeamMemberResource\Pages;
+use App\Filament\Resources\TeamMemberResource\RelationManagers;
+use App\Models\TeamMember;
+use Filament\Forms\Components\FileUpload;
+use Filament\Forms\Components\Textarea;
+use Filament\Forms\Components\TextInput;
+use Filament\Forms\Form;
+use Filament\Resources\Resource;
+use Filament\Tables;
+use Filament\Tables\Actions\ActionGroup;
+use Filament\Tables\Actions\DeleteAction;
+use Filament\Tables\Actions\EditAction;
+use Filament\Tables\Columns\ImageColumn;
+use Filament\Tables\Columns\TextColumn;
+use Filament\Tables\Table;
+use Illuminate\Database\Eloquent\Builder;
+use Illuminate\Database\Eloquent\SoftDeletingScope;
+
+class TeamMemberResource extends Resource
+{
+    protected static ?string $model = TeamMember::class;
+
+    protected static ?string $navigationIcon = 'heroicon-o-users';
+
+    protected static ?string $navigationGroup = 'CMS';
+
+    public static function form(Form $form): Form
+    {
+        return $form
+            ->schema([
+                TextInput::make('name')
+                    ->required()
+                    ->maxLength(255),
+                TextInput::make('title')
+                    ->required()
+                    ->maxLength(255),
+                Textarea::make('description')
+                    ->required()
+                    ->rows(5)
+                    ->maxLength(65535),
+                FileUpload::make('image')
+                    ->image()
+                    ->directory('team-members')
+                    ->maxSize(2048) // 2MB
+                    ->required(),
+            ]);
+    }
+
+    public static function table(Table $table): Table
+    {
+        return $table
+            ->columns([
+                TextColumn::make('name')
+                    ->searchable()
+                    ->sortable(),
+                TextColumn::make('title')
+                    ->searchable()
+                    ->sortable(),
+                ImageColumn::make('image'),
+            ])
+            ->filters([
+                //
+            ])
+            ->actions([
+                Tables\Actions\EditAction::make(),
+                Tables\Actions\DeleteAction::make(),
+            ])
+            ->bulkActions([
+                Tables\Actions\BulkActionGroup::make([
+                    Tables\Actions\DeleteBulkAction::make(),
+                ]),
+            ]);
+    }
+
+    public static function getRelations(): array
+    {
+        return [
+            //
+        ];
+    }
+
+    public static function getPages(): array
+    {
+        return [
+            'index' => Pages\ListTeamMembers::route('/'),
+            'create' => Pages\CreateTeamMember::route('/create'),
+            'edit' => Pages\EditTeamMember::route('/{record}/edit'),
+        ];
+    }
+}

app/Filament/Resources/TeamMemberResource/Pages/CreateTeamMember.php

@@ -0,0 +1,12 @@
+<?php
+
+namespace App\Filament\Resources\TeamMemberResource\Pages;
+
+use App\Filament\Resources\TeamMemberResource;
+use Filament\Actions;
+use Filament\Resources\Pages\CreateRecord;
+
+class CreateTeamMember extends CreateRecord
+{
+    protected static string $resource = TeamMemberResource::class;
+}

app/Filament/Resources/TeamMemberResource/Pages/EditTeamMember.php

@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Filament\Resources\TeamMemberResource\Pages;
+
+use App\Filament\Resources\TeamMemberResource;
+use Filament\Actions;
+use Filament\Resources\Pages\EditRecord;
+
+class EditTeamMember extends EditRecord
+{
+    protected static string $resource = TeamMemberResource::class;
+
+    protected function getHeaderActions(): array
+    {
+        return [
+            Actions\DeleteAction::make(),
+        ];
+    }
+}

app/Filament/Resources/TeamMemberResource/Pages/ListTeamMembers.php

@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Filament\Resources\TeamMemberResource\Pages;
+
+use App\Filament\Resources\TeamMemberResource;
+use Filament\Actions;
+use Filament\Resources\Pages\ListRecords;
+
+class ListTeamMembers extends ListRecords
+{
+    protected static string $resource = TeamMemberResource::class;
+
+    protected function getHeaderActions(): array
+    {
+        return [
+            Actions\CreateAction::make(),
+        ];
+    }
+}

app/Models/TeamMember.php

@@ -0,0 +1,10 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+class TeamMember extends Model
+{
+    //
+}

app/Settings/AboutSettings.php

@@ -29,11 +29,6 @@ class AboutSettings extends Settings
     public string $company_structure_advisor_name;
     public array $company_structure_departments; // [{name: "HSE", person: "Michael Brown"}]
 
-    // Our Management Section
-    public string $our_management_title;
-    public string $our_management_subtitle;
-    public array $our_management_team; // [{name: "John Smith", title: "CEO", description: "...", image: "..."}]
-
     // Our Facilities Section
     public string $our_facilities_title;
     public string $our_facilities_subtitle;

database/migrations/2025_07_29_141842_create_team_members_table.php

@@ -0,0 +1,31 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::create('team_members', function (Blueprint $table) {
+            $table->id();
+            $table->string('name');
+            $table->string('title');
+            $table->text('description');
+            $table->string('image'); // Store path to image
+            $table->timestamps();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::dropIfExists('team_members');
+    }
+};

resources/views/web/pages/about/index.blade.php

@@ -426,27 +426,27 @@ body {
                     </section>
                     <section class="mb-24">
                         <div class="text-center max-w-3xl mx-auto mb-12">
-                            <h2 class="text-3xl md:text-4xl font-bold tracking-tight mb-4 bg-clip-text text-transparent bg-gradient-to-r from-teal-500 to-purple-600">{{ $aboutSettings->our_management_title }}</h2>
+                            <h2 class="text-3xl md:text-4xl font-bold tracking-tight mb-4 bg-clip-text text-transparent bg-gradient-to-r from-teal-500 to-purple-600">Our Management</h2>
-                            <p class="text-lg text-gray-600">{{ $aboutSettings->our_management_subtitle }}</p>
+                            <p class="text-lg text-gray-600">Meet the leadership team driving our vision forward</p>
                         </div>
                         <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
-                            @foreach ($aboutSettings->our_management_team as $member)
+                            @foreach (App\Models\TeamMember::all() as $member)
                                 <div class="bg-white rounded-xl shadow-md hover:shadow-lg transition-shadow duration-300 overflow-hidden">
                                     <div class="relative h-56 w-full">
                                         <img
-                                            alt="{{ $member['name'] }}"
+                                            alt="{{ $member->name }}"
                                             loading="lazy"
                                             decoding="async"
                                             data-nimg="fill"
                                             class="object-cover"
-                                            src="{{ asset('storage/' . $member['image']) }}"
+                                            src="{{ asset('storage/' . $member->image) }}"
                                             style="position: absolute; height: 100%; width: 100%; inset: 0px; color: transparent;"
                                         />
                                     </div>
                                     <div class="p-6">
-                                        <h3 class="text-xl font-bold">{{ $member['name'] }}</h3>
+                                        <h3 class="text-xl font-bold">{{ $member->name }}</h3>
-                                        <p class="text-teal-600 text-sm font-medium mb-3">{{ $member['title'] }}</p>
+                                        <p class="text-teal-600 text-sm font-medium mb-3">{{ $member->title }}</p>
-                                        <p class="text-gray-600 text-sm mb-4">{{ $member['description'] }}</p>
+                                        <p class="text-gray-600 text-sm mb-4">{{ $member->description }}</p>
                                     </div>
                                 </div>
                             @endforeach
@@ -524,7 +524,7 @@ body {
                                         <p class="text-gray-600 mb-4">{{ $location['description'] }}</p>
                                         <div class="flex flex-wrap gap-2">
                                             @foreach ($location['tags'] as $tag)
-                                                <span class="bg-gray-100 text-gray-700 text-xs px-2 py-1 rounded-full">{{ $tag['value'] }}</span>
+                                                <span class="bg-gray-100 text-gray-700 text-xs px-2 py-1 rounded-full">{{ $tag }}</span>
                                             @endforeach
                                         </div>
                                     </div>
@@ -537,203 +537,4 @@ body {
         </div>
 
     </div>
-
-    <!-- Mission Area Start -->
-    <div class="mission__area section-padding">
-        <div class="container">
-            <div class="row">
-                <div class="col-lg-6 lg-mb-25">
-                    <div class="mission__area-left mr-40 xl-mr-0">
-                        <span class="subtitle wow fadeInLeft" data-wow-delay=".4s">Our Mission</span>
-                        <h2 class="title_split_anim">Dedicated to Delivering Value and Excellence</h2>
-                    </div>
-                </div>
-                <div class="col-lg-6">
-                    <div class="mission__area-right">
-                        <div class="row">
-                            <div class="col-md-6 md-mb-25 wow fadeInUp" data-wow-delay=".6s">
-                                <div class="experience__area-list-item">
-                                    <i class="flaticon-team"></i>
-                                    <div class="experience__area-list-item-content">
-                                        <h4>Project Planning</h4>
-                                        <p>Ensuring every detail is considered designing</p>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="col-md-6 wow fadeInUp" data-wow-delay=".9s">
-                                <div class="experience__area-list-item">
-                                    <i class="flaticon-technology"></i>
-                                    <div class="experience__area-list-item-content">
-                                        <h4>Labor Preparation</h4>
-                                        <p>We take pride in our quality craftsmanship</p>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-    <!-- Mission Area End -->
-    <!-- About Area Start -->
-    <div class="about__five section-padding pt-0">
-        <div class="container">
-            <div class="row al-center">
-                <div class="col-lg-5 lg-mb-25">
-                    <div class="about__five-image wow img_left_animation">
-                        <img src="/web/assets/img/about/about-4.jpg" alt="image">
-                    </div>
-                </div>
-                <div class="col-lg-7">
-                    <div class="about__five-right ml-70 xl-ml-0">
-                        <div class="about__five-right-title">
-                            <span class="subtitle wow fadeInLeft" data-wow-delay=".4s">About Our Company</span>
-                            <h2 class="title_split_anim">Trusted Partner in Construction and Design</h2>
-                        </div>
-                        <div class="features wow fadeInUp" data-wow-delay=".3s" style="background-image: url('/web/assets/img/portfolio/portfolio-8.jpg');">
-                            <h3>Building Trust<br>Since 1989</h3>
-                        </div>
-                        <p class="wow fadeInUp" data-wow-delay=".6s">Our journey began with a commitment to excellence, and that commitment remains at the core of our operations today. We’ve grown from a small local business into a trusted partner for both residential and commercial.</p>
-                        <div class="item_bounce">
-                            <a class="build_button mt-20" href="portfolio.html">See Projects<i class="flaticon-right-up"></i></a>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-    <!-- About Area End -->
-    <!-- Video Area Start -->
-    <div class="video__two" style="background-image: url('/web/assets/img/service/services-1.jpg');">
-        <div class="container">
-            <div class="row">
-                <div class="col-xl-12">
-                    <div class="video__two-icon item_bounce">
-                        <div class="video video-pulse">
-                            <a class="video-popup" href="https://youtube.com/watch?v=0WC-tD-njcA"><i class="fas fa-play"></i></a>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="scroll__slider">
-            <div class="text-slide">
-                <div class="sliders text_scroll">
-                    <ul>
-                        <li><img src="/web/assets/img/icon/star-dark.svg" alt="icon"><a href="portfolio-details">Residential</a></li>
-                        <li><img src="/web/assets/img/icon/star-dark.svg" alt="icon"><a href="portfolio-details">Architecture</a></li>
-                        <li><img src="/web/assets/img/icon/star-dark.svg" alt="icon"><a href="portfolio-details">Community</a></li>
-                        <li><img src="/web/assets/img/icon/star-dark.svg" alt="icon"><a href="portfolio-details">Healthcare</a></li>
-                        <li><img src="/web/assets/img/icon/star-dark.svg" alt="icon"><a href="portfolio-details">Seaside Resort</a></li>
-                        <li><img src="/web/assets/img/icon/star-dark.svg" alt="icon"><a href="portfolio-details">Modern</a></li>
-                    </ul>
-                </div>
-                <div class="sliders text_scroll">
-                    <ul>
-                        <li><img src="/web/assets/img/icon/star-dark.svg" alt="icon"><a href="portfolio-details">Residential</a></li>
-                        <li><img src="/web/assets/img/icon/star-dark.svg" alt="icon"><a href="portfolio-details">Architecture</a></li>
-                        <li><img src="/web/assets/img/icon/star-dark.svg" alt="icon"><a href="portfolio-details">Community</a></li>
-                        <li><img src="/web/assets/img/icon/star-dark.svg" alt="icon"><a href="portfolio-details">Healthcare</a></li>
-                        <li><img src="/web/assets/img/icon/star-dark.svg" alt="icon"><a href="portfolio-details">Seaside Resort</a></li>
-                        <li><img src="/web/assets/img/icon/star-dark.svg" alt="icon"><a href="portfolio-details">Modern</a></li>
-                    </ul>
-                </div>
-            </div>
-        </div>
-    </div>
-    <!-- Video Area End -->
-    <!-- Certification Area Start -->
-    <div class="certification section-padding pt-0">
-        <div class="container">
-            <div class="row">
-                <div class="col-xl-4 col-lg-5 lg-mb-25">
-                    <div class="certification-left section-padding pb-0">
-                        <span class="subtitle wow fadeInLeft" data-wow-delay=".4s">Industry Certifications</span>
-                        <h2 class="title_split_anim">Our Key Achievements Over the Years</h2>
-                    </div>
-                </div>
-                <div class="col-xl-8 col-lg-7">
-                    <div class="certification-right">
-                        <img class="wow img_top_animation" src="/web/assets/img/page/who-we-are.jpg" alt="image">
-                    </div>
-                </div>
-            </div>
-            <div class="row">
-                <div class="col-lg-12">
-                    <div class="counter__one-area mt-80">
-                        <div class="certification-right-counter">
-                            <h2><span class="counter">678</span>+</h2>
-                            <span>Complete Projects</span>
-                        </div>
-                        <div class="certification-right-counter">
-                            <h2><span class="counter">120</span>+</h2>
-                            <span>Team Members</span>
-                        </div>
-                        <div class="certification-right-counter">
-                            <h2><span class="counter">635</span>+</h2>
-                            <span>Client Reviews</span>
-                        </div>
-                        <div class="certification-right-counter">
-                            <h2><span class="counter">89</span>+</h2>
-                            <span>Winning Awards</span>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-    <!-- Certification Area End -->
-    <!-- Team Area Start -->
-    <div class="team__area section-padding">
-        <div class="container">
-            <div class="row mb-35">
-                <div class="col-xl-12">
-                    <div class="team__area-title t-center">
-                        <span class="subtitle wow fadeInLeft" data-wow-delay=".4s">Meet Our Experts</span>
-                        <h2 class="title_split_anim">Dedicated Professionals</h2>
-                    </div>
-                </div>
-            </div>
-            <div class="row">
-                <div class="col-lg-3 col-md-6 wow fadeInUp mt-25" data-wow-delay=".3s">
-                    <div class="team__area-item">
-                        <img class="img_full" src="/web/assets/img/team/team-1.jpg" alt="image">
-                        <div class="team__area-item-content t-center pt-20">
-                            <h5>Alan Dosan</h5>
-                            <span>Lead Architect</span>
-                        </div>
-                    </div>
-                </div>
-                <div class="col-lg-3 col-md-6 wow fadeInUp mt-25" data-wow-delay=".6s">
-                    <div class="team__area-item">
-                        <img class="img_full" src="/web/assets/img/team/team-2.jpg" alt="image">
-                        <div class="team__area-item-content t-center pt-20">
-                            <h5>Sarah Johnson</h5>
-                            <span>General Laborer</span>
-                        </div>
-                    </div>
-                </div>
-                <div class="col-lg-3 col-md-6 wow fadeInUp mt-25" data-wow-delay=".9s">
-                    <div class="team__area-item">
-                        <img class="img_full" src="/web/assets/img/team/team-3.jpg" alt="image">
-                        <div class="team__area-item-content t-center pt-20">
-                            <h5>Derya Kurtulus</h5>
-                            <span>Safety Inspector</span>
-                        </div>
-                    </div>
-                </div>
-                <div class="col-lg-3 col-md-6 wow fadeInUp mt-25" data-wow-delay="1.2s">
-                    <div class="team__area-item">
-                        <img class="img_full" src="/web/assets/img/team/team-4.jpg" alt="image">
-                        <div class="team__area-item-content t-center pt-20">
-                            <h5>Steve Rhodes</h5>
-                            <span>Civil Engineer</span>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-    <!-- Team Area End -->
 @stop