@page "/"
@using NimbusFlow.Frontend.Services
@using NimbusFlow.Frontend.Models
@inject IApiService ApiService

<PageTitle>NimbusFlow Dashboard</PageTitle>

<h1 class="nimbus-page-title">
    <i class="bi bi-speedometer2 me-3"></i>NimbusFlow Dashboard
</h1>

<div class="row g-4">
    <div class="col-md-3">
        <div class="card nimbus-dashboard-card card-members mb-3">
            <div class="card-header d-flex align-items-center">
                <i class="bi bi-people-fill me-2"></i>
                Active Members
            </div>
            <div class="card-body text-center">
                <h2 class="card-title mb-0">@activeMemberCount</h2>
                <small class="opacity-75">Currently Active</small>
            </div>
        </div>
    </div>
    
    <div class="col-md-3">
        <div class="card nimbus-dashboard-card card-schedules mb-3">
            <div class="card-header d-flex align-items-center">
                <i class="bi bi-calendar-event-fill me-2"></i>
                Pending Schedules
            </div>
            <div class="card-body text-center">
                <h2 class="card-title mb-0">@pendingScheduleCount</h2>
                <small class="opacity-75">Awaiting Response</small>
            </div>
        </div>
    </div>
    
    <div class="col-md-3">
        <div class="card nimbus-dashboard-card card-services mb-3">
            <div class="card-header d-flex align-items-center">
                <i class="bi bi-calendar-plus-fill me-2"></i>
                Upcoming Services
            </div>
            <div class="card-body text-center">
                <h2 class="card-title mb-0">@upcomingServiceCount</h2>
                <small class="opacity-75">This Week</small>
            </div>
        </div>
    </div>
</div>

<div class="row mt-5">
    <div class="col-md-12">
        <div class="nimbus-quick-actions">
            <h5><i class="bi bi-lightning-charge me-2"></i>Quick Actions</h5>
            
            <a href="/schedules/schedule-next" class="btn btn-nimbus-primary me-3 mb-2">
                <i class="bi bi-calendar-plus-fill me-2"></i>Schedule Next Member
            </a>
            
            <a href="/members" class="btn btn-success me-3 mb-2">
                <i class="bi bi-person-plus-fill me-2"></i>Add New Member
            </a>
            
            <a href="/services" class="btn btn-outline-warning me-3 mb-2">
                <i class="bi bi-gear-wide-connected me-2"></i>Create New Service
            </a>
            
            <a href="/schedules" class="btn btn-outline-secondary me-3 mb-2">
                <i class="bi bi-list-check me-2"></i>View All Schedules
            </a>
        </div>
    </div>
</div>

@code {
    private int activeMemberCount = 0;
    private int pendingScheduleCount = 0;
    private int upcomingServiceCount = 0;

    protected override async Task OnInitializedAsync()
    {
        try
        {
            // Load dashboard data
            var members = await ApiService.GetMembersAsync();
            activeMemberCount = members.Count(m => m.IsActive == 1);

            var schedules = await ApiService.GetSchedulesAsync();
            pendingScheduleCount = schedules.Count(s => s.Status == "pending");

            var services = await ApiService.GetServicesAsync();
            upcomingServiceCount = services.Count(s => s.ServiceDate >= DateTime.Today);

        }
        catch (Exception ex)
        {
            // Handle API errors gracefully
            Console.WriteLine($"Error loading dashboard data: {ex.Message}");
        }
    }
}