@extends('jobs.layout')

@section('title', $job->title)
@section('meta_description', \Illuminate\Support\Str::limit(strip_tags($job->description), 160))

@section('content')
<main class="job-detail-page preview-container">
    <nav class="job-breadcrumbs" aria-label="Breadcrumb">
        <a href="{{ route('home') }}">Home</a><span aria-hidden="true">/</span><a href="{{ route('jobs.index') }}">Find jobs</a><span aria-hidden="true">/</span><span>{{ $job->title }}</span>
    </nav>

    <header class="job-detail-heading">
        <div class="job-detail-company-mark">{{ \Illuminate\Support\Str::upper(\Illuminate\Support\Str::substr($job->employer->company_name, 0, 1)) }}</div>
        <div class="job-detail-title-group">
            <span class="preview-overline">{{ $job->employer->company_name }}</span>
            <h1>{{ $job->title }}</h1>
            <div class="job-detail-meta">
                <span>⌖ {{ collect([$job->town, $job->county?->name])->filter()->join(', ') ?: 'Flexible location' }}</span>
                <span>{{ str($job->employment_type)->replace('_', ' ')->title() }}</span>
                <span>{{ str($job->work_mode)->replace('_', ' ')->title() }}</span>
                @if ($job->category)<span>{{ $job->category->name }}</span>@endif
            </div>
        </div>
        @if ($job->salary_min || $job->salary_max)
            <div class="job-detail-salary"><small>Salary range</small><strong>{{ $job->salary_currency }} {{ $job->salary_min ? number_format((float) $job->salary_min) : '—' }} – {{ $job->salary_max ? number_format((float) $job->salary_max) : '—' }}</strong></div>
        @endif
    </header>

    <img class="job-detail-cover" src="{{ $job->cover_image_path ? route('content.image', ['type' => 'job', 'record' => $job->id]) : asset('images/job-listing-default.png') }}" alt="Image for {{ $job->title }}">

    <div class="job-detail-grid">
        <div class="job-detail-main">
            <article class="job-detail-panel">
                <h2>About the role</h2>
                <div class="job-detail-prose">{{ $job->description }}</div>
                @if ($job->responsibilities)<section class="job-detail-section"><h3>Responsibilities</h3><div class="job-detail-prose">{{ $job->responsibilities }}</div></section>@endif
                @if ($job->requirements)<section class="job-detail-section"><h3>Requirements</h3><div class="job-detail-prose">{{ $job->requirements }}</div></section>@endif
            </article>

            @if ($job->employer->description)
                <article class="job-detail-panel">
                    <h2>About {{ $job->employer->company_name }}</h2>
                    <div class="job-detail-prose">{{ $job->employer->description }}</div>
                    @if ($job->employer->website)<a class="job-detail-company-link" href="{{ $job->employer->website }}" target="_blank" rel="noopener noreferrer">Visit company website <span aria-hidden="true">↗</span></a>@endif
                </article>
            @endif
        </div>

        <aside class="job-detail-aside">
            <section class="job-detail-panel">
                <h2>Job details</h2>
                <dl class="job-facts">
                    <div><dt>Company</dt><dd>{{ $job->employer->company_name }}</dd></div>
                    @if ($job->career_level)<div><dt>Career level</dt><dd>{{ $job->career_level }}</dd></div>@endif
                    <div><dt>Work arrangement</dt><dd>{{ str($job->work_mode)->replace('_', ' ')->title() }}</dd></div>
                    @if ($job->application_deadline)<div><dt>Apply by</dt><dd>{{ $job->application_deadline->format('d M Y') }}</dd></div>@endif
                </dl>
            </section>

            @auth
                @if (auth()->user()->hasRole(\App\Enums\UserRole::JobSeeker))
                    <section class="job-detail-panel job-action-panel">
                        @if ($isSaved)
                            <p class="job-saved-note">This job is in your saved list.</p>
                            <form method="POST" action="{{ route('seeker.saved-jobs.remove', $job) }}">@csrf @method('DELETE')<button class="jobs-outline-button jobs-full-button" type="submit">Remove saved job</button></form>
                        @else
                            <form method="POST" action="{{ route('seeker.jobs.save', $job) }}">@csrf<button class="jobs-outline-button jobs-full-button" type="submit">♡ &nbsp;Save job</button></form>
                        @endif

                        <h2>Interested in this role?</h2>
                        <p>Apply to {{ $job->employer->company_name }} using your profile.</p>
                        <form method="POST" action="{{ route('seeker.apply', $job) }}" class="job-apply-form">
                            @csrf
                            @if ($errors->any())<div class="jobs-alert" role="alert">{{ $errors->first() }}</div>@endif
                            @if ($resumes->isNotEmpty())
                                <label for="resume_id">Attach a saved CV <span>(optional)</span></label>
                                <select class="jobs-form-control" id="resume_id" name="resume_id">
                                    <option value="">No CV</option>
                                    @foreach ($resumes as $resume)
                                        <option value="{{ $resume->id }}" @selected(old('resume_id', $resume->is_primary ? $resume->id : '') == $resume->id)>{{ $resume->label ?: $resume->original_filename }}{{ $resume->is_primary ? ' (Primary)' : '' }}</option>
                                    @endforeach
                                </select>
                            @else
                                <p class="job-apply-hint">You can add a CV in <a href="{{ route('seeker.applications') }}">My applications</a>, or apply without one.</p>
                            @endif
                            <label for="cover_letter">Cover letter <span>(optional)</span></label>
                            <textarea class="jobs-form-control" id="cover_letter" name="cover_letter" rows="5" maxlength="10000" placeholder="Introduce yourself to the employer...">{{ old('cover_letter') }}</textarea>
                            <button class="jobs-primary-button jobs-full-button" type="submit">Submit application <span aria-hidden="true">→</span></button>
                        </form>
                    </section>
                @else
                    <section class="job-detail-panel job-action-panel">
                        <h2>Interested in this role?</h2>
                        <p>Sign in with a job seeker account to apply.</p>
                        <a class="jobs-primary-button jobs-full-button" href="{{ route('seeker.login') }}">Job seeker sign in</a>
                    </section>
                @endif
            @else
                <section class="job-detail-panel job-action-panel">
                    <h2>Interested in this role?</h2>
                    <p>Create a job seeker profile or sign in to apply.</p>
                    <a class="jobs-primary-button jobs-full-button" href="{{ route('seeker.login') }}">Sign in to apply</a>
                    <a class="jobs-outline-button jobs-full-button" href="{{ route('seeker.register') }}">Create profile</a>
                </section>
            @endauth
        </aside>
    </div>
</main>
@endsection