@extends('layouts.app')

@section('content')
<div class="container app-content">
    <div class="row justify-content-center">
        <div class="col-md-8">
            <div class="card">
                <div class="card-header">
                    <div class="card-title">Add Translation</div>
                </div>

                <div class="card-body">
                    <form method="POST" action="{{ route('admin.translation.store') }}">
                        @csrf
                        <div class="form-group">
                            <label>Language</label>
                            <select name="language" class="form-control custom-select">
                                @foreach ($languages as $lang)
                                    <option value="{{ $lang->id }}">{{ "{$lang->locale} - {$lang->name}" }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="form-group">
                            <label>Group</label>
                            <select name="group" class="form-control custom-select">
                                @foreach ($group_names as $group)
                                    <option value="{{ $group }}">{{ $group }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="form-group">
                            <label>Key</label>
                            <input class="form-control @error('item') is-invalid @enderror" type="text" name="item" value="" required>
                        </div>
                        <div class="form-group">
                            <label>Text</label>
                            <input class="form-control @error('text') is-invalid @enderror" type="text" name="text" value="" required>
                        </div>
                        <button class="btn btn-success" type="submit">Add Translation</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
