@extends('layouts.master')
@section('title','Connection Goal list')
@section('content')
<div class="container mt-4">
    <h4>Connection Goal List</h4>

    <!-- Search -->
    <form method="GET" action="{{ route('interests3.index') }}" class="row g-3 mb-4">
        <div class="col-md-4">
            <input type="text" name="search" value="{{ request('search') }}" class="form-control" placeholder="Search interest name">
        </div>
        <div class="col-md-2">
            <button type="submit" class="btn btn-primary">Search</button>
        </div>
    </form>
<!-- Add New Button -->
<div class="mb-3">
    <a href="{{ route('interests3.create') }}" class="btn btn-success">+ Add New Connection Goal</a>
</div>
@if (session('success'))
    <div class="alert alert-success alert-dismissible fade show" role="alert">
        {{ session('success') }}
        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
    </div>
@endif
    <!-- Interest Table -->
    <div class="card card-xy">
        <div class="card-body">
            <div class="table-responsive">
                <table class="table table-hover">
                    <thead>
                        <tr>
                            <th>
                                <a href="{{ route('interests3.index', array_merge(request()->all(), ['sortField' => 'name', 'sortDirection' => $sortDirection === 'asc' ? 'desc' : 'asc'])) }}">
                                    Name
                                </a>
                            </th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse ($interests as $interest)
                            <tr>
                                <td>{{ $interest->name }}</td>
                                <td>
                                    <a href="{{ route('interests3.edit', encrypt($interest->id)) }}" class="btn btn-sm btn-warning">Edit</a>
                                    <form action="{{ route('interests3.destroy', encrypt($interest->id)) }}" method="POST" style="display:inline;">
                                        @csrf
                                        @method('DELETE')
                                        <button class="btn btn-sm btn-danger" onclick="return confirm('Are you sure?')">Delete</button>
                                    </form>
                                </td>
                            </tr>
                        @empty
                            <tr><td colspan="2">No Preference found.</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <!-- Pagination -->
    <div class="d-flex justify-content-center">
    {{ $interests->links('pagination::bootstrap-5') }}
    </div>
</div>
@endsection