fix venue filtering bug, hide venues with no upcoming events, show message if no upcoming events

web/src/components/events/EventContainer.tsx

@@ -82,18 +82,19 @@ export const EventContainer = ({
     Filtering on a venue with no upcoming events will work,
     and in that case it's included in the dropdown
    */
-  const venueSlugsWithUpcomingEvents = events
-    .map((x) => x.occurrences)
-    .flat()
-    .filter((x) => x.venue?.__typename === "VenuePage")
-    .map((x) => x.venue?.slug)
-    .filter((x) => typeof x === "string");
+  const venueSlugsWithUpcomingEvents = unique(
+    events
+      .map((x) => x.occurrences)
+      .flat()
+      .filter((x) => x.venue?.__typename === "VenuePage")
+      .map((x) => x.venue?.slug)
+      .filter((x) => typeof x === "string")
+  );
   const filterableVenues = venues
-    .map((x) =>
-      venues.find(
-        (haystack) => haystack.slug === x.slug || haystack.slug === venue
-      )
+    .filter(
+      (x) => venueSlugsWithUpcomingEvents.includes(x.slug) || x.slug === venue
     )
+    .map((x) => venues.find((haystack) => haystack.slug === x.slug))
     .filter((x) => x !== undefined) as VenueFragment[];
 
   const filteredEvents = events
@@ -186,6 +187,11 @@ export const EventContainer = ({
 };
 
 const EventList = ({ events }: { events: EventFragment[] }) => {
+  if (events.length === 0) {
+    return (
+      <div className={styles.noEvents}>Ingen kommende arrangementer.</div>
+    );
+  }
   return (
     <ul className={styles.eventList}>
       {events.map((event) => (