@extends('layouts.user.account')

@section('page_title', __('giveaway.add-images-title'))

@section('page_content')
    <x-page-content pageTitle="{{ __('giveaway.add-images-title') }}">
        <x-slot:pageCaption>
            {{ __('giveaway.add-images-desc') }}
        </x-slot:pageCaption>
        <x-slot:pageTabs>
            <x-user.tabs>
                <x-user.tab-item link="{{ route('user.giveaway.edit', $giveawayId) }}" labelText="{{ __('giveaway.ga-details') }}"></x-user.tab-item>
                <x-user.tab-item :active="true" link="{{ route('user.giveaway.images', $giveawayId) }}" labelText="{{ __('labels.prize-images') }}"></x-user.tab-item>
                <x-user.tab-item labelText="{{ __('labels.actions') }}" link="{{ route('user.giveaway.entry-actions', $giveawayId) }}"></x-user.tab-item>
            </x-user.tabs>
        </x-slot:pageTabs>
        
        <div class="block">
            <div class="mb-4">
                <x-user.content-header>
                    {{ __('labels.prize-images') }}
                </x-user.content-header>
            </div>
    
            <x-user.sided-content>
                <livewire:forms.user.giveaway.giveaway-images-form/>
    
                <x-slot:sidedContent>
                    <x-info-card iconName="gift-01" title="{{ __('giveaway.ga-images-form-helper.title') }}">
                        <x-slot:content>
                            {{ __('giveaway.ga-images-form-helper.caption') }}
                        </x-slot:content>
                    </x-info-card>
                </x-slot:sidedContent>
            </x-user.sided-content>
        </div>
    </x-page-content>
@endsection