From 68d9ecfc46804d1d0bd5605ec1406a704f47809b Mon Sep 17 00:00:00 2001
From: Piotr Monwid-Olechnowicz <hasparus@gmail.com>
Date: Fri, 5 Sep 2025 10:40:00 +0200
Subject: [PATCH 1/2] Show time range for very long sessions

---
 .../_components/schedule-session-card.tsx     | 43 ++++++++++++++-----
 1 file changed, 32 insertions(+), 11 deletions(-)

diff --git a/src/app/conf/2025/schedule/_components/schedule-session-card.tsx b/src/app/conf/2025/schedule/_components/schedule-session-card.tsx
index 3df8cc3654..057a2019ae 100644
--- a/src/app/conf/2025/schedule/_components/schedule-session-card.tsx
+++ b/src/app/conf/2025/schedule/_components/schedule-session-card.tsx
@@ -19,6 +19,7 @@ import ClockIcon from "@/app/conf/_design-system/pixelarticons/clock.svg?svgr"
 
 import { getEventTitle } from "../../utils"
 import { CalendarIcon } from "@/app/conf/_design-system/pixelarticons/calendar-icon"
+import { formatBlockTime } from "./format-block-time"
 
 function isString(x: unknown): x is string {
   return Object.prototype.toString.call(x) === "[object String]"
@@ -139,17 +140,10 @@ export function ScheduleSessionCard({
                   {session.venue}
                 </span>
               )}
-              {blockTimeFraction < 1 && (
-                <span className="typography-body-xs flex items-center gap-0.5">
-                  <ClockIcon className="size-4 text-pri-base [@container(width<240px)]:hidden" />
-                  {Math.round(
-                    (new Date(session.event_end).getTime() -
-                      new Date(session.event_start).getTime()) /
-                      (1000 * 60),
-                  )}{" "}
-                  min
-                </span>
-              )}
+              <SessionDuration
+                session={session}
+                blockTimeFraction={blockTimeFraction}
+              />
               <AddToCalendarLink
                 eventTitle={eventTitle}
                 session={session}
@@ -164,6 +158,33 @@ export function ScheduleSessionCard({
   )
 }
 
+function SessionDuration({
+  session,
+  blockTimeFraction,
+}: {
+  session: ScheduleSession
+  blockTimeFraction: number
+}): React.ReactNode {
+  if (blockTimeFraction >= 1) return null
+
+  const durationMs =
+    new Date(session.event_end).getTime() -
+    new Date(session.event_start).getTime()
+
+  // if a session is longer than 3 hourse, we show the time range
+  const formattedTime =
+    durationMs > 1000 * 60 * 60 * 3
+      ? formatBlockTime(session.event_start, new Date(session.event_end))
+      : `${Math.round(durationMs / (1000 * 60))} min`
+
+  return (
+    <span className="typography-body-xs flex items-center gap-0.5">
+      <ClockIcon className="size-4 text-pri-base [@container(width<240px)]:hidden" />
+      {formattedTime}
+    </span>
+  )
+}
+
 function AddToCalendarLink({
   eventTitle,
   session,

From e7388bbbce77c786aa5310a284302770c53bb674 Mon Sep 17 00:00:00 2001
From: Piotr Monwid-Olechnowicz <hasparus@gmail.com>
Date: Fri, 5 Sep 2025 10:52:18 +0200
Subject: [PATCH 2/2] Move end time into cards in blocks with different end
 times

---
 .../conf/2025/schedule/_components/schedule-list.tsx | 12 +++++++++++-
 .../schedule/_components/schedule-session-card.tsx   | 11 +++--------
 2 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/src/app/conf/2025/schedule/_components/schedule-list.tsx b/src/app/conf/2025/schedule/_components/schedule-list.tsx
index a19e15b86c..82727dc80e 100644
--- a/src/app/conf/2025/schedule/_components/schedule-list.tsx
+++ b/src/app/conf/2025/schedule/_components/schedule-list.tsx
@@ -223,6 +223,12 @@ export function ScheduleList({
                       blockEnd.getTime() === nextBlockStart?.getTime() &&
                       !isBreak
 
+                    const endTimesDiffer = sessions.some(
+                      session =>
+                        new Date(session.event_end).getTime() !==
+                        blockEnd.getTime(),
+                    )
+
                     return (
                       <div
                         key={`concurrent sessions on ${sessionDate}`}
@@ -231,7 +237,10 @@ export function ScheduleList({
                         <div className="mr-px flex flex-col max-lg:ml-px lg:flex-row">
                           <div className="relative border-neu-50 bg-neu-50 dark:bg-neu-0 max-lg:-mx-px max-lg:my-px max-lg:border-x lg:mr-px">
                             <span className="typography-body-sm mt-3 inline-block w-28 whitespace-nowrap pb-0.5 pl-4 lg:mr-6 lg:pb-4 lg:pl-0">
-                              {formatBlockTime(sessionDate, blockEnd)}
+                              {formatBlockTime(
+                                sessionDate,
+                                endTimesDiffer ? undefined : blockEnd,
+                              )}
                             </span>
                           </div>
                           <div className="relative flex w-full flex-col items-end gap-px lg:flex-row lg:items-start">
@@ -242,6 +251,7 @@ export function ScheduleList({
                                 year={year}
                                 eventsColors={eventsColors}
                                 blockEnd={blockEnd}
+                                durationVisible={endTimesDiffer}
                               />
                             ))}
                           </div>
diff --git a/src/app/conf/2025/schedule/_components/schedule-session-card.tsx b/src/app/conf/2025/schedule/_components/schedule-session-card.tsx
index 057a2019ae..8e0872b1ac 100644
--- a/src/app/conf/2025/schedule/_components/schedule-session-card.tsx
+++ b/src/app/conf/2025/schedule/_components/schedule-session-card.tsx
@@ -30,11 +30,13 @@ export function ScheduleSessionCard({
   year,
   eventsColors,
   blockEnd,
+  durationVisible,
 }: {
   session: ScheduleSession
   year: `202${number}`
   eventsColors: Record<string, string>
   blockEnd: Date
+  durationVisible: boolean
 }) {
   let eventType = session.event_type
 
@@ -140,10 +142,7 @@ export function ScheduleSessionCard({
                   {session.venue}
                 </span>
               )}
-              <SessionDuration
-                session={session}
-                blockTimeFraction={blockTimeFraction}
-              />
+              {durationVisible && <SessionDuration session={session} />}
               <AddToCalendarLink
                 eventTitle={eventTitle}
                 session={session}
@@ -160,13 +159,9 @@ export function ScheduleSessionCard({
 
 function SessionDuration({
   session,
-  blockTimeFraction,
 }: {
   session: ScheduleSession
-  blockTimeFraction: number
 }): React.ReactNode {
-  if (blockTimeFraction >= 1) return null
-
   const durationMs =
     new Date(session.event_end).getTime() -
     new Date(session.event_start).getTime()