feat: Remove schedule CTA from EventsCarousel and related components

Author: h4rkl

apps/breakpoint/src/components/sections/EventsCarousel.tsx

@@ -11,7 +11,6 @@ import { getAnchorLinkProps } from "@/lib/links";
 
 interface EventsCarouselProps {
   headline: string;
-  scheduleCta: string;
   communityCta: string;
   items: HighlightedEvent[];
 }
@@ -73,7 +72,6 @@ function formatEventMeta(
 
 export default function EventsCarousel({
   headline,
-  scheduleCta,
   communityCta,
   items,
 }: EventsCarouselProps) {
@@ -122,13 +120,6 @@ export default function EventsCarousel({
             {headline}
           </h2>
           <div className="flex w-full flex-col gap-xs sm:w-auto sm:flex-row">
-            <Button
-              label={scheduleCta}
-              variant="primary"
-              href="/schedule"
-              arrow
-              className="w-full sm:w-auto"
-            />
             <Button
               label={communityCta}
               variant="secondary"
@@ -159,36 +150,37 @@ export default function EventsCarousel({
             <li
               key={event.id}
               data-event-card
-              className="block aspect-[3/2] w-[280px] shrink-0 snap-start md:w-[calc((100%-64px)/3)] md:min-w-[300px]"
+              className="block w-[280px] shrink-0 snap-start md:w-[calc((100%-64px)/3)] md:min-w-[300px]"
             >
               <a
                 href={event.url}
-                className="group relative flex h-full w-full flex-col justify-end overflow-hidden border border-neutral-700 p-s focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-4 focus-visible:outline-white"
+                className="group block h-full w-full focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-4 focus-visible:outline-white"
                 {...getAnchorLinkProps({ href: event.url })}
               >
-                {event.coverUrl && (
-                  <>
+                <span className="relative block aspect-[3/2] overflow-hidden border border-neutral-700 bg-neutral-800">
+                  {event.coverUrl && (
                     <Image
                       src={event.coverUrl}
                       alt=""
                       fill
                       sizes="(min-width: 768px) 33vw, 280px"
                       className="object-cover transition-transform duration-300 group-hover:scale-105"
                     />
-                    <span
-                      aria-hidden="true"
-                      className="absolute inset-0 bg-gradient-to-t from-black via-black/60 to-black/20"
-                    />
-                  </>
-                )}
-                <span className="relative z-10 flex flex-col items-start">
-                  {time && (
-                    <span className="type-eyebrow text-white">{time}</span>
                   )}
-                  <span className="type-eyebrow mt-3xs text-white">{date}</span>
-                  <span className="type-h5 mt-2xs text-white">
+                </span>
+                <span className="flex min-h-[128px] flex-col items-start border-x border-b border-neutral-700 p-s">
+                  <span className="type-h5-fixed text-white transition-opacity duration-200 group-hover:opacity-70">
                     {event.title}
                   </span>
+                  <span className="type-eyebrow mt-2xs flex flex-wrap gap-x-2xs gap-y-3xs text-text-secondary">
+                    <span>{date}</span>
+                    {time && (
+                      <>
+                        <span aria-hidden="true">/</span>
+                        <span>{time}</span>
+                      </>
+                    )}
+                  </span>
                   <span className="sr-only">(opens in a new tab)</span>
                 </span>
               </a>

apps/breakpoint/src/components/sections/EventsSection.tsx

@@ -16,7 +16,6 @@ export default async function EventsSection() {
       <div className="container">
         <EventsCarousel
           headline={t("events.headline")}
-          scheduleCta={t("events.scheduleCta")}
           communityCta={t("events.communityCta")}
           items={events}
         />

apps/breakpoint/src/content/events/luma.ts

@@ -2,7 +2,6 @@ import { unstable_cache } from "next/cache";
 import {
   BREAKPOINT_LUMA_CALENDAR_ID,
   BREAKPOINT_LUMA_EVENT_ID,
-  HIGHLIGHTED_EVENT_URLS,
 } from "@/content/links";
 import type { HighlightedEvent } from "./types";
 
@@ -88,34 +87,11 @@ async function fetchCalendarEvents(): Promise<HighlightedEvent[]> {
     .filter((event): event is HighlightedEvent => event !== null);
 }
 
-async function fetchPinnedEvent(
-  slug: string,
-): Promise<HighlightedEvent | null> {
-  const url = new URL(`${LUMA_API_BASE}/url`);
-  url.searchParams.set("url", slug);
-
-  const payload = (await fetchLumaJson(url)) as {
-    kind?: string;
-    data?: LumaEventData & { event?: LumaEventData };
-  } | null;
-
-  if (payload?.kind !== "event" || !payload.data) {
-    return null;
-  }
-
-  return normalizeLumaEvent(payload.data.event ?? payload.data);
-}
-
 async function fetchHighlightedEvents(): Promise<HighlightedEvent[]> {
-  const [calendarEvents, ...pinnedEvents] = await Promise.all([
-    fetchCalendarEvents(),
-    ...HIGHLIGHTED_EVENT_URLS.map(fetchPinnedEvent),
-  ]);
-
   const now = Date.now();
   const events = new Map<string, HighlightedEvent>();
 
-  for (const event of [...calendarEvents, ...pinnedEvents]) {
+  for (const event of await fetchCalendarEvents()) {
     if (!event || event.id === BREAKPOINT_LUMA_EVENT_ID) continue;
     const endsAt = Date.parse(event.endAt ?? event.startAt);
     if (Number.isFinite(endsAt) && endsAt < now) continue;

apps/breakpoint/src/content/links.ts

@@ -12,9 +12,8 @@ export const CONTENT_CREATOR_APPLICATION_HREF =
   "https://solanafoundation.typeform.com/bp26-creator";
 export const CODE_OF_CONDUCT_HREF = "https://shorturl.at/lEMR1";
 export const SIDE_EVENTS_HREF = "https://luma.com/BP-SideEvents";
-export const BREAKPOINT_LUMA_CALENDAR_ID = "evgrp-f8F1bDAHhBNDM1f";
-// Highlighted side events pinned by Luma URL slug until they land on the calendar.
-export const HIGHLIGHTED_EVENT_URLS = ["dmxdc394"];
+// Public calendar: https://luma.com/BP-Highlight
+export const BREAKPOINT_LUMA_CALENDAR_ID = "cal-J8paV20F2tKUEXI";
 export const BREAKPOINT_2025_ARCHIVES_URL =
   "https://www.youtube.com/playlist?list=PLilwLeBwGuK53OUOcc_GsCcbqcU5V4H9Z";
 export const BP25_RECAP_YOUTUBE_ID = "394wb968J68";

apps/breakpoint/src/content/page.ts

@@ -72,7 +72,6 @@ export type BreakpointMessages = {
   };
   events: {
     headline: string;
-    scheduleCta: string;
     communityCta: string;
   };
   highlights: {