diff --git a/apps/www/components/LaunchWeek/Releases/LW7/components/index.tsx b/apps/www/components/LaunchWeek/Releases/LW7/components/index.tsx new file mode 100644 index 00000000000..15a879d4d67 --- /dev/null +++ b/apps/www/components/LaunchWeek/Releases/LW7/components/index.tsx @@ -0,0 +1,237 @@ +import { Badge } from 'ui' + +import styles from '../styles/launchWeek7.module.css' +import Link from 'next/link' + +export const PencilSvg = () => ( + + + +) +export const DocsSvg = () => ( + + + +) +export const PlaySvg = () => ( + + + +) +export const GithubSvg = () => ( + + + +) +export const LinkSvg = () => ( + + + +) +export const HackernewsSvg = () => ( + + + + +) + +export const SmallCard = ({ + className, + bgGradient = false, + children, +}: { + className?: string + bgGradient?: boolean + children: any +}) => ( +
+
+ {children} +
+
+) + +export const StyledArticleBadge = ({ + className, + children, +}: { + className?: string + children: any +}) => ( +
+
+ + {children} + +
+
+) + +export const AccordionHeader = ({ date, day, title, shipped }: any) => { + return ( +
+
+ + + {shipped ? 'Shipped' : 'Coming Soon'} + + + + + {day} + {date && ( + + ・ {date} + + )} + +
+ {shipped && {title}} +
+ ) +} + +export const ChipLink = ({ href, children }: { href: string; children: any }) => ( + + + {children} + + +) + +export const SectionButtons = ({ + blog, + docs, + video, + github, + url, + hackernews, +}: { + blog?: string + docs?: string + video?: string + github?: string + url?: string + hackernews?: string +}) => { + return ( +
+ {!!blog && ( + + Blog post +
+ +
+ + )} + {!!docs && ( + + Docs +
+ +
+ + )} + {!!video && ( + + Video +
+ +
+ + )} + {!!github && ( + + View on Github +
+ +
+ + )} + {!!url && ( + + Read +
+ +
+ + )} + {hackernews && ( + + Read +
+ +
+ + )} +
+ ) +} + +export const CartTitle = ({ children }: { children: any }) => ( + + {children} + +) + +export default { + AccordionHeader, + DocsSvg, + PencilSvg, + PlaySvg, + CartTitle, + ChipLink, + SectionButtons, + SmallCard, + StyledArticleBadge, +} diff --git a/apps/www/components/LaunchWeek/Releases/LW7/index.tsx b/apps/www/components/LaunchWeek/Releases/LW7/index.tsx index 2e0c773d370..a6653a19ffc 100644 --- a/apps/www/components/LaunchWeek/Releases/LW7/index.tsx +++ b/apps/www/components/LaunchWeek/Releases/LW7/index.tsx @@ -1,194 +1,33 @@ -// @ts-nocheck import Image from 'next/image' +import { useEffect } from 'react' +import { Accordion } from 'ui' -import _days from '~/components/LaunchWeek/lw7_days.json' +import days, { WeekDayProps, endOfLW7 } from '~/components/LaunchWeek/lw7_days' import SectionContainer from '~/components/Layouts/SectionContainer' +import { + AccordionHeader, + CartTitle, + ChipLink, + PencilSvg, + PlaySvg, + SectionButtons, + SmallCard, + StyledArticleBadge, +} from './components' -import { createClient, SupabaseClient } from '@supabase/supabase-js' -import { useEffect, useState } from 'react' -import { Accordion, Badge } from 'ui' - -import styleUtils from './styles/utils7.module.css' import styles from './styles/launchWeek7.module.css' -import Link from 'next/link' - -interface WeekDayProps { - title: string - shipped: boolean - date: string - publishedAt: string - description: string - d: number - dd: string - youtube_id: string - blogpost: string - docs: string - steps: { - title: string - blog: string - isNew: boolean - description: string - }[] -} - -const days = _days as WeekDayProps[] - -const PencilSvg = () => ( - - - -) -const DocsSvg = () => ( - - - -) -const PlaySvg = () => ( - - - -) - -const SmallCard = ({ className, children, bgGradient = false }) => ( -
-
- {children} -
-
-) - -const StyledArticleBadge = ({ className, children }) => ( -
-
- - {children} - -
-
-) export default function LW7Releases() { - const [supabase, setSupabase] = useState(null) - - useEffect(() => { - if (!supabase) { - setSupabase( - createClient( - process.env.NEXT_PUBLIC_SUPABASE_URL!, - process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY! - ) - ) - } - }, []) + const [preRelease, day1, day2, day3, day4, day5] = days + const publishedSections = + days + .filter((day: WeekDayProps) => Date.parse(day.publishedAt) <= Date.now()) + .map((day: WeekDayProps) => day.d.toString()) ?? [] useEffect(() => { document.body.className = 'dark bg-[#1C1C1C]' }, []) - const AccordionHeader = ({ date, day, title, shipped }: any) => { - return ( -
-
- - - {shipped ? 'Shipped' : 'Coming Soon'} - - - - - {day} - {date && ( - - ・ {date} - - )} - -
- {shipped && {title}} -
- ) - } - - const SectionButtons = ({ blog, docs, video }) => { - return ( -
- -
- Blog post -
- -
-
- - {docs && ( - -
- Docs -
- -
-
- - )} - {video && ( - -
- Video -
- -
-
- - )} -
- ) - } - const [preRelease, day1, day2, day3, day4, day5] = days - - const publishedSections = - days - .filter( - (day) => - // Date.parse(day.publishedAt) <= Date.now() - true - ) - .map((day) => day.d.toString()) ?? [] - const prereleaseShipped = Date.parse(preRelease.publishedAt) <= Date.now() const day1Shipped = Date.parse(day1.publishedAt) <= Date.now() const day2Shipped = Date.parse(day2.publishedAt) <= Date.now() @@ -196,13 +35,23 @@ export default function LW7Releases() { const day4Shipped = Date.parse(day4.publishedAt) <= Date.now() const day5Shipped = Date.parse(day5.publishedAt) <= Date.now() + const isHackathonLive = prereleaseShipped && Date.parse(endOfLW7) >= Date.now() + return ( <> -
- +
+
-
+
- - -
- {/*
- - - -
*/} -
- SupaClub -
-
-
- - -
- Blog post -
- -
-
- - + + Blog post +
+ +
+
@@ -279,7 +89,7 @@ export default function LW7Releases() { size="large" className="text-scale-900 dark:text-white" justified={false} - bordered={false} + // bordered={false} chevronAlign="right" defaultValue={publishedSections} > @@ -320,7 +130,7 @@ export default function LW7Releases() {
New - - {preRelease.steps[1].title} - + {preRelease.steps[1].title}

{preRelease.steps[1].description}

diff --git a/apps/www/components/LaunchWeek/Ticket/ActualTicket.tsx b/apps/www/components/LaunchWeek/Ticket/ActualTicket.tsx index 1fe88229da0..f5e6b665540 100644 --- a/apps/www/components/LaunchWeek/Ticket/ActualTicket.tsx +++ b/apps/www/components/LaunchWeek/Ticket/ActualTicket.tsx @@ -164,7 +164,7 @@ export default function Ticket({ href={`${SITE_URL}/${username ? '?referral=' + username : ''}`} className={`flex items-center justify-center gap-2 text-[#2e2e2e]`} > - Get your ticket + Go to Launch Week 7
diff --git a/apps/www/components/LaunchWeek/lw7_days.json b/apps/www/components/LaunchWeek/lw7_days.json deleted file mode 100644 index 1a4fd2b4646..00000000000 --- a/apps/www/components/LaunchWeek/lw7_days.json +++ /dev/null @@ -1,146 +0,0 @@ -[ - { - "title": "AI generated OG images", - "shipped": true, - "date": "", - "publishedAt": "2023-04-04T07:00:00.000-07:00", - "description": "AI generated OG images", - "d": 0, - "dd": "Pre-release", - "youtube_id": "", - "blogpost": "https://supabase.com/blog/new-supabase-docs-built-with-nextjs", - "docs": "https://supabase.com/docs", - "steps": [ - { - "title": "AI generated OG images", - "blog": "/blog/", - "isNew": false, - "description": "" - }, - { - "title": "Supavisor", - "blog": "/blog/", - "docs": "/docs", - "isNew": true, - "description": "" - } - ] - }, - { - "title": "Self-hosted Logs & observability", - "shipped": false, - "date": "10 Apr 2023", - "publishedAt": "2023-04-10T07:00:00.000-07:00", - "description": "Supabase Docs", - "d": 1, - "dd": "Monday", - "youtube_id": "OpPOaJI_Z28", - "blogpost": "https://supabase.com/blog/new-supabase-docs-built-with-nextjs", - "docs": "https://supabase.com/docs", - "steps": [ - { - "title": "Supabase Docs", - "blog": "/blog/new-supabase-docs-built-with-nextjs", - "docs": "/docs", - "isNew": true, - "description": "" - } - ] - }, - { - "title": "Self-hosted Edge Functions", - "shipped": false, - "date": "11 Apr 2023", - "publishedAt": "2023-04-11T07:00:00.000-07:00", - "description": "Image Transformations", - "d": 2, - "dd": "Tuesday", - "youtube_id": "iqZlPtl_b-I", - "blogpost": "https://supabase.com/blog", - "docs": "https://supabase.com/docs", - "steps": [ - { - "title": "Image Transformations", - "blog": "", - "docs": "", - "isNew": true, - "description": "" - }, - { - "title": "Smart CDN", - "description": "Faster asset delivery, now even faster.", - "blog": "/blog/storage-image-resizing-smart-cdn", - "docs": "/docs/guides/storage/cdn", - "isNew": true - } - ] - }, - { - "title": "Storage v3 Multipart upload", - "shipped": false, - "date": "12 Apr 2023", - "publishedAt": "2023-04-12T07:00:00.000-07:00", - "description": "Storage v3 Multipart upload", - "d": 3, - "dd": "Wednesday", - "youtube_id": "CGZr5tybW18", - "blogpost": "https://supabase.com/blog", - "docs": "https://supabase.com/docs", - "steps": [ - { - "title": "Storage v3 Multipart upload", - "blog": "/blog/mfa-auth-via-rls", - "docs": "/docs/guides/auth/auth-mfa", - "isNew": false, - "description": "" - } - ] - }, - { - "title": "SSO Support for Projects", - "shipped": false, - "date": "13 Apr 2023", - "publishedAt": "2023-04-13T07:00:00.000-07:00", - "description": "Supabase Wrappers", - "d": 4, - "dd": "Thursday", - "youtube_id": "QA2qC5F-4OU", - "blogpost": "/blog/postgres-foreign-data-wrappers-rust", - "docs": "https://supabase.com/docs", - "steps": [ - { - "title": "Supabase Wrappers", - "blog": "/blog/postgres-foreign-data-wrappers-rust", - "docs": "https://supabase.github.io/wrappers/", - "isNew": true, - "description": "Connect Postgres to external systems with Postgres Foreign Data Wrappers" - } - ] - }, - { - "title": "Community Highlight", - "shipped": false, - "date": "14 Apr 2023", - "publishedAt": "2023-04-14T07:00:00.000-07:00", - "description": "Vault Release", - "d": 5, - "dd": "Friday", - "youtube_id": "6bGQotxisoY", - "blogpost": "https://supabase.com/blog", - "docs": "https://supabase.com/docs", - "steps": [ - { - "title": "Vault Release", - "blog": "/blog/vault-now-in-beta", - "isNew": true, - "description": "" - }, - { - "title": "Transparent Column Encryption", - "description": "Faster asset delivery, now even faster.", - "blog": "/blog/transparent-column-encryption-with-postgres", - "isNew": true - } - ] - } -] diff --git a/apps/www/components/LaunchWeek/lw7_days.ts b/apps/www/components/LaunchWeek/lw7_days.ts new file mode 100644 index 00000000000..af1be6972a0 --- /dev/null +++ b/apps/www/components/LaunchWeek/lw7_days.ts @@ -0,0 +1,178 @@ +export interface WeekDayProps { + title: string + shipped: boolean + date: string + publishedAt: string + description: string + d: number + dd: string + youtube_id: string + blogpost: string + docs: string + steps: { + title: string + blog?: string + docs?: string + isNew?: boolean + description?: string + thumb?: string + github?: string + url?: string + youtube_id?: string + }[] +} + +export const endOfLW7 = '2023-04-16T23:59:59.999-07:00' + +const days: WeekDayProps[] = [ + { + title: 'AI generated OG images', + shipped: true, + date: '', + publishedAt: '2023-04-07T07:00:00.000-07:00', + description: 'AI generated OG images', + d: 0, + dd: 'Pre-release', + youtube_id: '', + blogpost: 'https://supabase.com/blog/new-supabase-docs-built-with-nextjs', + docs: 'https://supabase.com/docs', + steps: [ + { + title: 'AI generated OG images', + blog: '/blog/', + docs: '', + isNew: false, + description: '', + thumb: '/images/launchweek/seven/day0/ai-images-thumb.png', + }, + { + title: 'Supavisor', + github: '/blog/', + }, + ], + }, + { + title: 'Self-hosted Logs & observability', + shipped: false, + date: '10 Apr 2023', + publishedAt: '2023-04-10T07:00:00.000-07:00', + description: 'Supabase Docs', + d: 1, + dd: 'Monday', + youtube_id: 'OpPOaJI_Z28', + blogpost: 'https://supabase.com/blog/new-supabase-docs-built-with-nextjs', + docs: 'https://supabase.com/docs', + steps: [ + { + title: 'Supabase Docs', + blog: '/blog/new-supabase-docs-built-with-nextjs', + docs: '/docs', + isNew: true, + description: '', + thumb: '/images/launchweek/seven/day1/self-hosted-logs-thumb.png', + }, + ], + }, + { + title: 'Self-hosted Edge Functions', + shipped: false, + date: '11 Apr 2023', + publishedAt: '2023-04-11T07:00:00.000-07:00', + description: 'Image Transformations', + d: 2, + dd: 'Tuesday', + youtube_id: 'iqZlPtl_b-I', + blogpost: 'https://supabase.com/blog', + docs: 'https://supabase.com/docs', + steps: [ + { + title: 'Image Transformations', + blog: '', + docs: '', + isNew: true, + description: '', + thumb: '/images/launchweek/seven/day2/self-hosted-edge-functions-thumb.png', + }, + { + title: 'Smart CDN', + description: 'Faster asset delivery, now even faster.', + blog: '/blog/storage-image-resizing-smart-cdn', + docs: '/docs/guides/storage/cdn', + isNew: true, + }, + ], + }, + { + title: 'Storage v3 Multipart upload', + shipped: false, + date: '12 Apr 2023', + publishedAt: '2023-04-12T07:00:00.000-07:00', + description: 'Storage v3 Multipart upload', + d: 3, + dd: 'Wednesday', + youtube_id: 'CGZr5tybW18', + blogpost: 'https://supabase.com/blog', + docs: 'https://supabase.com/docs', + steps: [ + { + title: 'Storage v3 Multipart upload', + blog: '/blog/mfa-auth-via-rls', + docs: '/docs/guides/auth/auth-mfa', + isNew: false, + description: '', + thumb: '/images/launchweek/seven/day3/storage-v3-thumb.png', + }, + ], + }, + { + title: 'SSO Support for Projects', + shipped: false, + date: '13 Apr 2023', + publishedAt: '2023-04-13T07:00:00.000-07:00', + description: 'Supabase Wrappers', + d: 4, + dd: 'Thursday', + youtube_id: 'QA2qC5F-4OU', + blogpost: '/blog/postgres-foreign-data-wrappers-rust', + docs: 'https://supabase.com/docs', + steps: [ + { + title: 'Supabase Wrappers', + blog: '/blog/postgres-foreign-data-wrappers-rust', + docs: 'https://supabase.github.io/wrappers/', + isNew: true, + description: '', + thumb: '/images/launchweek/seven/day4/SSO-support-thumb.png', + }, + ], + }, + { + title: 'Community Highlight', + shipped: false, + date: '14 Apr 2023', + publishedAt: '2023-04-14T07:00:00.000-07:00', + description: 'Vault Release', + d: 5, + dd: 'Friday', + youtube_id: '6bGQotxisoY', + blogpost: 'https://supabase.com/blog', + docs: 'https://supabase.com/docs', + steps: [ + { + title: 'Vault Release', + blog: '/blog/vault-now-in-beta', + isNew: true, + description: '', + thumb: '/images/launchweek/seven/day0/ai-images-thumb.png', + }, + { + title: 'Transparent Column Encryption', + description: '', + blog: '/blog/transparent-column-encryption-with-postgres', + isNew: true, + }, + ], + }, +] + +export default days diff --git a/apps/www/pages/launch-week/index.tsx b/apps/www/pages/launch-week/index.tsx index d8962dfb569..1ce31ca65a5 100644 --- a/apps/www/pages/launch-week/index.tsx +++ b/apps/www/pages/launch-week/index.tsx @@ -1,21 +1,28 @@ -import { NextSeo } from 'next-seo' import { GetServerSideProps } from 'next' -import DefaultLayout from '~/components/Layouts/Default' -import SectionContainer from '~/components/Layouts/SectionContainer' -import TicketContainer from '~/components/LaunchWeek/Ticket/TicketContainer' -import { SITE_ORIGIN, SITE_URL } from '~/lib/constants' +import { NextSeo } from 'next-seo' +import { useState, useEffect } from 'react' +import dynamic from 'next/dynamic' import { useRouter } from 'next/router' import { createClient, Session, SupabaseClient } from '@supabase/supabase-js' -import { useState, useEffect } from 'react' -import { IconArrowDown } from 'ui' -import LaunchWeekPrizeSection from '~/components/LaunchWeek/LaunchSection/LaunchWeekPrizeSection' -import { LaunchWeekLogoHeader } from '~/components/LaunchWeek/LaunchSection/LaunchWeekLogoHeader' +import { SITE_ORIGIN, SITE_URL } from '~/lib/constants' + +import { IconArrowDown } from 'ui' +import DefaultLayout from '~/components/Layouts/Default' +import SectionContainer from '~/components/Layouts/SectionContainer' +import { LaunchWeekLogoHeader } from '~/components/LaunchWeek/LaunchSection/LaunchWeekLogoHeader' import { UserData } from '~/components/LaunchWeek/Ticket/hooks/use-conf-data' -import TicketBrickWall from '~/components/LaunchWeek/LaunchSection/TicketBrickWall' -import LW7BgGraphic from '../../components/LaunchWeek/LW7BgGraphic' -import CTABanner from '../../components/CTABanner' -import LW7Releases from '../../components/LaunchWeek/Releases/LW7' +import LW7BgGraphic from '~/components/LaunchWeek/LW7BgGraphic' + +const TicketContainer = dynamic(() => import('~/components/LaunchWeek/Ticket/TicketContainer')) +const LW7Releases = dynamic(() => import('~/components/LaunchWeek/Releases/LW7')) +const LaunchWeekPrizeSection = dynamic( + () => import('~/components/LaunchWeek/LaunchSection/LaunchWeekPrizeSection') +) +const TicketBrickWall = dynamic( + () => import('~/components/LaunchWeek/LaunchSection/TicketBrickWall') +) +const CTABanner = dynamic(() => import('~/components/CTABanner')) interface Props { users: UserData[] @@ -29,15 +36,16 @@ const supabaseAdmin = createClient( ) export default function TicketHome({ users }: Props) { + const { query } = useRouter() + const [supabase, setSupabase] = useState(null) + const [session, setSession] = useState(null) + const [isGolden, setIsGolden] = useState(false) + const TITLE = 'Supabase LaunchWeek 7' const DESCRIPTION = 'Supabase Launch Week 7 | 10–14 April 2023' const OG_IMAGE = `${SITE_ORIGIN}/images/launchweek/seven/launch-week-7-teaser.jpg` - const [supabase, setSupabase] = useState(null) - const [session, setSession] = useState(null) - const { query } = useRouter() const ticketNumber = query.ticketNumber?.toString() const bgImageId = query.bgImageId?.toString() - const [isGolden, setIsGolden] = useState(false) const defaultUserData = { id: query.id?.toString(), @@ -97,7 +105,7 @@ export default function TicketHome({ users }: Props) { />