link to organizers, change presentation from list to text

web/src/components/events/EventDetails.tsx

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

web/src/components/events/OrganizerList.tsx

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