@extends('layouts.app')

@section('content')
<div class="content-header">
	<p class="title">Attributes</p>
	<ul>
		<li><a href="{{ route('attributes.create') }}">{{ _('Add New Attribute') }}</a></li>
	</ul>
</div>
<div class="content">
	<table id="myTable" class="table table-bordered table-striped table-hover">
		<thead>
			<tr>
				<th>ID</th>
				<th>Name</th>
				<th>Slug</th>
				<th>Actions</th>
			</tr>
		</thead>
		<tbody>
			@foreach($attributes as $attribute)
			<tr>
				<td>{{ $attribute->id }}</td>
				<td>{{ $attribute->name }}</td>
				<td>{{ $attribute->slug }}</td>
				<td>
					<!-- Edit Button with FontAwesome Icon -->
					<a href="{{ route('attributes.edit', $attribute->id) }}" class="btn btn-warning">
						<i class="fas fa-edit"></i>
					</a>

					<!-- Delete Button with FontAwesome Icon -->
					<form action="{{ route('attributes.destroy', $attribute->id) }}" method="POST" style="display:inline;" onsubmit="return confirm('Are you sure you want to delete this attribute?');">
						@csrf
						@method('DELETE')
						<button type="submit" class="btn btn-danger">
							<i class="fas fa-trash"></i>
						</button>
					</form>
				</td>
			</tr>
			@endforeach
		</tbody>
	</table>
</div>
@endsection