fork of hey-api/openapi-ts because I need some additional things
1<button (click)="onGetPetById()" type="button">Get Random Pet</button>
2
3<!-- Error Display -->
4@if (pet.error()) {
5<div class="error-message">
6 <div class="error-title">Error occurred:</div>
7 <div class="error-details">{{ pet.error()|json }}</div>
8</div>
9}
10
11<!-- Pet Display Card -->
12@if (pet.value()) {
13<div class="pet-card">
14 <div class="pet-info">
15 <div class="pet-avatar">
16 @if (pet.value()?.photoUrls?.[0]) {
17 <img
18 [src]="pet.value()?.photoUrls?.[0]"
19 [alt]="pet.value()?.name || 'Pet'"
20 class="pet-image"
21 />
22 } @else {
23 <div class="pet-placeholder">
24 {{ pet.value()?.name?.slice(0, 1) || 'N' }}
25 </div>
26 }
27 </div>
28 <div class="pet-details">
29 <div class="pet-name">Name: {{ pet.value()?.name || 'N/A' }}</div>
30 <div class="pet-category">
31 Category: {{ pet.value()?.category?.name || 'N/A' }}
32 </div>
33 </div>
34 </div>
35</div>
36}