diff --git a/apps/www/components/LaunchWeek/13/InteractiveGridParty.tsx b/apps/www/components/LaunchWeek/13/InteractiveGridParty.tsx index a72a9e389b6..edb29d9fa04 100644 --- a/apps/www/components/LaunchWeek/13/InteractiveGridParty.tsx +++ b/apps/www/components/LaunchWeek/13/InteractiveGridParty.tsx @@ -51,7 +51,7 @@ export default function InteractiveGrid() { (userId: string | undefined) => { if (!userId) { console.log('userId is undefined, returning black as fallback.') - return '#ffffff' // fallback color + return INTERACTIVE_GRID_COLORS(isDarkTheme).CURRENT_USER_HOVER // fallback color } // If userId already has a color, return it; otherwise, assign one @@ -256,16 +256,6 @@ export default function InteractiveGrid() { className="border border-gray-300 shadow-lg" />
-
-

Hovered Cells:

- -
{onlineUsers.length} user{isSingular ? '' : 's'} online diff --git a/apps/www/components/LaunchWeek/13/InteractiveGridSingle.tsx b/apps/www/components/LaunchWeek/13/InteractiveGridSingle.tsx index e0610af95f2..22bd515e92b 100644 --- a/apps/www/components/LaunchWeek/13/InteractiveGridSingle.tsx +++ b/apps/www/components/LaunchWeek/13/InteractiveGridSingle.tsx @@ -47,7 +47,7 @@ export default function InteractiveGridSingle() { (userId: string | undefined) => { if (!userId) { console.log('userId is undefined, returning black as fallback.') - return '#ffffff' // fallback color + return INTERACTIVE_GRID_COLORS(isDarkTheme).CURRENT_USER_HOVER // fallback color } // If userId already has a color, return it; otherwise, assign one @@ -216,16 +216,6 @@ export default function InteractiveGridSingle() { className="border border-gray-300 shadow-lg" />
-
-

Hovered Cells:

-
    - {Array.from(hoveredCells.entries()).map(([cell, state]) => ( -
  • - {cell} - {state.isHovered ? 'Hovered' : 'Fading'} -
  • - ))} -
-
{onlineUsers.length} user{isSingular ? '' : 's'} online diff --git a/apps/www/components/LaunchWeek/13/Ticket/TicketActions2.tsx b/apps/www/components/LaunchWeek/13/Ticket/TicketActions2.tsx index 5d431239123..5f2c6b12264 100644 --- a/apps/www/components/LaunchWeek/13/Ticket/TicketActions2.tsx +++ b/apps/www/components/LaunchWeek/13/Ticket/TicketActions2.tsx @@ -15,7 +15,7 @@ export default function TicketActions2() { const [_loading, setLoading] = useState(false) const isLessThanMd = useBreakpoint() const downloadLink = useRef() - const link = `${LW_URL}/tickets/${username}?lw=12${ + const link = `${LW_URL}/tickets/${username}?lw=13${ hasSecretTicket ? '&secret=true' : platinum ? `&platinum=true` : '' }&t=${dayjs(new Date()).format('DHHmmss')}` const permalink = encodeURIComponent(link) @@ -23,7 +23,7 @@ export default function TicketActions2() { const encodedText = encodeURIComponent(text) const tweetUrl = `https://twitter.com/intent/tweet?url=${permalink}&text=${encodedText}` const linkedInUrl = `https://www.linkedin.com/sharing/share-offsite/?url=${permalink}&text=${encodedText}` - const downloadUrl = `${process.env.NEXT_PUBLIC_SUPABASE_URL}/functions/v1/lw12-og?username=${encodeURIComponent( + const downloadUrl = `${process.env.NEXT_PUBLIC_SUPABASE_URL}/functions/v1/lw13-og?username=${encodeURIComponent( username ?? '' )}` const params = useParams() @@ -57,7 +57,7 @@ export default function TicketActions2() { shared_on_twitter: 'now', metadata: { ...metadata, hasSharedSecret: hasSecretTicket }, }) - .eq('launch_week', 'lw12') + .eq('launch_week', 'lw13') .eq('username', username) } else if (social === 'linkedin') { await supabase @@ -66,7 +66,7 @@ export default function TicketActions2() { shared_on_linkedin: 'now', metadata: { ...metadata, hasSharedSecret: hasSecretTicket }, }) - .eq('launch_week', 'lw12') + .eq('launch_week', 'lw13') .eq('username', username) } diff --git a/apps/www/components/LaunchWeek/13/Ticket/TicketingFlow.tsx b/apps/www/components/LaunchWeek/13/Ticket/TicketingFlow.tsx index 4f8674ffe37..b0cfb9fa234 100644 --- a/apps/www/components/LaunchWeek/13/Ticket/TicketingFlow.tsx +++ b/apps/www/components/LaunchWeek/13/Ticket/TicketingFlow.tsx @@ -1,28 +1,27 @@ import React, { useState } from 'react' -import dynamic from 'next/dynamic' import { AnimatePresence, m, LazyMotion, domAnimation } from 'framer-motion' -import { Badge, Button, cn } from 'ui' +import { Button, cn } from 'ui' import { DEFAULT_TRANSITION, INITIAL_BOTTOM, getAnimation } from '~/lib/animations' import { LW13_DATE, LW13_LAUNCH_DATE } from '~/lib/constants' -import useWinningChances from '../../hooks/useWinningChances' +import useWinningChances from '~/components/LaunchWeek/hooks/useWinningChances' import useConfData from '~/components/LaunchWeek/hooks/use-conf-data' import SectionContainer from '~/components/Layouts/SectionContainer' -import TicketForm from './TicketForm' -import CountdownComponent from '../Countdown' -import TicketPresence from './TicketPresence' -import TicketActions from './TicketActions' -// import LW13Background from '../LW13Background' -import TicketCopy from './TicketCopy' -import TicketActions2 from './TicketActions2' -import useLWShortcuts from '../useLWShortcuts' +import CountdownComponent from '~/components/LaunchWeek/13/Countdown' +import useLWPartyMode from '~/components/LaunchWeek/13/useLWPartyMode' import MetalTicket from '~/components/LaunchWeek/13/MetalTicket' import InteractiveGridParty from '~/components/LaunchWeek/13/InteractiveGridParty' import InteractiveGridSingle from '~/components/LaunchWeek/13/InteractiveGridSingle' +import TicketForm from '~/components/LaunchWeek/13/Ticket/TicketForm' +import TicketPresence from '~/components/LaunchWeek/13/Ticket/TicketPresence' +import TicketActions from '~/components/LaunchWeek/13/Ticket/TicketActions' +import TicketCopy from '~/components/LaunchWeek/13/Ticket/TicketCopy' +import TicketActions2 from '~/components/LaunchWeek/13/Ticket/TicketActions2' + const TicketingFlow = () => { const { ticketState, userData, showCustomizationForm } = useConfData() - const { isPartyMode, setIsPartyMode } = useLWShortcuts() + const { isPartyMode, setIsPartyMode } = useLWPartyMode() const isLoading = ticketState === 'loading' const isRegistering = ticketState === 'registration' @@ -42,8 +41,8 @@ const TicketingFlow = () => { return ( <> - -
+ +

Supabase Launch Week 13 | {LW13_DATE}

@@ -54,7 +53,7 @@ const TicketingFlow = () => { initial={exit} animate={animate} exit={exit} - className="relative w-full min-h-[400px] mx-auto py-16 md:py-24 flex flex-col items-center gap-6 text-foreground" + className="relative w-full min-h-[400px] max-h-[400px] mx-auto py-16 md:py-24 flex flex-col items-center gap-6 text-foreground" >
@@ -82,23 +81,23 @@ const TicketingFlow = () => { animate={animate} exit={exit} className={cn( - 'w-full min-h-[400px] text-left grid md:grid-cols-2 justify-center gap-6 lg:gap-8 opacity-0 invisible', + 'w-full min-h-[400px] max-h-[400px] h-full text-left grid md:grid-cols-2 justify-center gap-8 opacity-0 invisible', !hasTicket && 'opacity-100 visible' )} > -
+
-
+

Launch Week 13

{LW13_DATE}

-

+

Join us for a week of new features and level up your development

@@ -195,7 +194,8 @@ const TicketingFlow = () => {
- {isPartyMode ? : } + {/* {isPartyMode ? : } */} + {hasTicket &&
HAS_TICKET
} ) diff --git a/apps/www/components/LaunchWeek/13/useLWPartyMode.tsx b/apps/www/components/LaunchWeek/13/useLWPartyMode.tsx new file mode 100644 index 00000000000..d8102d1cd6e --- /dev/null +++ b/apps/www/components/LaunchWeek/13/useLWPartyMode.tsx @@ -0,0 +1,13 @@ +import { useState } from 'react' +import { useKey } from 'react-use' + +const useLWPartyMode = (disabled?: boolean) => { + const [isPartyMode, setIsPartyMode] = useState(true) + + useKey('p', () => setIsPartyMode(!isPartyMode), {}, [isPartyMode]) + useKey('Escape', () => setIsPartyMode(false), {}, [isPartyMode]) + + return { isPartyMode, setIsPartyMode } +} + +export default useLWPartyMode diff --git a/apps/www/components/LaunchWeek/13/useLWShortcuts.tsx b/apps/www/components/LaunchWeek/13/useLWShortcuts.tsx deleted file mode 100644 index 13561e6f56d..00000000000 --- a/apps/www/components/LaunchWeek/13/useLWShortcuts.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import { useEffect, useState } from 'react' - -const useLWShortcuts = (disabled?: boolean) => { - const [isPartyMode, setIsPartyMode] = useState(true) - - function onKeyDown(event: KeyboardEvent) { - if (disabled) return - - if (event.key === 'Escape') { - setIsPartyMode(false) - } - - const newKey = event.key.toLocaleLowerCase() - - if (!(event.metaKey || event.ctrlKey) && newKey === 'p') { - console.log('P!') - setIsPartyMode(true) - } - } - - useEffect(() => { - if (!disabled) window.addEventListener('keydown', onKeyDown) - - return () => window.removeEventListener('keydown', onKeyDown) - }, [disabled]) - - return { isPartyMode, setIsPartyMode } -} - -export default useLWShortcuts diff --git a/apps/www/pages/launch-week/index.tsx b/apps/www/pages/launch-week/index.tsx index 1b0a24aa246..1e1aa127e93 100644 --- a/apps/www/pages/launch-week/index.tsx +++ b/apps/www/pages/launch-week/index.tsx @@ -82,7 +82,7 @@ export default function LaunchWeekIndex() { setShowCustomizationForm, }} > - +