---
const { name } = Astro.props;

let avif = await Astro.glob(
	'/public/people/*/*.avif'
	).then(
	result => result.find(
		file => file.default.includes(name + '.avif')
		).default
	)

let webp = await Astro.glob(
	'/public/people/*/*.webp'
	).then(
	result => result.find(
		file => file.default.src.includes(name + '.webp')
		).default.src
	)

let jpg = await Astro.glob(
	'/public/people/*/*.jpg'
	).then(
	result => result.find(
		file => file.default.src.includes(name + '.jpg')
		)
	)

let png = await Astro.glob(
	'/public/people/*/*.png'
	).then(
	result => result.find(
		file => file.default.src.includes(name + '.png')
		)
	)


import { Debug } from 'astro/components';
---
<picture>
	<source srcset={avif} type="image/avif">
	<source srcset={webp} type="image/webp">
	<img src={png ? png : jpg} alt={name + "'s avatar"} width=48 height=48 class="avatar">
</picture>