MEP lineup API Con 2025 (#602)

Author: ginifizz

pwa/api/con/conferences.ts

@@ -33,7 +33,6 @@ export const getConferencesBySpeaker = async (
   locale: Locale
 ) => {
   const conferences = await getAllConferences(edition, true, locale);
-
   return conferences
     .filter((conference) =>
       conference.speakers.find((speaker: Speaker) => speaker.id === speakerId)

pwa/app/(con)/[locale]/con/2025/components/HomePage.tsx

@@ -45,9 +45,6 @@ const HomePage = ({ speakers, partners, images }: HomePageProps) => {
                   {t("buy_tickets")}
                 </BuyButton>
               )}
-              <Button empty to={`/${locale}/con/2025/call-for-papers`}>
-                {t("2025.cfp.title")}
-              </Button>
             </div>
           </div>
         </div>
@@ -59,7 +56,7 @@ const HomePage = ({ speakers, partners, images }: HomePageProps) => {
       >
         <div className="container text-center">
           <SectionTitle h1>
-            <Translate translationKey="2025.our_speakers.title" />
+            <Translate translationKey="speakers.title" />
           </SectionTitle>
           <SectionSubTitle>
             <Translate
@@ -68,30 +65,26 @@ const HomePage = ({ speakers, partners, images }: HomePageProps) => {
                 edition: "2025",
                 link: (
                   <a
-                    href={`/${locale}/con/2025/call-for-papers`}
+                    href="https://conference-hall.io/public/event/GMijW4ZrZDo6hzKeF1gk"
                     className="link"
+                    target="_blank"
+                    rel="noreferrer nooepener"
                   >
                     {t("2025.our_speakers.subtitle_link")}
                   </a>
                 ),
               }}
             />
           </SectionSubTitle>
-          <SpeakerList speakers={speakers} max={6} />
-          {speakers.length > 6 ? (
+          <SpeakerList speakers={speakers} max={9} />
+          {speakers.length > 9 ? (
             <Button
               className="mx-auto my-7"
               to={`/${locale}/con/2025/speakers`}
             >
               {t("speakers.see_all")}
             </Button>
           ) : null}
-          <Button
-            className="mx-auto my-7"
-            to={`/${locale}/con/2025/call-for-papers`}
-          >
-            {t("2025.our_speakers.cfp")}
-          </Button>
         </div>
       </Section>
       {currentEdition === "2025" && (
@@ -203,12 +196,15 @@ const HomePage = ({ speakers, partners, images }: HomePageProps) => {
           </SectionTitle>
           <LookingSponsorCard />
         </div>
-        <div className="bg-white text-center relative z-10 pt-40 pb-40">
+        <div
+          id="partners"
+          className="bg-white text-center relative z-10 pt-40 pb-40"
+        >
           <div className="container text-center">
             <div className="lined-center lined-blue font-bold uppercase text-2xl text-blue font-title">
-              {t("sponsorship.they_trust_us", { year: "2024" })}
+              <Translate translationKey="partners.title" />
             </div>
-            <Partners data={partners} edition="2024" />
+            <Partners data={partners} edition="2025" />
           </div>
         </div>
       </Section>

pwa/app/(con)/[locale]/con/2025/page.tsx

@@ -1,6 +1,6 @@
 import { getAllSpeakers } from "api/con/speakers";
 import { getAllEditionPictures } from "api/con/editions";
-import partners from "data/con/2024/partners";
+import partners from "data/con/2025/partners";
 import HomePage from "./components/HomePage";
 import { Locale, i18n } from "i18n/i18n-config";
 import { Metadata } from "next";

pwa/app/(con)/[locale]/con/2025/tickets/RegisterPage.tsx

@@ -29,26 +29,13 @@ export default function RegisterPage() {
     if (isActiveOffer(offer)) return false;
     if (offer.startDate && dayjs(offer.startDate).isBefore(dayjs(), "day"))
       return true;
+    if (!offer.startDate) return true;
     return false;
   };
 
   const expectations =
     getLocaleDictionary?.()[2025].tickets.expect.points || [];
 
-  const onIframeLoaded = () => {
-    console.log("loaded !");
-    const iframe = document.getElementById(
-      "yurplan-widget-141690"
-    ) as HTMLIFrameElement | null;
-    console.log("iframe ?", !!iframe);
-    if (!iframe) return;
-    const loader = document.getElementById("loader");
-    loader?.classList.add("hidden");
-
-    const contenu = iframe.contentWindow?.document.body.scrollHeight;
-    iframe.style.height = contenu + "px";
-  };
-
   useEffect(() => {
     const iframe = document.getElementById(
       "yurplan-widget-141690"

pwa/app/(con)/[locale]/con/[edition]/conferences/[slug]/components/ConferenceSpeaker.tsx

@@ -7,6 +7,7 @@ import Link from "components/common/Link";
 import SpeakerImage from "components/con/speakers/SpeakerImage";
 import Button from "components/con/common/Button";
 import { LanguageContext } from "contexts/con/LanguageContext";
+import SpeakerImage2025 from "components/con/speakers/SpeakerImage2025";
 
 interface SpeakerProps {
   conference: Conference;
@@ -21,69 +22,71 @@ const ConferenceSpeaker = ({ conference }: SpeakerProps) => {
       {speakers.map((speaker: Speaker) => {
         const { name, job, company, image, placeholder, url } = speaker;
         return (
-          <div
-            key={speaker.name}
-            className={classNames(
-              "bg-blue-gradient bg-blue text-center px-5 py-5 border-b-2 border-dotted border-b-white/50 last:border-b-0 group hover:bg-blue-dark transition-colors",
-              speakers.length === 1 && "md:hover:bg-blue md:pt-10 md:pb-5"
-            )}
-          >
-            <Link
-              href={url}
+          <>
+            <div
+              key={speaker.name}
               className={classNames(
-                "flex flex-row items-center",
-                speakers.length === 1 && "md:flex-col"
+                "bg-blue-gradient bg-blue text-center px-5 py-5 border-b-2 border-dotted border-b-white/50 last:border-b-0 group hover:bg-blue-dark transition-colors",
+                speakers.length === 1 && "md:hover:bg-blue md:pt-10 md:pb-5"
               )}
             >
-              <div
+              <Link
+                href={url}
                 className={classNames(
-                  "w-20 h-20",
-                  speakers.length === 1 && "md:mx-auto md:w-60 md:h-60"
+                  "flex flex-row items-center",
+                  speakers.length === 1 && "md:flex-col"
                 )}
               >
-                <SpeakerImage
-                  image={image}
-                  placeholder={placeholder}
-                  hoverable={false}
-                />
-              </div>
+                <div
+                  className={classNames(
+                    "w-20 h-20 relative",
+                    speakers.length === 1 && "md:mx-auto md:w-60 md:h-60"
+                  )}
+                >
+                  {conference.edition === "2025" ? (
+                    <SpeakerImage2025 speaker={speaker} image={image} />
+                  ) : (
+                    <SpeakerImage image={image} placeholder={placeholder} />
+                  )}
+                </div>
 
-              <div
-                className={classNames(
-                  "text-inherit uppercase font-title ml-5 flex-1 transition-colors group-hover:text-white",
-                  speakers.length === 1 &&
-                    "md:mt-7 md:ml-0 md:group-hover:text-blue-black"
-                )}
-              >
-                <span
+                <div
                   className={classNames(
-                    "inline-block leading-tight font-semibold text-lg",
-                    speakers.length === 1 && "md:text-xl"
+                    "text-inherit uppercase font-title ml-5 flex-1 transition-colors group-hover:text-white",
+                    speakers.length === 1 &&
+                      "md:mt-7 md:ml-0 md:group-hover:text-blue-black"
                   )}
                 >
-                  {name}
-                </span>
-                <Overline className="text-white lined-center lined-white/50">
-                  {job}
-                  <br />
-                  {company ? (
-                    <>
-                      @ <strong className="font-normal">{company}</strong>
-                    </>
-                  ) : null}
-                </Overline>
-              </div>
-            </Link>
-            {speakers.length === 1 && (
-              <Button
-                className="mt-5 white square hidden md:inline-block"
-                size="small"
-                to={speaker.url}
-              >
-                {t("conferences.see_speaker_details")}
-              </Button>
-            )}
-          </div>
+                  <span
+                    className={classNames(
+                      "inline-block leading-tight font-semibold text-lg",
+                      speakers.length === 1 && "md:text-xl"
+                    )}
+                  >
+                    {name}
+                  </span>
+                  <Overline className="text-white lined-center lined-white/50">
+                    {job}
+                    <br />
+                    {company ? (
+                      <>
+                        @ <strong className="font-normal">{company}</strong>
+                      </>
+                    ) : null}
+                  </Overline>
+                </div>
+              </Link>
+              {speakers.length === 1 && (
+                <Button
+                  className="mt-5 white square hidden md:inline-block"
+                  size="small"
+                  to={speaker.url}
+                >
+                  {t("conferences.see_speaker_details")}
+                </Button>
+              )}
+            </div>
+          </>
         );
       })}
     </div>

pwa/app/(con)/[locale]/con/[edition]/speakers/SpeakersPage.tsx

@@ -6,18 +6,24 @@ import { Speaker } from "types/con";
 import SectionSubTitle from "components/con/common/typography/SectionSubtitle";
 import { LanguageContext } from "contexts/con/LanguageContext";
 
-interface Speakers {
+interface SpeakersProps {
   speakers: Speaker[];
+  edition: string;
 }
 
-export default function SpeakerPageListTemplate({ speakers }: Speakers) {
+export default function SpeakerPageListTemplate({
+  speakers,
+  edition,
+}: SpeakersProps) {
   const { t, Translate } = useContext(LanguageContext);
   return (
     <div className="container flex flex-col items-center pt-10 | sm:pt-20">
       <SectionTitle h1 dark>
         <Translate translationKey="speakers.title" />
       </SectionTitle>
-      <SectionSubTitle dark>{t("speakers.subtitle")}</SectionSubTitle>
+      <SectionSubTitle dark>
+        {t(`${edition}.our_speakers.subtitle`)}
+      </SectionSubTitle>
       <div className="pb-36 text-white">
         <SpeakerList speakers={speakers} />
       </div>

pwa/app/(con)/[locale]/con/[edition]/speakers/[slug]/SpeakerConferenceSlot.tsx

@@ -30,7 +30,28 @@ export default function SpeakerConferenceSlot({
             </span>
             {<Overline>{getConferenceDate(date)}</Overline>}
           </>
-        ) : null}
+        ) : (
+          <div className="text-white flex flex-col gap-4 items-center">
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              fill="none"
+              viewBox="0 0 24 24"
+              strokeWidth={1.5}
+              stroke="currentColor"
+              className="size-12 opacity-60"
+            >
+              <path
+                strokeLinecap="round"
+                strokeLinejoin="round"
+                d="M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 0 1 2.25-2.25h13.5A2.25 2.25 0 0 1 21 7.5v11.25m-18 0A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75m-18 0v-7.5A2.25 2.25 0 0 1 5.25 9h13.5A2.25 2.25 0 0 1 21 11.25v7.5m-9-6h.008v.008H12v-.008ZM12 15h.008v.008H12V15Zm0 2.25h.008v.008H12v-.008ZM9.75 15h.008v.008H9.75V15Zm0 2.25h.008v.008H9.75v-.008ZM7.5 15h.008v.008H7.5V15Zm0 2.25h.008v.008H7.5v-.008Zm6.75-4.5h.008v.008h-.008v-.008Zm0 2.25h.008v.008h-.008V15Zm0 2.25h.008v.008h-.008v-.008Zm2.25-4.5h.008v.008H16.5v-.008Zm0 2.25h.008v.008H16.5V15Z"
+              />
+            </svg>
+
+            <span className="uppercase text-white font-bold font-title">
+              {t("speakers.no_date")}
+            </span>
+          </div>
+        )}
       </div>
       <div className="flex flex-col flex-1 items-start py-5 px-12">
         <div className="lined-left flex flex-col">

pwa/app/(con)/[locale]/con/[edition]/speakers/[slug]/SpeakerPage.tsx

@@ -8,6 +8,7 @@ import SpeakerConferenceSlot from "./SpeakerConferenceSlot";
 import { LanguageContext } from "contexts/con/LanguageContext";
 import Button from "components/con/common/Button";
 import SpeakerList from "components/con/speakers/SpeakerList";
+import SpeakerImage2025 from "components/con/speakers/SpeakerImage2025";
 
 interface SpeakerProps {
   speakerData: Speaker;
@@ -45,7 +46,11 @@ export default function SpeakerPageTemplate({
         </div>
         <div className="flex flex-col relative flex-wrap items-center bg-grey px-10 pb-10 pt-28 | lg:flex-row lg:items-start | sm:pb-20">
           <div className="w-72 h-72 | md:w-80 md:h-80 | lg:w-[400px] lg:h-[400px]">
-            <SpeakerImage big image={image} placeholder={placeholder} />
+            {edition === "2025" ? (
+              <SpeakerImage2025 speaker={speakerData} big image={image} />
+            ) : (
+              <SpeakerImage big image={image} placeholder={placeholder} />
+            )}
           </div>
           <div className="flex-1 | sm:px-6">
             <SpeakerDescription speaker={speakerData} />

pwa/app/(con)/[locale]/con/[edition]/speakers/layout.tsx

@@ -1,5 +1,6 @@
 import { Locale, i18n } from "i18n/i18n-config";
 import { Metadata } from "next";
+import { getRootUrl } from "utils";
 
 type Props = {
   params: { locale: Locale; edition: string };
@@ -20,6 +21,14 @@ export async function generateMetadata({ params }: Props): Promise<Metadata> {
     openGraph: {
       title: `${dictionary.speakers.title} - API Platform Conference`,
       description: DESCRIPTION,
+      images: [
+        {
+          url: `${getRootUrl()}/images/con/og-${edition}.png`,
+          width: 1200,
+          height: 630,
+          alt: `API Platform Conference ${edition}`,
+        },
+      ],
     },
     twitter: {
       title: `${dictionary.speakers.title} - API Platform Conference`,

pwa/app/(con)/[locale]/con/[edition]/speakers/page.tsx

@@ -15,7 +15,7 @@ export default async function Page({ params }: Props) {
   const speakers = await getSpeakers(params.edition, params.locale);
   // Fetch data directly in a Server Component
   // Forward fetched data to your Client Component
-  return <SpeakersPage speakers={speakers} />;
+  return <SpeakersPage speakers={speakers} edition={params.edition} />;
 }
 
 export const generateStaticParams = async () => {
@@ -24,6 +24,7 @@ export const generateStaticParams = async () => {
     { edition: "2022" },
     { edition: "2023" },
     { edition: "2024" },
+    { edition: "2025" },
   ];
 };