aarbit/scavengerhunt-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adds display of Team members

Browse Source
This commit is contained in:
aarbit
2026-05-18 17:12:43 -05:00
parent 6e4edd96ce
commit 86866f4db7
4 changed files with 84 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
src/routes/hunter/HuntLobby.svelte
View File

@@ -8,13 +8,14 @@
apiGetHunterTeam,
apiGetItemPhotos,
apiGetItems,
apiGetTeamHunters,
apiGetTeamItem,
apiJoinTeam,
apiListTeams,
apiRemovePhoto,
apiSubmitPhoto
} from '../../lib/api/index'
import type {HuntResponse, ItemResponse, PhotoResponse, TeamItemResponse, TeamResponse} from '../../lib/api/types'
import type {HuntResponse, HunterSummaryResponse, ItemResponse, PhotoResponse, TeamItemResponse, TeamResponse} from '../../lib/api/types'
import StatusBadge from '../../lib/components/StatusBadge.svelte'
import AuthImage from '../../lib/components/AuthImage.svelte'
import LoadingSpinner from '../../lib/components/LoadingSpinner.svelte'
@@ -174,6 +175,21 @@
const submitted = $derived(Object.values(itemStatuses).filter(s => s.itemFoundStatus === 'SUBMITTED').length)
const rejected = $derived(Object.values(itemStatuses).filter(s => s.itemFoundStatus === 'REJECTED').length)
let teamMembers = $state<HunterSummaryResponse[]>([])
let teamMembersLoading = $state(false)
let teamMembersOpen = $state(false)
async function openTeamMembers() {
if (!myTeam) return
teamMembersOpen = true
teamMembersLoading = true
try {
teamMembers = await apiGetTeamHunters(params.huntId, myTeam.id)
} finally {
teamMembersLoading = false
}
}
let searchQuery = $state('')
let filterStatus = $state<string | null>(null)
let filterPoints = $state<number | null>(null)
@@ -228,7 +244,9 @@
<StatusBadge status={huntStatus(hunt)} />
</div>
{#if myTeam}
<p class="text-sm text-base-content/50 mt-0.5">Team: <span class="font-medium text-base-content/70">{myTeam.name}</span></p>
<button class="text-sm text-base-content/50 mt-0.5 text-left" onclick={openTeamMembers}>
Team: <span class="font-medium text-base-content/70 underline decoration-dotted underline-offset-2">{myTeam.name}</span>
</button>
{#if items.length > 0}
<div class="flex items-center gap-2 mt-2">
<div class="flex-1 h-2 rounded-full overflow-hidden bg-base-300 flex">
@@ -360,6 +378,31 @@
{/if}
</div>
<!-- Team members popup -->
{#if teamMembersOpen && myTeam}
{@const team = myTeam}
<div class="fixed inset-0 z-50 flex items-center justify-center p-6" role="presentation" onclick={() => teamMembersOpen = false}>
<div class="bg-base-100 rounded-2xl shadow-2xl w-full max-w-sm p-5" role="dialog" aria-modal="true" onclick={(e) => e.stopPropagation()}>
<div class="flex items-center justify-between mb-4">
<div>
<p class="text-xs font-semibold uppercase tracking-wide text-base-content/40">Team</p>
<h3 class="font-bold text-lg leading-tight">{team.name}</h3>
</div>
<button class="btn btn-ghost btn-sm btn-circle" onclick={() => teamMembersOpen = false}>✕</button>
</div>
{#if teamMembersLoading}
<LoadingSpinner />
{:else}
<div class="flex flex-col gap-2">
{#each teamMembers as member}
<p class="text-sm font-medium py-1 border-b border-base-200 last:border-0">{member.name}</p>
{/each}
</div>
{/if}
</div>
</div>
{/if}
<!-- Photo lightbox -->
{#if expandedPhoto}
{@const photo = expandedPhoto}