@extends('layouts.admin.app')

@section('title', __('pages/admin/subscription.heading.singular'))

@section('content')
<div
    class="animate-fade-in"
    x-data="userSubscriptionsPage({
        cancelUrl: @js(route('admin.subscriptions.user.cancel', $user->id)),
        cancelNowUrl: @js(route('admin.subscriptions.user.cancel-now', $user->id)),
        messages: @js(array_merge(trans('pages/admin/subscription.cancel'), [
            'confirm' => __('buttons.cancel'),
        ])),
    })">

    <div class="px-4 py-4">
        <x-layouts.admin.breadcrumb :items="[
            ['label' => __('pages/admin/subscription.section')],
            ['label' => __('pages/admin/subscription.heading.plural'), 'href' => route('admin.subscriptions.index')],
            ['label' => $user->full_name ?? $user->email],
        ]" />
    </div>

    <div class="px-6 pb-6 space-y-6">
        <section class="rounded-2xl border border-border bg-card p-6">
            <h2 class="text-base font-semibold text-foreground">{{ __('pages/admin/subscription.user_detail.current') }}</h2>

            @if($current)
            <div class="mt-5 grid gap-4 sm:grid-cols-2 lg:grid-cols-3 text-sm">
                <div>
                    <div class="text-xs uppercase tracking-wider text-muted-foreground">{{ __('pages/admin/subscription.table.plan') }}</div>
                    <div class="mt-1 font-medium">{{ $currentPlan?->name ?? __('pages/common.empty') }}</div>
                </div>
                <div>
                    <div class="text-xs uppercase tracking-wider text-muted-foreground">{{ __('form.label.status') }}</div>
                    <div class="mt-1 font-medium">{{ \App\Support\SubscriptionStatusLabel::for($current->stripe_status) }}</div>
                </div>
                <div>
                    <div class="text-xs uppercase tracking-wider text-muted-foreground">{{ __('pages/admin/plan.table.duration') }}</div>
                    <div class="mt-1 font-medium">
                        {{ $currentPlan?->formatted_duration ?? __('pages/common.empty') }}
                    </div>
                </div>
                @if($currentPlan?->price)
                <div>
                    <div class="text-xs uppercase tracking-wider text-muted-foreground">{{ __('pages/admin/plan.table.price') }}</div>
                    <div class="mt-1 font-medium">
                        <x-plan-price :plan="$currentPlan" />
                    </div>
                </div>
                @endif
                <div>
                    <div class="text-xs uppercase tracking-wider text-muted-foreground">{{ __('pages/admin/subscription.table.stripe_subscription') }}</div>
                    <div class="mt-1 font-mono text-xs">{{ $current->stripe_id }}</div>
                </div>
                <div>
                    <div class="text-xs uppercase tracking-wider text-muted-foreground">{{ __('pages/admin/subscription.user_detail.stripe_customer') }}</div>
                    <div class="mt-1 font-mono text-xs">{{ $user->stripe_id ?? __('pages/common.empty') }}</div>
                </div>
                <div>
                    @php
                    if ($current->onTrial()) {
                    $dateLabel = __('pages/admin/subscription.user_detail.trial_ends_at');
                    } elseif ($current->canceled()) {
                    $dateLabel = __('pages/admin/subscription.user_detail.subscription_ends_at');
                    } else {
                    $dateLabel = __('pages/admin/subscription.user_detail.next_billing_date');
                    }
                    @endphp
                    <div class="text-xs uppercase tracking-wider text-muted-foreground">{{ $dateLabel }}</div>
                    @php
                    $nextBilling = \App\Support\SubscriptionPlanResolver::nextBillingDate($current);
                    $displayDate = $nextBilling ?? $current->ends_at;
                    @endphp
                    <div class="mt-1 font-medium">{{ $displayDate?->format('M d, Y') ?? __('pages/common.empty') }}</div>
                </div>
                <div>
                    <div class="text-xs uppercase tracking-wider text-muted-foreground">{{ __('pages/admin/subscription.user_detail.grace_period') }}</div>
                    <div class="mt-1 font-medium">{{ $current->onGracePeriod() ? __('buttons.yes') : __('buttons.no') }}</div>
                </div>
            </div>

            <div class="mt-6 flex items-center gap-3">
                @if($current->valid() && ! $current->canceled())
                <button
                    type="button"
                    class="inline-flex items-center justify-center rounded-xl bg-amber-600 px-4 py-2.5 text-sm font-semibold text-white hover:bg-amber-700"
                    x-on:click="cancelPeriodEnd()">
                    {{ __('pages/admin/subscription.cancel.period_end') }}
                </button>
                @endif

                @if($current->valid() && ! $current->canceled())
                <button
                    type="button"
                    class="inline-flex items-center justify-center rounded-xl bg-red-600 px-4 py-2.5 text-sm font-semibold text-white hover:bg-red-700"
                    x-on:click="cancelImmediately()">
                    {{ __('pages/admin/subscription.cancel.now') }}
                </button>
                @endif
            </div>
            @else
            <div class="mt-4 text-sm text-muted-foreground">{{ __('pages/admin/subscription.user_detail.no_subscription') }}</div>
            @endif
        </section>

        <section class="rounded-2xl border border-border bg-card">
            <div class="border-b border-border px-6 py-4">
                <h2 class="text-base font-semibold text-foreground">{{ __('pages/admin/subscription.user_detail.history') }}</h2>
            </div>
            <div class="overflow-x-auto">
                <table class="min-w-full text-left text-sm">
                    <thead class="border-b border-border bg-muted/20 text-xs uppercase tracking-wider text-muted-foreground">
                        <tr>
                            <th class="px-6 py-3">{{ __('form.label.status') }}</th>
                            <th class="px-6 py-3">{{ __('pages/admin/subscription.table.stripe_id') }}</th>
                            <th class="px-6 py-3">{{ __('pages/admin/subscription.table.stripe_price') }}</th>
                            <th class="px-6 py-3">{{ __('pages/admin/subscription.table.started') }}</th>
                            <th class="px-6 py-3">{{ __('pages/admin/subscription.table.next_billing_date') }}</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-border/60">
                        @foreach($history as $sub)
                        <tr>
                            <td class="px-6 py-3">{{ \App\Support\SubscriptionStatusLabel::for($sub->stripe_status) }}</td>
                            <td class="px-6 py-3">
                                <x-utility.tooltip text="{{ $sub->stripe_id }}" position="top">
                                    <span class="font-mono text-xs cursor-help border-b border-dashed border-surface-400">
                                        {{ str($sub->stripe_id)->limit(12) }}
                                    </span>
                                </x-utility.tooltip>
                            </td>
                            <td class="px-6 py-3">
                                <x-utility.tooltip text="{{ $sub->stripe_price ?? __('pages/common.empty') }}" position="top">
                                    <span class="font-mono text-xs cursor-help border-b border-dashed border-surface-400">
                                        @php
                                        $plan = $sub->stripe_price ? \App\Support\SubscriptionPlanResolver::planForStripePrice($sub->stripe_price) : null;
                                        @endphp
                                        {{ $plan?->name ?? (str($sub->stripe_price)->limit(12) ?? __('pages/common.empty')) }}
                                    </span>
                                </x-utility.tooltip>
                            </td>
                            <td class="px-6 py-3">{{ $sub->created_at?->format('M d, Y') ?? __('pages/common.empty') }}</td>
                            <td class="px-6 py-3">
                                @php
                                $nextBilling = \App\Support\SubscriptionPlanResolver::nextBillingDate($sub);
                                $displayDate = $nextBilling ?? $sub->ends_at;
                                @endphp
                                {{ $displayDate?->format('M d, Y') ?? __('pages/common.empty') }}
                            </td>
                        </tr>
                        @endforeach
                        @if($history->isEmpty())
                        <tr>
                            <td colspan="5" class="px-6 py-10 text-center text-sm text-muted-foreground">
                                {{ __('pages/admin/subscription.user_detail.no_history') }}
                            </td>
                        </tr>
                        @endif
                    </tbody>
                </table>
            </div>
        </section>
    </div>
</div>

<x-alert-dialog />
@endsection

@push('before-app-js')
@vite(['resources/js/admin/subscription/user-subscriptions.js'])
@endpush