@extends('layouts.app')

@section('content')
    <h2>{{ $bookmark ? "Edit Bookmark" : "Add Bookmark" }}</h2>
    <p>
        <a href="{{ action('BookmarkController@index') }}">&larr; Back</a>
    </p>
    <form method="post" class="form" action="{{ $bookmark ? action('BookmarkController@update', ['bookmark' => $bookmark]) : action('BookmarkController@store') }}">
        @csrf
        <div class="bookmark">
            <div class="bookmark-title form-row">
                <label class="form-label" for="title">
                    Title:
                </label>
                <input type="text" class="form-input" name="title" value="{{ $bookmark?->title }}" tabindex="1">
            </div>
            <div class="bookmark-href form-row form-row-stacked">
                <label class="form-label" for="href">
                    URL:
                </label>
                <input type="text" class="form-input" name="href" value="{{ $bookmark?->href }}" tabindex="3">
            </div>
            <div class="bookmark-description form-row form-row-stacked">
                <label class="form-label" for="description">
                    Description:
                </label>
                <textarea name="description" class="form-textarea" tabindex="2">{{ $bookmark?->description }}</textarea>
            </div>
            <div class="bookmark-tags form-row form-row-stacked">
                <label class="form-label" for="description">
                    Tags:
                </label>
                <input type="text" class="form-input" name="tags" tabindex="4" value="@foreach ($bookmark?->tags ?? [] as $tag){{ $tag->name }} @endforeach">
            </div>
            <div class="form-row align-right bookmark-actions">
                <a class="form-button" tabindex="5" href="{{ $bookmark ? action('BookmarkController@show', ['bookmark' => $bookmark]) : action('BookmarkController@index') }}">Cancel</a>
                <input type="submit" tabindex="6" class="form-button" value="Save">
            </div>
        </div>
    </form>
@endsection