feat: improve champion role display logic

Added checks for lane and role data to prevent errors when displaying champion roles.
(Mel being the first ever champ to launch without this data)
This commit is contained in:
Rico van Zelst
2025-01-25 00:41:44 +01:00
parent 3ac5540508
commit 01c3b669c9
2 changed files with 26 additions and 17 deletions

View File

@@ -35,6 +35,7 @@
</li> </li>
<li class="text-base font-medium leading-loose text-neutral-100 hyphens-auto" lang="en"> <li class="text-base font-medium leading-loose text-neutral-100 hyphens-auto" lang="en">
<span class="font-bold">Popular Positions:</span> <span class="font-bold">Popular Positions:</span>
@if(isset($champion->lanes) && isset($champion->lanes->roles))
@foreach ($champion->lanes->roles as $lane) @foreach ($champion->lanes->roles as $lane)
<span class="inline-block lowercase capitalize-first">{{ $lane }} @svg(getRoleIconSvg($lane), 'w-5 h-5 inline-block') <span class="inline-block lowercase capitalize-first">{{ $lane }} @svg(getRoleIconSvg($lane), 'w-5 h-5 inline-block')
@if (!$loop->last) @if (!$loop->last)
@@ -42,6 +43,9 @@
@endif @endif
</span> </span>
@endforeach @endforeach
@else
<span class="inline-block lowercase capitalize-first">Not Enough Data</span>
@endif
</li> </li>
<li class="items-center text-base font-medium leading-loose text-neutral-100 hyphens-auto" <li class="items-center text-base font-medium leading-loose text-neutral-100 hyphens-auto"
lang="en"> lang="en">

View File

@@ -11,8 +11,8 @@
Champions Champions
</h1> </h1>
<ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-4505764048662657" <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-4505764048662657" data-ad-slot="7031271888"
data-ad-slot="7031271888" data-ad-format="auto" data-full-width-responsive="true"></ins> data-ad-format="auto" data-full-width-responsive="true"></ins>
<div class="flex justify-center items-center mx-auto max-w-5xl mt-2.5"> <div class="flex justify-center items-center mx-auto max-w-5xl mt-2.5">
<x-champions.lane-selector class="text-center" /> <x-champions.lane-selector class="text-center" />
@@ -23,7 +23,10 @@
@foreach ($champions as $key => $champion) @foreach ($champions as $key => $champion)
<div <div
class="champ-card flex flex-col text-gray-700 bg-stone-800/40 shadow-md rounded-2xl bg-clip-border class="champ-card flex flex-col text-gray-700 bg-stone-800/40 shadow-md rounded-2xl bg-clip-border
border border-stone-800 hover:border-orange-500/10 hover:shadow-orange-500/10 @foreach ($roles[$key]->roles as $lane) POS-{{ $lane }} @endforeach"> border border-stone-800 hover:border-orange-500/10 hover:shadow-orange-500/10
@if (isset($roles[$key]) && $roles[$key] !== null && isset($roles[$key]->roles)) @foreach ($roles[$key]->roles as $lane)
POS-{{ $lane }}
@endforeach @endif">
<div class="mx-4 mt-4 overflow-hidden border-2 rounded-2xl bg-clip-border border-orange-400/40"> <div class="mx-4 mt-4 overflow-hidden border-2 rounded-2xl bg-clip-border border-orange-400/40">
<div class="aspect-w-4 aspect-h-3"> <div class="aspect-w-4 aspect-h-3">
<a href="/champion/{{ $champion->slug }}"> <a href="/champion/{{ $champion->slug }}">
@@ -46,6 +49,7 @@
<div class="flex items-center mt-2"> <div class="flex items-center mt-2">
<p class="flex text-sm text-gray-300"> <p class="flex text-sm text-gray-300">
@if (isset($roles[$key]) && $roles[$key] !== null && isset($roles[$key]->roles))
@foreach ($roles[$key]->roles as $lane) @foreach ($roles[$key]->roles as $lane)
<span class="sr-only">{{ $lane }}</span> <span class="sr-only">{{ $lane }}</span>
<img {{ Popper::arrow('translucent')->theme('dark')->position('bottom')->pop($lane) }} <img {{ Popper::arrow('translucent')->theme('dark')->position('bottom')->pop($lane) }}
@@ -53,6 +57,7 @@
src="{{ getRoleIcon($lane) }}" alt="{{ $lane }} Icon" src="{{ getRoleIcon($lane) }}" alt="{{ $lane }} Icon"
class="mr-1 w-7 h-7"> class="mr-1 w-7 h-7">
@endforeach @endforeach
@endif
</p> </p>
<div class="flex items-end justify-end w-full justify-items-end"> <div class="flex items-end justify-end w-full justify-items-end">