@extends('layouts.app')

@section('title', ucfirst($source->name))

@push('styles')
<style>
    .home_1 { border-bottom: 0!important; }
    .info-card { 
        background: #f8f9fa; 
        padding: 15px; 
        border-radius: 5px; 
        margin-bottom: 15px; 
    }
    .info-label { 
        font-weight: 600; 
        color: #495057;
        margin-bottom: 5px;
    }
    .info-value { 
        color: #212529; 
    }
</style>
@endpush

@section('content')
<div class="loadPages01">
    <div class="card card-body card-dashboard-twentyfive border-left-0 border-right-0 p-0 viewPage">
        <div class="align-items-stretch">
            <div class="col-md-12 view-pro-details01 pl-2 py-3">
                <div class="row align-items-center">
                    <div class="col-md-6 profile-div01">
                        <div class="sender-details d-flex justify-content-between mb-0">
                            <div class="details mr-auto">
                                <p class="msg-name">{{ ucfirst($source->name) }}</p>
                                <p class="msg-date pb-1">
                                    Type: <span style="font-weight: 600;">{{ ucfirst(str_replace('_', ' ', $source->source_type)) }}</span>
                                </p>
                                <p class="msg-date mb-0">
                                    @if($source->identifier)
                                    Identifier: <span style="font-weight: 600;">{{ $source->identifier }}</span>
                                    @endif
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6 profile-div02">
                        <div class="row">
                            @can('ticket_source.edit')
                            <div class="col-auto ml-auto">
                                <a href="{{ route('ticket-sources.index') }}" class="btn btn-primary btn-sm">
                                    <i class="las la-arrow-left"></i> Back to List
                                </a>
                            </div>
                            @endcan
                        </div>
                    </div>
                </div>
            </div>

            <div class="card bd-0 viewPageTabs">
                <div class="mail-view personal-div01 mx-2 bg-white">
                    <div class="message-body py-3 px-2">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="info-card">
                                    <div class="info-label">Name</div>
                                    <div class="info-value">{{ $source->name }}</div>
                                </div>
                            </div>
                            
                            <div class="col-md-6">
                                <div class="info-card">
                                    <div class="info-label">Source Type</div>
                                    <div class="info-value">{{ ucfirst(str_replace('_', ' ', $source->source_type)) }}</div>
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="info-card">
                                    <div class="info-label">Identifier</div>
                                    <div class="info-value">{{ $source->identifier ?? '--' }}</div>
                                </div>
                            </div>

                            <div class="col-md-3">
                                <div class="info-card">
                                    <div class="info-label">Is Active</div>
                                    <div class="info-value">
                                        {!! $source->is_active 
                                            ? '<span class="badge badge-success">Active</span>' 
                                            : '<span class="badge badge-secondary">Inactive</span>' 
                                        !!}
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-3">
                                <div class="info-card">
                                    <div class="info-label">Status</div>
                                    <div class="info-value">
                                        @php
                                            $statusBadges = [
                                                'active' => '<span class="badge badge-success">Active</span>',
                                                'inactive' => '<span class="badge badge-secondary">Inactive</span>',
                                                'error' => '<span class="badge badge-danger">Error</span>',
                                            ];
                                        @endphp
                                        {!! $statusBadges[$source->status] ?? '<span class="badge badge-secondary">Unknown</span>' !!}
                                    </div>
                                </div>
                            </div>

                            @if($source->config)
                            <div class="col-md-12">
                                <div class="info-card">
                                    <div class="info-label">Configuration</div>
                                    <div class="info-value">
                                        <pre style="background: #fff; padding: 10px; border: 1px solid #dee2e6; border-radius: 4px; max-height: 300px; overflow-y: auto;">{{ json_encode($source->config, JSON_PRETTY_PRINT) }}</pre>
                                    </div>
                                </div>
                            </div>
                            @endif

                            <div class="col-md-6">
                                <div class="info-card">
                                    <div class="info-label">Created At</div>
                                    <div class="info-value">{{ formatDateTime($source->created_at) }}</div>
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="info-card">
                                    <div class="info-label">Updated At</div>
                                    <div class="info-value">{{ formatDateTime($source->updated_at) }}</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
$(function() {
    'use strict'
});
</script>
@endpush