Merge pull request #30 from dddwa/feature/sponsored-rooms

Add room sponsor logo to the track
dddwa · Nov 12, 2024 · d380539 · d380539
2 parents c4cecae + 5f491ad
commit d380539
Show file tree

Hide file tree

Showing 4 changed files with 70 additions and 40 deletions.
diff --git a/website/app/config/years/2024.ts b/website/app/config/years/2024.ts
@@ -44,7 +44,7 @@ export const conference2024: ConferenceYear = {
         opens: DateTime.fromISO('2024-06-21T08:00:00', {
             zone: 'Australia/Perth',
         }),
-        closes: DateTime.fromISO('2024-11-11T23:59:59', {
+        closes: DateTime.fromISO('2024-11-15T23:59:59', {
             zone: 'Australia/Perth',
         }),
     },
@@ -156,13 +156,15 @@ Computing, software and big data will be critical in the success of this mega sc
                 quote: `Microsoft is super excited to be a Room Sponsor for the 10th Anniversary of hashtag#DDDPerth. Being able to support the largest hashtag#developer conference in the country year after year has put us right at the heart of a community we love. I still remember standing in a room of 100 developers, which was probably the 2nd year the conference ran and everyone was so proud because they had doubled the numbers from the year before. None of us expected back then that it would continue to double each year until the pandemic, and even then, it hardly stuttered. Whilst Microsoft cannot boast those kind of stats 😉 Our Partnerships with OpenAI, GitHub and Nvidia have enabled us to build a cutting edge, safe and secure environment for developers to build modern AI Apps on Azure. Come say hello to us in our room, we'd love to see you"
 
 - Michelle Sandford from Microsoft`,
+                roomName: 'Room 1 - River room',
             },
             {
                 name: 'SoftwareOne',
                 website: 'https://www.softwareone.com/',
                 logoUrlDarkMode: '/images/sponsors/2024-softwareone-dark.svg',
                 logoUrlLightMode: '/images/sponsors/2024-softwareone-light.svg',
                 quote: 'SoftwareONE are delighted to be able to contribute to such the 10th anniversary celebrations for DDD Perth. DDD has such a positive impact on the local technology scene and we would like to congratulate you on such an incredible milestone!',
+                roomName: 'Room 3 - River room',
             },
         ],
         digital: [

diff --git a/website/app/lib/config-types.ts b/website/app/lib/config-types.ts
@@ -82,7 +82,7 @@ export interface YearSponsors {
     quietRoom?: Sponsor[]
 
     keynotes?: Sponsor[]
-    room?: Sponsor[]
+    room?: Array<Sponsor & { roomName: string }>
 }
 
 export interface Sponsor {

diff --git a/website/app/lib/sessionize.server.ts b/website/app/lib/sessionize.server.ts
@@ -72,18 +72,17 @@ export const timeSlotSchema = z.object({
     slotStart: z.string(),
     rooms: z.array(roomSchema),
 })
+export const gridRoomSchema = z.object({
+    id: z.number(),
+    name: z.string(),
+    sessions: z.array(sessionSchema),
+    hasOnlyPlenumSessions: z.boolean(),
+})
 export const gridSmartSchema = z.array(
     z.object({
         date: z.string(),
         isDefault: z.boolean(),
-        rooms: z.array(
-            z.object({
-                id: z.number(),
-                name: z.string(),
-                sessions: z.array(sessionSchema),
-                hasOnlyPlenumSessions: z.boolean(),
-            }),
-        ),
+        rooms: z.array(gridRoomSchema),
         timeSlots: z.array(timeSlotSchema),
     }),
 )

diff --git a/website/app/routes/_layout.agenda.($year).tsx b/website/app/routes/_layout.agenda.($year).tsx
@@ -8,11 +8,18 @@ import { Box, Flex, styled } from 'styled-system/jsx'
 import { TypeOf, z } from 'zod'
 import { AppLink } from '~/components/app-link'
 import { SponsorSection } from '~/components/page-components/SponsorSection'
-import { Year } from '~/lib/config-types'
+import { Year, YearSponsors } from '~/lib/config-types'
 import { CACHE_CONTROL } from '~/lib/http.server'
 import { conferenceConfig } from '../config/conference-config'
 import { getYearConfig } from '../lib/get-year-config'
-import { formatDate, getScheduleGrid, gridSmartSchema, roomSchema, timeSlotSchema } from '../lib/sessionize.server'
+import {
+    formatDate,
+    getScheduleGrid,
+    gridRoomSchema,
+    gridSmartSchema,
+    roomSchema,
+    timeSlotSchema,
+} from '../lib/sessionize.server'
 import { slugify } from '../lib/slugify'
 
 export async function loader({ params, context }: LoaderFunctionArgs) {
@@ -142,34 +149,9 @@ export default function Agenda() {
                         gridGap: '1',
                     }}
                 >
-                    {schedule.rooms.map((room) => (
-                        /* hidden on small screens and browsers without grid support */
-                        <Flex
-                            key={room.id}
-                            style={{ '--room-column': `room-${room.id}` } as React.CSSProperties}
-                            aria-hidden="true"
-                            justifyContent="center"
-                            alignItems="center"
-                            textAlign="center"
-                            gridColumn="var(--room-column)"
-                            gridRow="rooms"
-                            display="none"
-                            rounded="sm"
-                            bgColor="#8D8DFF"
-                            color="#070727"
-                            fontWeight="semibold"
-                            fontSize="sm"
-                            padding={2}
-                            xl={{
-                                display: 'block',
-                                position: 'sticky',
-                                top: 4,
-                                zIndex: 1000,
-                            }}
-                        >
-                            {room.name}
-                        </Flex>
-                    ))}
+                    {schedule.rooms.map((room) => {
+                        return <RoomTitle key={room.id} room={room} sponsors={sponsors} />
+                    })}
 
                     {schedule.timeSlots.map((timeSlot, timeSlotIndex) => {
                         const startTime12 = DateTime.fromISO(timeSlot.slotStart).toFormat('h:mm a').toLowerCase()
@@ -222,6 +204,53 @@ export default function Agenda() {
     )
 }
 
+function RoomTitle({ room, sponsors }: { room: z.infer<typeof gridRoomSchema>; sponsors: YearSponsors }) {
+    const roomSponsor = sponsors.room?.find((r) => r.roomName === room.name)
+
+    return (
+        <Flex
+            key={room.id}
+            style={{ '--room-column': `room-${room.id}` } as React.CSSProperties}
+            aria-hidden="true"
+            justifyContent="center"
+            alignItems="center"
+            textAlign="center"
+            gridColumn="var(--room-column)"
+            gridRow="rooms"
+            display="none"
+            rounded="sm"
+            bgColor="#8D8DFF"
+            color="#070727"
+            fontWeight="semibold"
+            fontSize="sm"
+            padding={2}
+            xl={{
+                display: 'block',
+                position: 'sticky',
+                top: 4,
+                zIndex: 1000,
+            }}
+        >
+            {room.name}
+            {roomSponsor ? (
+                <>
+                    <br />
+                    Sponsored by{' '}
+                    <styled.img
+                        src={roomSponsor.logoUrlLightMode}
+                        alt={roomSponsor.name}
+                        maxWidth={100}
+                        width="100%"
+                        maxHeight={50}
+                        display="inline-block"
+                        objectFit="contain"
+                    />
+                </>
+            ) : null}
+        </Flex>
+    )
+}
+
 function RoomTimeSlot({
     schedule,
     room,