From 23c9a4024f42b80768944e3ed69d1c3fb22d609a Mon Sep 17 00:00:00 2001 From: Jake Ginnivan Date: Tue, 20 Aug 2024 08:51:20 +0800 Subject: [PATCH] Deploy and agenda fixes --- .github/workflows/ci.yml | 4 +- website/app/lib/conference-state.ts | 7 +- website/app/routes/_layout.agenda.($year).tsx | 41 ++-- website/panda.config.ts | 224 +++++++++++------- 4 files changed, 174 insertions(+), 102 deletions(-) diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 26b0e61..a1f133c 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -48,9 +48,9 @@ jobs: - name: Log in with Azure (Federated Credentials) run: | azd auth login ` - --client-id "$Env:AZURE_CLIENT_ID" ` + --client-id "${{ secrets.AUTH_CLIENT_ID }}` --federated-credential-provider "github" ` - --tenant-id "$Env:AZURE_TENANT_ID" + --tenant-id "${{ secrets.AUTH_CLIENT_SECRET }}" shell: pwsh - name: Provision Infrastructure diff --git a/website/app/lib/conference-state.ts b/website/app/lib/conference-state.ts index cf3b14c..9676ab0 100644 --- a/website/app/lib/conference-state.ts +++ b/website/app/lib/conference-state.ts @@ -4,6 +4,7 @@ import { CFPNotOpenYet, CFPOpen, ConferenceConfig, + ConferenceConfigYear, ConferenceState, ConferenceYear, DateTimeRange, @@ -19,9 +20,11 @@ export function getCurrentConferenceState( ): ConferenceState { const currentDate = dateTimeProvider.nowDate() - const [latestConference, previousConference] = ( - Object.entries(conference.conferences) as Array<[Year, ConferenceYear]> + const conferenceList = (Object.entries(conference.conferences) as Array<[Year, ConferenceConfigYear]>).filter( + (year): year is [Year, ConferenceYear] => !('cancelledMessage' in year[1]), ) + const [latestConference, previousConference] = conferenceList + .sort(([, a], [, b]) => { const dateA = a.conferenceDate?.valueOf() ?? Infinity const dateB = b.conferenceDate?.valueOf() ?? Infinity diff --git a/website/app/routes/_layout.agenda.($year).tsx b/website/app/routes/_layout.agenda.($year).tsx index 6b1300a..1f26101 100644 --- a/website/app/routes/_layout.agenda.($year).tsx +++ b/website/app/routes/_layout.agenda.($year).tsx @@ -29,6 +29,10 @@ export async function loader({ params, context }: LoaderFunctionArgs) { const yearConfigLookup = (conferenceConfig.conferences as Record)[year] if (!yearConfigLookup || 'cancelledMessage' in yearConfigLookup) { + if (!params.year) { + throw new Response(JSON.stringify({ message: 'No config for year' }), { status: 404 }) + } + return redirect($path('/agenda/:year?', { year: undefined })) } @@ -120,7 +124,7 @@ export default function Agenda() { '--slot-rows': [ '[rooms] auto', ...schedule.timeSlots.map( - (timeSlot) => `[time-${timeSlot.slotStart.replace(/:/g, '')}] 1fr`, + (timeSlot) => `[time-${timeSlot.slotStart.replace(/:/g, '')}] auto`, ), ].join(' '), '--room-columns': [ @@ -167,7 +171,7 @@ export default function Agenda() { zIndex: 1000, }} > - {room.name} - {room.id} + {room.name} ))} @@ -177,7 +181,7 @@ export default function Agenda() { return ( - + {startTime12} @@ -195,17 +199,13 @@ export default function Agenda() { key={room.id} marginBottom="0" md={{ marginBottom: 1 }} - style={ - { - '--talk-slot': `time-${timeSlotSimple} / time-${endsAtTime?.replace(/:/g, '')}`, - '--room-column': - timeSlot.rooms.length === 1 - ? `room-${schedule.rooms.at(0)?.id} / room-${schedule.rooms.at(-1)?.id}` - : `room-${room.id}`, - } as React.CSSProperties - } - gridRow="var(--talk-slot)" - gridColumn="var(--room-column)" + style={{ + gridRow: `time-${timeSlotSimple} / time-${endsAtTime?.replace(/:/g, '')}`, + gridColumn: + timeSlot.rooms.length === 1 + ? `room-${schedule.rooms.at(0)?.id} / room-${schedule.rooms.at(-1)?.id}` + : `room-${room.id}`, + }} > {fullSession?.title} - + 🕓 {startTime12} - {endTime12} - + 📍 {room.name} {fullSession?.speakers?.length ? ( @@ -280,8 +285,8 @@ function SponsorSection({ sponsors }: { sponsors: YearSponsors | undefined }) { if (!sponsors || sponsors.length === 0) return null return ( - - + + {title} diff --git a/website/panda.config.ts b/website/panda.config.ts index 10045c5..5ddb637 100644 --- a/website/panda.config.ts +++ b/website/panda.config.ts @@ -3,92 +3,156 @@ import { createPreset } from '@park-ui/panda-preset' import typographyPreset from 'pandacss-preset-typography' export default defineConfig({ - // Whether to use css reset - preflight: true, + // Whether to use css reset + preflight: true, - // Where to look for your css declarations - include: ['./app/routes/**/*.{ts,tsx,js,jsx}', './app/components/**/*.{ts,tsx,js,jsx}'], - presets: [ - typographyPreset(), - '@pandacss/preset-base', - createPreset({ - accentColor: 'indigo', - grayColor: 'neutral', - borderRadius: 'sm', - }), - ], + // Where to look for your css declarations + include: ['./app/routes/**/*.{ts,tsx,js,jsx}', './app/components/**/*.{ts,tsx,js,jsx}'], + presets: [ + typographyPreset(), + '@pandacss/preset-base', + createPreset({ + accentColor: 'indigo', + grayColor: 'slate', + borderRadius: 'sm', + additionalColors: ['slate'], + }), + ], - jsxFramework: 'react', + jsxFramework: 'react', - // Files to exclude - exclude: [], + // Files to exclude + exclude: [], - // Useful for theme customization - theme: { - breakpoints: { - xxs: '340px', - xs: '400px', - sm: '640px', - md: '768px', - lg: '1024px', - xl: '1280px', - '1.5xl': '1440px', - '2xl': '1536px', - '3xl': '1792px', - '4xl': '1920px', - '5xl': '2100px', - '6xl': '2560px', - }, - extend: { - tokens: { - colors: { - '2023-green': { value: '#008554' }, - '2023-orange': { value: '#F89A1C' }, - '2023-pink': { value: '#DA459C' }, - '2023-gray': { value: '#58595B' }, - '2023-red': { value: '#880007' }, - '2023-accessible-orange': { value: '#D97F07' }, - '2023-black': { value: '#1d1d1d' }, - '2023-white-i': { value: '#FCFCFC' }, - '2023-white-ii': { value: '#F5F5F5' }, - '2023-gray-light': { value: '#C8C8C8' }, - '2023-gray-light-ii': { value: '#EAEAEA' }, - }, - fonts: { - display: { value: 'Ubuntu, sans-serif' }, - body: { value: 'Ubuntu, sans-serif' }, - }, - sizes: { - /** xs: 4 */ - xs: { value: '4' }, - /** sm: 8 */ - sm: { value: '8' }, - /** md: 16 */ - md: { value: '16' }, - /** lg: 24 */ - lg: { value: '24' }, - /** xl: 32 */ - xl: { value: '32' }, - /** xxl: 40 */ - xxl: { value: '40' }, - }, - zIndex: { - '9999': { value: 9999 }, + // Useful for theme customization + theme: { + breakpoints: { + xxs: '340px', + xs: '400px', + sm: '640px', + md: '768px', + lg: '1024px', + xl: '1280px', + '1.5xl': '1440px', + '2xl': '1536px', + '3xl': '1792px', + '4xl': '1920px', + '5xl': '2100px', + '6xl': '2560px', }, - }, - keyframes: { - rotateText: { - '0%': { - transform: 'rotate(0deg)', - }, - '100%': { - transform: 'rotate(-360deg)', - }, + extend: { + semanticTokens: { + colors: { + // Or whatever name you've set as the semantic tokens + // prefix or recipe name + prose: { + body: { + value: '{colors.slate.7}', + }, + heading: { + value: '{colors.slate.9}', + }, + lead: { + value: '{colors.slate.6}', + }, + link: { + value: '{colors.slate.2}', + }, + bold: { + value: '{colors.slate.9}', + }, + counter: { + value: '{colors.slate.5}', + }, + bullet: { + value: '{colors.slate.3}', + }, + hrBorder: { + value: '{colors.slate.2}', + }, + quote: { + value: '{colors.slate.9}', + }, + quoteBorder: { + value: '{colors.slate.2}', + }, + caption: { + value: '{colors.slate.5}', + }, + kbd: { + value: '{colors.slate.9}', + }, + kbdShadow: { + // Expects an RGB value + value: '0 0 0', + }, + code: { + value: '{colors.slate.9}', + }, + preCode: { + value: '{colors.slate.2}', + }, + preBg: { + value: '{colors.slate.8}', + }, + thBorder: { + value: '{colors.slate.3}', + }, + tdBorder: { + value: '{colors.slate.2}', + }, + }, + }, + }, + tokens: { + colors: { + '2023-green': { value: '#008554' }, + '2023-orange': { value: '#F89A1C' }, + '2023-pink': { value: '#DA459C' }, + '2023-gray': { value: '#58595B' }, + '2023-red': { value: '#880007' }, + '2023-accessible-orange': { value: '#D97F07' }, + '2023-black': { value: '#1d1d1d' }, + '2023-white-i': { value: '#FCFCFC' }, + '2023-white-ii': { value: '#F5F5F5' }, + '2023-gray-light': { value: '#C8C8C8' }, + '2023-gray-light-ii': { value: '#EAEAEA' }, + }, + fonts: { + display: { value: 'Ubuntu, sans-serif' }, + body: { value: 'Ubuntu, sans-serif' }, + }, + // sizes: { + // /** xs: 4 */ + // xs: { value: '4' }, + // /** sm: 8 */ + // sm: { value: '8' }, + // /** md: 16 */ + // md: { value: '16' }, + // /** lg: 24 */ + // lg: { value: '24' }, + // /** xl: 32 */ + // xl: { value: '32' }, + // /** xxl: 40 */ + // xxl: { value: '40' }, + // }, + zIndex: { + '9999': { value: 9999 }, + }, + }, + keyframes: { + rotateText: { + '0%': { + transform: 'rotate(0deg)', + }, + '100%': { + transform: 'rotate(-360deg)', + }, + }, + }, }, - }, }, - }, - // The output directory for your css system - outdir: 'styled-system', + // The output directory for your css system + outdir: 'styled-system', })