@push('head')
<link rel="stylesheet" href="{{ mix("css/product.css") }}">
@endpush

@extends('layouts.app')

@section('title', $product->name)

@push('head')
<link rel="stylesheet" href="{{ mix("css/login.css") }}">
@endpush

@section('main')
    <div class="product-container">
        <div class="product-container-left">
            <img class="product-image" src="@if(isset($product->images[0])) {{ $product->images[0]->URL() }} @else {{ asset("test.txt") }} @endif">
            {{ dd($product->categories[0]->name) }}
            <div class="name-price-container">
                <h2 class="product-name"> {{ $product->name }} </h2>
                <h3>{{ ($product->price) }}<span class="price-currency">zł</span></h3>
            </div>
            <div class="product-commands">
                @auth
                @if(!Auth::user()->cart()->find($product))
                    <form method="POST" action="{{ route("addToCart", $product) }}"> 
                        <button type="submit">Add to cart</button>
                        @csrf
                    </form> 
                    @else
                    <form method="POST" action="{{ route("removeFromCart", $product) }}"> 
                        <button type="submit">Remove from cart</button>
                        @csrf
                    </form>
                @endif
                @if(Auth::user()->isAdmin())
                    <div class="admin-menu">
                        <a href="{{ route("product.edit", $product) }}">
                            <button class="admin-menu-button">Edit</button>
                        </a>
                        <form method="POST">
                            <button class="admin-menu-button" type="submit">Delete</button>
                            @method('DELETE')
                            @csrf
                        </form>        
                    </div>
                @endif
                @endauth
            </div>
        </div>
        <div>
            <p>
                {{ $product->description }}
            </p>
        </div>
</div>

@endsection()