@extends('layouts.nova')

@php($gridV2 = request()->query('grid') === 'v2')

@section('content')
<div class="container-fluid legacy-page">
    <div class="effect2 page-header-wrap">
        <header class="page-heading">
            <h1 class="page-header">Profile: {{ $user->uname }}</h1>
            <p>{{ $user->name ?? '' }}</p>
        </header>
    </div>

    <div class="row">
        <div class="col-md-8">
            <div class="panel panel-default effect2">
                <div class="panel-heading"><strong>Newest Artworks</strong></div>
                <div class="panel-body">
                    <div class="{{ $gridV2 ? 'gallery' : 'gallery-grid' }}" data-nova-gallery data-gallery-type="profile" data-gallery-grid>
                        @foreach($artworks as $art)
                            <x-artwork-card :art="$art" />
                        @endforeach
                    </div>
                    <div class="hidden" data-gallery-skeleton-template aria-hidden="true">
                        <x-skeleton.artwork-card />
                    </div>
                    <div class="hidden mt-8" data-gallery-skeleton></div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="panel panel-default effect2">
                <div class="panel-heading"><strong>User</strong></div>
                <div class="panel-body">
                    <img src="{{ \App\Support\AvatarUrl::forUser((int) $user->user_id, null, 128) }}" class="img-responsive" style="max-width:120px;" alt="{{ $user->uname }}">
                    <h3>{{ $user->uname }}</h3>
                    <p>{{ $user->about_me ?? '' }}</p>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script src="/js/legacy-gallery-init.js" defer></script>
@endpush