Think outside of the database when listing records

Draft Disclaimer: Please note that this article is currently in draft form and may undergo revisions before final publication. The content, including information, opinions, and recommendations, is subject to change and may not represent the final version. We appreciate your understanding and patience as we work to refine and improve the quality of this article. Your feedback is valuable in shaping the final release.

Language Mismatch Disclaimer: Please be aware that the language of this article may not match the language settings of your browser or device.
Do you want to read articles in English instead ?

Before TODO: insert image

After TODO: insert image

Before

<table class="table">
	<thead>
	<tr>
		<th>ID</th>
		<th>Name</th>
		<th>Slug</th>
		<th>Actions</th>
	</tr>
	</thead>
	<tbody>
	@foreach($tags as $tag)
		<tr>
			<td>{{ $tag->id }}</td>
			<td>{{ $tag->name }}</td>
			<td>{{ $tag->slug }}</td>
			<td>
				<a href="{{ route('tag.posts', $tag) }}">
					<i class="fa fa-comment-o"></i>
				</a>
				{{ $tag->posts()->count() }}
				<a href="{{ route('work.index', ['tag' => $tag->slug]) }}">
					<i class="fa fa-suitcase"></i>
				</a>
				{{ $tag->works()->count() }}
				@can(\App\Policies\TagPolicy::UPDATE, $tag)
				<a href="{{ route('tag.edit', $tag) }}"><i class="fa fa-pencil"></i></a>
				@endcan
				@can(\App\Policies\TagPolicy::DELETE, $tag)
				<a href="{{ route('tag.destroy', $tag) }}" data-method="DELETE" data-confirm="Supprimer tag '{{ $tag->name }}' ?"><i class="fa fa-trash-o"></i></a>
				@endcan
			</td>
		</tr>
	@endforeach
	</tbody>
</table>

After

@if ($tags->isEmpty())
	<div class="tag__list--empty">
		{{ __('No tags yet.') }}
		<a href="{{ route('filament.admin.resources.tags.create') }}">{{ __('Create tag') }}</a>
	</div>
@else
	<div class="tag__list">
		@foreach($tags as $tag)
			<div class="tag">
				<h3 class="tag__name">{{ $tag->name }}</h3>
				<small class="tag__slug">{{ $tag->slug }}</small>
				<div class="tag__actions">
					@can('tag.update', $tag)
						<a  href="{{ route('filament.admin.resources.tags.edit', $tag) }}">
							<i class="fa fa-pencil"></i>
						</a>
					@endcan
					<a href="{{ route('tag.post.index', $tag) }}" title="{{ __('Posts') }}">
						({{ $tag->posts_count }})
						<x-artwork.posts/>
					</a>
					@if (false)
						<a href="{{ route('work.index', ['tag' => $tag->slug]) }}">
							{{ __('Works') }} ({{ $tag->works_count }})
						</a>
					@endif
				</div>
			</div>
		@endforeach
	</div>
@endif

This latest version include an empty view which is not always included in UI. Data won't be perfect so it is important to account for edge cases like this one.