content collections for badges and projects

This commit is contained in:
Reid 2024-09-18 17:13:15 -07:00
parent b09fe1b8bf
commit 49562a82a4
Signed by: reidlab
GPG key ID: DAF5EAF6665839FD
28 changed files with 131 additions and 61 deletions

View file

@ -1,37 +1,25 @@
---
import { Image } from "astro:assets";
import type { ImageMetadata } from "astro";
import { getEntry } from "astro:content";
const images = import.meta.glob<{ default: ImageMetadata }>("../assets/badges/*.*");
interface Props {
badges: {
href?: string,
title?: string,
alt: string,
imagePath: string
}[]
}
const { badges } = Astro.props;
const badges = await getEntry("badges", "badges");
---
<div class="badges">
{badges.map((badge) => {
// hopefully we can dedupe this sometime....
const isTreatedAsPublic = images[badge.imagePath] === undefined;
{badges.data.map((badge) => {
const hasHref = badge.href !== undefined;
// ugh.
// i wish we could dedupe this, but im not sure how
return <>
{hasHref ? <a href={badge.href} target="_blank" rel="noreferrer noopener">
{isTreatedAsPublic
? <img src={badge.imagePath} alt={badge.alt} title={badge.title} loading="lazy" decoding="async" width="88" height="31"/>
: <Image src={images[badge.imagePath]()} alt={badge.alt} title={badge.title} quality={100} loading="lazy" width="88" height="31"/>
{typeof badge.path !== "string"
? <img src={badge.path.src} alt={badge.alt} title={badge.title} loading="lazy" decoding="async" width="88" height="31"/>
: <img src={badge.path} alt={badge.alt} title={badge.title} loading="lazy" decoding="async" width="88" height="31"/>
}
</a> : <>
{isTreatedAsPublic
? <img src={badge.imagePath} alt={badge.alt} title={badge.title} loading="lazy" decoding="async" width="88" height="31"/>
: <Image src={images[badge.imagePath]()} alt={badge.alt} title={badge.title} quality={100} loading="lazy" width="88" height="31"/>
{typeof badge.path !== "string"
? <img src={badge.path.src} alt={badge.alt} title={badge.title} loading="lazy" decoding="async" width="88" height="31"/>
: <img src={badge.path} alt={badge.alt} title={badge.title} loading="lazy" decoding="async" width="88" height="31"/>
}
</>}
</>;