link to organizers, change presentation from list to text

This commit is contained in:
2024-08-10 16:04:15 +02:00
parent faddf0c8e4
commit e5a69b7ce9
2 changed files with 22 additions and 13 deletions

View File

@ -19,6 +19,8 @@ function formatPrice(price: number | string): string {
return `${asNumber} kr`; return `${asNumber} kr`;
} }
export const EventDetails = ({ event }: { event: EventFragment }) => { export const EventDetails = ({ event }: { event: EventFragment }) => {
const featuredImage: any = event.featuredImage; const featuredImage: any = event.featuredImage;

View File

@ -1,25 +1,32 @@
"use client"; "use client";
import { useState } from "react";
import { formatDate, isTodayOrFuture } from "@/lib/date";
import { EventFragment, EventOrganizer } from "@/lib/event"; import { EventFragment, EventOrganizer } from "@/lib/event";
import styles from "./organizerList.module.scss"; import styles from "./organizerList.module.scss";
import Link from "next/link"; import Link from "next/link";
import { Fragment } from "react";
export const OrganizerList = ({ event }: { event: EventFragment }) => { export const OrganizerList = ({ event }: { event: EventFragment }) => {
const total = event.organizers.length;
return ( return (
<ul className={styles.organizerList}> <div className={styles.organizerList}>
{event.organizers.map((organizer) => { {event.organizers.map((organizer, index) => {
const url = organizer.association?.url ?? organizer.externalUrl ?? null; const url = organizer.association?.url ?? organizer.externalUrl ?? null;
if (typeof url === "string" && url.startsWith("http")) { const hasValidUrl =
typeof url === "string" &&
(url.startsWith("http") || url.startsWith("/"));
return ( return (
<li key={organizer.name}> <Fragment key={organizer.name}>
{total > 1 && index === total - 1 && <> og </>}
{hasValidUrl && (
<span>
<Link href={url}>{organizer.name}</Link> <Link href={url}>{organizer.name}</Link>
</li> </span>
)}
{!hasValidUrl && <span>{organizer.name}</span>}
{total > 1 && index < total - 2 && <>, </>}
</Fragment>
); );
}
return <li key={organizer.name}>{organizer.name}</li>;
})} })}
</ul> </div>
); );
}; };