conf: fix event title (graphql#1537)

Author: beerose

src/components/Conf/Schedule/ScheduleList.tsx

@@ -1,6 +1,7 @@
 import { format, parseISO, compareAsc } from "date-fns"
 import React, { FC } from "react"
 import { eventsColors } from "../../../utils/eventsColors"
+import { getEventTitle } from "../../../utils/eventTitle"
 
 function groupByKey<T>(arr: T[], getKey: (entity: T) => any) {
   return Array.from<[string, T[]]>(
@@ -84,15 +85,7 @@ const ScheduleList: FC<Props> = ({
                       : session.event_type
 
                     const speakers = session.speakers?.split(",") || []
-                    const eventTitle =
-                      speakers.length > 0
-                        ? session.name.substring(
-                            0,
-                            session.name.indexOf(
-                              `${speakers[0].replace("ı", "i")}`
-                            ) - 3
-                          )
-                        : session.name
+                    const eventTitle = getEventTitle(session, speakers)
 
                     const [borderColor] = getSessionColor(
                       session.event_type.toLowerCase()

src/templates/EventOgImageTemplate.tsx

@@ -3,6 +3,7 @@ import { PageProps } from "gatsby"
 import { ScheduleSession } from "../components/Conf/Schedule/ScheduleList"
 import { SchedSpeaker } from "../components/Conf/Speakers/Speaker"
 import { format, parseISO } from "date-fns"
+import { getEventTitle } from "../utils/eventTitle"
 
 const EventOgImageTemplate = ({
   pageContext,
@@ -13,19 +14,16 @@ const EventOgImageTemplate = ({
     company: speaker.company,
     position: speaker.position,
   }))
-  const { name, event_type, event_start: eventDate } = pageContext.event
+  const { event_type, event_start: eventDate } = pageContext.event
 
   const eventType = event_type.endsWith("s")
     ? event_type.slice(0, -1)
     : event_type
 
-  const eventTitle =
-    speakers.length > 0
-      ? name.substring(
-          0,
-          name.indexOf(`${speakers[0].name.replace("ı", "i")}`) - 3
-        )
-      : name
+  const eventTitle = getEventTitle(
+    pageContext.event,
+    pageContext.speakers.map(s => s.name)
+  )
 
   return (
     <div

src/templates/event.tsx

@@ -17,6 +17,7 @@ import {
   SocialMediaIconServiceType,
 } from "../components/Conf/Speakers/SocialMedia"
 import { BackLink } from "../components/Conf/Schedule/BackLink"
+import { getEventTitle } from "../utils/eventTitle"
 
 const Tag = ({
   text,
@@ -45,13 +46,10 @@ export const EventComponent: FC<{
     ? event.event_type.slice(0, -1)
     : event.event_type
 
-  const eventTitle =
-    speakers.length > 0
-      ? event.name.substring(
-          0,
-          event.name.indexOf(`${speakers[0].name.replace("ı", "i")}`) - 3
-        )
-      : event.name
+  const eventTitle = getEventTitle(
+    event,
+    speakers.map(s => s.name)
+  )
 
   return (
     <div className={`bg-white ${!hideBackButton ? "py-10" : ""}`}>

src/utils/eventTitle.ts

@@ -0,0 +1,19 @@
+import { ScheduleSession } from "../components/Conf/Schedule/ScheduleList"
+
+export function getEventTitle(
+  event: ScheduleSession,
+  speakers: string[] | undefined
+): string {
+  if (!speakers) {
+    return event.name
+  }
+
+  speakers?.forEach(speaker => {
+    const speakerInTitle = event.name.indexOf(`- ${speaker.replace("ı", "i")}`)
+    if (speakerInTitle > -1) {
+      event.name = event.name.slice(0, speakerInTitle)
+    }
+  })
+
+  return event.name
+}