@extends('user.layouts.app')

@section('content')
    <nav class="page-breadcrumb">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Billing</a></li>
            <li class="breadcrumb-item active" aria-current="page">Plan Details</li>
        </ol>
    </nav>
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-4">
                        <div>
                            <h4 class="mb-1">Plan</h4>
                            <h3>{{ $currentPlan ? $currentPlan->name : 'No Plan' }}</h3>
                            <p class="text-muted">Lifetime subscription</p>
                            <p class="text-primary">Get a promo code?</p>
                        </div>
                        <div class="text-end">
                            <h4>Monthly Cost</h4>
                            <h3>${{ $currentPlan ? number_format($currentPlan->price, 2) : '0' }}.Concurrent / month</h3>
                            <p class="text-muted">No renewal on this plan</p>
                        </div>
                    </div>

                    <div class="row">
                        <!-- Workspaces -->
                        <div class="col-md-4 mb-3">
                            <div class="d-flex justify-content-between">
                                <p>Workspaces</p>
                                <p>{{ $workspaceCount }} ({{ $currentPlan ? round(($workspaceCount / max($currentPlan->workspaces, 1)) * 100) : 0 }}%)</p>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-primary" role="progressbar" style="width: {{ $currentPlan ? round(($workspaceCount / max($currentPlan->workspaces, 1)) * 100) : 0 }}%" aria-valuenow="{{ $currentPlan ? round(($workspaceCount / max($currentPlan->workspaces, 1)) * 100) : 0 }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <div class="d-flex justify-content-between mt-1">
                                <span></span>
                                <span>{{ $currentPlan ? $currentPlan->workspaces : 0 }}</span>
                            </div>
                        </div>

                        <!-- Users -->
                        <div class="col-md-4 mb-3">
                            <div class="d-flex justify-content-between">
                                <p>Users</p>
                                <p>{{ $teammateCount }} ({{ $currentPlan ? round(($teammateCount / max($currentPlan->teammates, 1)) * 100) : 0 }}%)</p>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-primary" role="progressbar" style="width: {{ $currentPlan ? round(($teammateCount / max($currentPlan->teammates, 1)) * 100) : 0 }}%" aria-valuenow="{{ $currentPlan ? round(($teammateCount / max($currentPlan->teammates, 1)) * 100) : 0 }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <div class="d-flex justify-content-between mt-1">
                                <span></span>
                                <span>{{ $currentPlan ? $currentPlan->teammates : 0 }}</span>
                            </div>
                        </div>

                        <!-- Social Profiles -->
                        <div class="col-md-4 mb-3">
                            <div class="d-flex justify-content-between">
                                <p>Social Profiles</p>
                                <p>{{ $socialProfileCount }} ({{ $currentPlan ? round(($socialProfileCount / max($currentPlan->social_profiles, 1)) * 100) : 0 }}%)</p>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-primary" role="progressbar" style="width: {{ $currentPlan ? round(($socialProfileCount / max($currentPlan->social_profiles, 1)) * 100) : 0 }}%" aria-valuenow="{{ $currentPlan ? round(($socialProfileCount / max($currentPlan->social_profiles, 1)) * 100) : 0 }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <div class="d-flex justify-content-between mt-1">
                                <span></span>
                                <span>{{ $currentPlan ? $currentPlan->social_profiles : 0 }}</span>
                            </div>
                        </div>

                        <!-- AI Credits -->
                        <div class="col-md-4 mb-3">
                            <div class="d-flex justify-content-between">
                                <p>AI Credits</p>
                                <p>{{ $userCredit->subscription_credits + $userCredit->purchased_credits }}</p>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-primary" role="progressbar" style="width: 0%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <div class="d-flex justify-content-between mt-1">
                                <span></span>
                                <span>Unlimited</span>
                            </div>
                        </div>

                        <!-- Storage -->
                        <div class="col-md-4 mb-3">
                            <div class="d-flex justify-content-between">
                                <p>Storage (GB)</p>
                                <p>{{ $storageUsed }} ({{ $currentPlan ? round(($storageUsed / max($currentPlan->storage / 1000, 1)) * 100) : 0 }}%)</p>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-primary" role="progressbar" style="width: {{ $currentPlan ? round(($storageUsed / max($currentPlan->storage / 1000, 1)) * 100) : 0 }}%" aria-valuenow="{{ $currentPlan ? round(($storageUsed / max($currentPlan->storage / 1000, 1)) * 100) : 0 }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <div class="d-flex justify-content-between mt-1">
                                <span></span>
                                <span>{{ $currentPlan ? $currentPlan->storage / 1000 : 0 }}</span>
                            </div>
                        </div>

                        <!-- Automation Runs -->
                        <div class="col-md-4 mb-3">
                            <div class="d-flex justify-content-between">
                                <p>Automation Runs</p>
                                <p>{{ $automationRunCount }} ({{ $currentPlan ? round(($automationRunCount / max($currentPlan->workflows, 1)) * 100) : 0 }}%)</p>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-primary" role="progressbar" style="width: {{ $currentPlan ? round(($automationRunCount / max($currentPlan->workflows, 1)) * 100) : 0 }}%" aria-valuenow="{{ $currentPlan ? round(($automationRunCount / max($currentPlan->workflows, 1)) * 100) : 0 }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <div class="d-flex justify-content-between mt-1">
                                <span></span>
                                <span>{{ $currentPlan ? $currentPlan->workflows : 0 }}</span>
                            </div>
                        </div>

                        <!-- Editor Plugins -->
                        <div class="col-md-4 mb-3">
                            <div class="d-flex justify-content-between">
                                <p>Editor Plugins</p>
                                <p>{{ $currentPlan && $currentPlan->editor_plugins ? 'Enabled' : 'Disabled' }}</p>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-primary" role="progressbar" style="width: {{ $currentPlan && $currentPlan->editor_plugins ? 100 : 0 }}%" aria-valuenow="{{ $currentPlan && $currentPlan->editor_plugins ? 100 : 0 }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                        </div>

                        <!-- Copywriting in Different Languages -->
                        <div class="col-md-4 mb-3">
                            <div class="d-flex justify-content-between">
                                <p>Copywriting in Different Languages</p>
                                <p>{{ $currentPlan && $currentPlan->multilingual_copywriting ? 'Enabled' : 'Disabled' }}</p>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-primary" role="progressbar" style="width: {{ $currentPlan && $currentPlan->multilingual_copywriting ? 100 : 0 }}%" aria-valuenow="{{ $currentPlan && $currentPlan->multilingual_copywriting ? 100 : 0 }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                        </div>

                        <!-- Ecommerce Products -->
                        <div class="col-md-4 mb-3">
                            <div class="d-flex justify-content-between">
                                <p>Ecommerce Products</p>
                                <p>{{ $ecommerceProductCount }} ({{ $currentPlan ? round(($ecommerceProductCount / max($currentPlan->ecommerce_products, 1)) * 100) : 0 }}%)</p>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-primary" role="progressbar" style="width: {{ $currentPlan ? round(($ecommerceProductCount / max($currentPlan->ecommerce_products, 1)) * 100) : 0 }}%" aria-valuenow="{{ $currentPlan ? round(($ecommerceProductCount / max($currentPlan->ecommerce_products, 1)) * 100) : 0 }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <div class="d-flex justify-content-between mt-1">
                                <span></span>
                                <span>{{ $currentPlan ? $currentPlan->ecommerce_products : 0 }}</span>
                            </div>
                        </div>

                        <!-- Advanced Analytics -->
                        <div class="col-md-4 mb-3">
                            <div class="d-flex justify-content-between">
                                <p>Advanced Analytics</p>
                                <p>{{ $currentPlan && $currentPlan->advanced_analytics ? 'Enabled' : 'Disabled' }}</p>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-primary" role="progressbar" style="width: {{ $currentPlan && $currentPlan->advanced_analytics ? 100 : 0 }}%" aria-valuenow="{{ $currentPlan && $currentPlan->advanced_analytics ? 100 : 0 }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                        </div>

                        <!-- Branded Reports -->
                        <div class="col-md-4 mb-3">
                            <div class="d-flex justify-content-between">
                                <p>Branded Reports</p>
                                <p>{{ $currentPlan && $currentPlan->branded_reports ? 'Enabled' : 'Disabled' }}</p>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-primary" role="progressbar" style="width: {{ $currentPlan && $currentPlan->branded_reports ? 100 : 0 }}%" aria-valuenow="{{ $currentPlan && $currentPlan->branded_reports ? 100 : 0 }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                        </div>

                        <!-- REST API -->
                        <div class="col-md-4 mb-3">
                            <div class="d-flex justify-content-between">
                                <p>REST API</p>
                                <p>{{ $currentPlan && $currentPlan->api_access ? 'Enabled' : 'Disabled' }}</p>
                            </div>
                            <div class="progress">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-primary" role="progressbar" style="width: {{ $currentPlan && $currentPlan->api_access ? 100 : 0 }}%" aria-valuenow="{{ $currentPlan && $currentPlan->api_access ? 100 : 0 }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                        </div>
                    </div>

                    <div class="text-center mt-4">
                        <a href="{{ route('user.setting.plans.upgrade') }}" class="btn btn-primary">Upgrade Plan</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection