From d2f7e4e8e0cbb81314391abb541fdeef9d4e696c Mon Sep 17 00:00:00 2001 From: Francesco Sansalvadore Date: Wed, 4 Sep 2024 15:27:56 +0200 Subject: [PATCH] fix timezones on events (#29061) * fix timezones on events * fix bucharest tz * events og image on the edge * fix merge conflict * fix meta_title --- ...scale-to-billions-generative-ai-humata.mdx | 2 +- ...__launch-week-12-meetup-tenerife-spain.mdx | 2 +- ...aunch-week-12-meetup-bucharest-romania.mdx | 2 +- .../2024-09-12-launch-week-12-hackathon.mdx | 4 +- apps/www/components/Blog/FeaturedThumb.tsx | 2 +- apps/www/components/Events/EventListItem.tsx | 28 ++++---- apps/www/lib/posts.tsx | 2 +- apps/www/pages/blog/[slug].tsx | 5 +- apps/www/pages/events/[slug].tsx | 12 +++- apps/www/public/rss.xml | 18 +++--- apps/www/types/post.ts | 1 + .../functions/og-images/component/Events.tsx | 64 +++++++++++++++++++ supabase/functions/og-images/handler.tsx | 40 +++++++++++- 13 files changed, 142 insertions(+), 40 deletions(-) create mode 100644 supabase/functions/og-images/component/Events.tsx diff --git a/apps/www/_events/2024-08-21-scale-to-billions-generative-ai-humata.mdx b/apps/www/_events/2024-08-21-scale-to-billions-generative-ai-humata.mdx index d88770b4510..ff698747969 100644 --- a/apps/www/_events/2024-08-21-scale-to-billions-generative-ai-humata.mdx +++ b/apps/www/_events/2024-08-21-scale-to-billions-generative-ai-humata.mdx @@ -1,6 +1,6 @@ --- title: 'Scale to Billions: Generative AI/Humata' -meta_title: 'Scale to Billions: Generative AI/Humata | 21 Aug 2024 | Webinar' +meta_title: 'Scale to Billions: Generative AI/Humata' subtitle: 'Quickly and cost effectively build Generative AI applications that you can use to chat with your company’s documents.' meta_description: 'Quickly and cost effectively build Generative AI applications that you can use to chat with your company’s documents.' type: 'webinar' diff --git a/apps/www/_events/2024-08-30__launch-week-12-meetup-tenerife-spain.mdx b/apps/www/_events/2024-08-30__launch-week-12-meetup-tenerife-spain.mdx index fa36c445b72..374d575385c 100644 --- a/apps/www/_events/2024-08-30__launch-week-12-meetup-tenerife-spain.mdx +++ b/apps/www/_events/2024-08-30__launch-week-12-meetup-tenerife-spain.mdx @@ -1,6 +1,6 @@ --- title: 'Supabase Launch Week 12 Meetup: Tenerife, España' -subtitle: 'Join the community @ Tándem & Coworking - La Orotava, Canarias' +subtitle: 'Join the community at Tándem & Coworking - La Orotava, Canarias' type: 'meetup' onDemand: false disable_page_build: true diff --git a/apps/www/_events/2024-09-05__launch-week-12-meetup-bucharest-romania.mdx b/apps/www/_events/2024-09-05__launch-week-12-meetup-bucharest-romania.mdx index 55e633bcf5b..3ceadd0eb2f 100644 --- a/apps/www/_events/2024-09-05__launch-week-12-meetup-bucharest-romania.mdx +++ b/apps/www/_events/2024-09-05__launch-week-12-meetup-bucharest-romania.mdx @@ -5,7 +5,7 @@ type: 'meetup' onDemand: false disable_page_build: true link: { href: https://lu.ma/x910h8kb, target: '_blank' } -date: '2024-09-05T18:00:00.000+01:00' +date: '2024-09-05T18:00:00.000+02:00' timezone: 'Europe/Belgrade' duration: '2 hours' categories: diff --git a/apps/www/_events/2024-09-12-launch-week-12-hackathon.mdx b/apps/www/_events/2024-09-12-launch-week-12-hackathon.mdx index 38de79e4dd0..7e6ee08b70e 100644 --- a/apps/www/_events/2024-09-12-launch-week-12-hackathon.mdx +++ b/apps/www/_events/2024-09-12-launch-week-12-hackathon.mdx @@ -1,11 +1,11 @@ --- title: 'Supabase Launch Week 12 Hackathon' -meta_title: 'Build an Open Source Project over 10 days. 5 prize categories.' +meta_title: 'Supabase Launch Week 12 Hackathon' subtitle: 'Build an Open Source Project over 10 days. 5 prize categories.' meta_description: 'Build an Open Source Project over 10 days. 5 prize categories.' type: 'hackathon' onDemand: false -date: '2024-09-13T10:00:00.000-07:00' +date: '2024-09-13T09:00:00.000-07:00' timezone: 'America/Los_Angeles' duration: '10 days' categories: diff --git a/apps/www/components/Blog/FeaturedThumb.tsx b/apps/www/components/Blog/FeaturedThumb.tsx index b6dde98c7c5..daa679cc99e 100644 --- a/apps/www/components/Blog/FeaturedThumb.tsx +++ b/apps/www/components/Blog/FeaturedThumb.tsx @@ -36,7 +36,7 @@ function FeaturedThumb(blog: PostTypes) {
- {blog.date} + {blog.formattedDate} • {blog.readingTime}
diff --git a/apps/www/components/Events/EventListItem.tsx b/apps/www/components/Events/EventListItem.tsx index 19446684d01..432f63ba301 100644 --- a/apps/www/components/Events/EventListItem.tsx +++ b/apps/www/components/Events/EventListItem.tsx @@ -54,26 +54,20 @@ const EventListItem = ({ event }: Props) => { )}
)} - {event.date && ( -

- {dayjs(event.date) - .tz(event.timezone ?? 'America/Los_Angeles') - .format('DD MMM YYYY')} - - - {dayjs(event.date) - .tz(event.timezone ?? 'America/Los_Angeles') - .format('hA')} - - - {dayjs(event.date) - .tz(event.timezone ?? 'America/Los_Angeles') - .format('z')} -

- )} + {event.date && } ) } +const EventDate: React.FC<{ event: PostTypes }> = ({ event }) => ( +

+ {dayjs(event.date).tz(event.timezone).format('DD MMM YYYY')} + + {dayjs(event.date).tz(event.timezone).format('hA')} + + {dayjs(event.date).tz(event.timezone).format('z')} +

+) + export default EventListItem diff --git a/apps/www/lib/posts.tsx b/apps/www/lib/posts.tsx index 9a73c6352d2..b943dbca1ef 100644 --- a/apps/www/lib/posts.tsx +++ b/apps/www/lib/posts.tsx @@ -58,7 +58,7 @@ export const getSortedPosts = ({ const frontmatter = { ...data, - date: formattedDate, + formattedDate, readingTime, url: url, path: contentPath, diff --git a/apps/www/pages/blog/[slug].tsx b/apps/www/pages/blog/[slug].tsx index 91adfa93b91..3a1bee9f20c 100644 --- a/apps/www/pages/blog/[slug].tsx +++ b/apps/www/pages/blog/[slug].tsx @@ -7,6 +7,7 @@ import Link from 'next/link' import { useRouter } from 'next/router' import { ReactMarkdown } from 'react-markdown/lib/react-markdown' import { Badge } from 'ui' +import dayjs from 'dayjs' import authors from 'lib/authors.json' import { generateReadingTime, isNotNullOrUndefined } from '~/lib/helpers' @@ -152,7 +153,7 @@ function BlogPostPage(props: InferGetStaticPropsType) {

{post.title}

-

{post.date}

+

{post.formattedDate}

@@ -262,7 +263,7 @@ function BlogPostPage(props: InferGetStaticPropsType) {

{props.blog.title}

-

{props.blog.date}

+

{dayjs(props.blog.date).format('DD MMM YYYY')}

•

{generateReadingTime(props.blog.source)}

diff --git a/apps/www/pages/events/[slug].tsx b/apps/www/pages/events/[slug].tsx index 705f36baa51..6addee6c8e6 100644 --- a/apps/www/pages/events/[slug].tsx +++ b/apps/www/pages/events/[slug].tsx @@ -13,6 +13,7 @@ import { MicrophoneIcon, HandIcon, } from '@heroicons/react/solid' +import { capitalize } from 'lodash' import authors from 'lib/authors.json' import { isNotNullOrUndefined } from '~/lib/helpers' @@ -149,10 +150,15 @@ const EventPage = ({ event }: InferGetStaticPropsType) => const IS_REGISTRATION_OPEN = event.onDemand || Date.parse(event.date) > Date.now() + const ogImageUrl = encodeURI( + `${process.env.NODE_ENV === 'development' ? 'http://127.0.0.1:54321' : 'https://obuldanrptloktxcffvn.supabase.co'}/functions/v1/og-images?site=events&eventType=${event.type}&title=${event.meta_title ?? event.title}&description=${event.meta_description ?? event.description}&date=${dayjs(event.date).tz(event.timezone).format(`DD MMM YYYY`)}&duration=${event.duration}` + ) + const meta = { - title: event.meta_title ?? event.title, + title: `${event.meta_title ?? event.title} | ${dayjs(event.date).tz(event.timezone).format(`DD MMM YYYY`)} | ${capitalize(event.type)}`, description: event.meta_description ?? event.description, url: `https://supabase.com/events/${event.slug}`, + image: ogImageUrl, } const eventIcons = { @@ -190,7 +196,9 @@ const EventPage = ({ event }: InferGetStaticPropsType) => type: 'article', images: [ { - url: `${origin}${router.basePath}/images/events/${event.image ? event.image : event.thumb}`, + url: + meta.image ?? + `${origin}${router.basePath}/images/events/${event.image ? event.image : event.thumb}`, alt: `${event.title} thumbnail`, width: 1200, height: 627, diff --git a/apps/www/public/rss.xml b/apps/www/public/rss.xml index 7c566fe9d1e..7578ff1eb28 100644 --- a/apps/www/public/rss.xml +++ b/apps/www/public/rss.xml @@ -1421,26 +1421,26 @@ Functions, GraphQL, and much more. Thu, 14 Apr 2022 22:00:00 GMT - - https://supabase.com/blog/hackathon-bring-the-func - Hackathon: Bring the Func(🕺) - https://supabase.com/blog/hackathon-bring-the-func - Build open-source projects with our latest features, win limited edition swag and plant a tree! - Thu, 31 Mar 2022 22:00:00 GMT - https://supabase.com/blog/supabase-realtime-with-multiplayer-features Supabase Realtime, with Multiplayer Features https://supabase.com/blog/supabase-realtime-with-multiplayer-features Today we're announced Realtime, with multiplayer features. Realtime enables broadcast, presence, and listening to database changes delivered over WebSockets. - Thu, 31 Mar 2022 22:00:00 GMT + Fri, 01 Apr 2022 20:30:00 GMT + + + https://supabase.com/blog/hackathon-bring-the-func + Hackathon: Bring the Func(🕺) + https://supabase.com/blog/hackathon-bring-the-func + Build open-source projects with our latest features, win limited edition swag and plant a tree! + Fri, 01 Apr 2022 14:00:00 GMT https://supabase.com/blog/supabrew Supabrew - Never Code Thirsty https://supabase.com/blog/supabrew A light and refreshing non-alcoholic beer for devs. - Thu, 31 Mar 2022 22:00:00 GMT + Fri, 01 Apr 2022 09:00:00 GMT https://supabase.com/blog/supabase-edge-functions diff --git a/apps/www/types/post.ts b/apps/www/types/post.ts index e0386a64ecb..743f26ae4ff 100644 --- a/apps/www/types/post.ts +++ b/apps/www/types/post.ts @@ -3,6 +3,7 @@ type PostTypes = { type: 'casestudy' | 'blog' title: string date?: string + formattedDate?: string coverImage?: string author?: string excerpt?: string diff --git a/supabase/functions/og-images/component/Events.tsx b/supabase/functions/og-images/component/Events.tsx new file mode 100644 index 00000000000..0ac4a925396 --- /dev/null +++ b/supabase/functions/og-images/component/Events.tsx @@ -0,0 +1,64 @@ +import React from 'https://esm.sh/react@18.2.0?deno-std=0.140.0' + +type Props = { + date: string + description: string + duration?: string + eventType: string + title: string +} + +const STORAGE_URL = 'https://obuldanrptloktxcffvn.supabase.co/storage/v1/object/public' + +const CustomerStories = (props: Props) => { + const { title, description, duration, eventType, date } = props + + const bgImageUrl = `${STORAGE_URL}/images/og-images/events/events-og-bg.png` + const supabaseLogoUrl = `${STORAGE_URL}/supabase-brand-assets/logos/supabase-logo-wordmark--dark.png` + + return ( +
+ +
+ +
+
+ + {eventType} + + + {date} + {duration && ( + <> + + Duration: {duration} + + )} +
+
+
+

{title}

+

{description}

+
+
+
+ ) +} + +export default CustomerStories diff --git a/supabase/functions/og-images/handler.tsx b/supabase/functions/og-images/handler.tsx index 30f2d341cd9..78fb5a87eff 100644 --- a/supabase/functions/og-images/handler.tsx +++ b/supabase/functions/og-images/handler.tsx @@ -2,6 +2,7 @@ import React from 'https://esm.sh/react@18.2.0?deno-std=0.140.0' import { ImageResponse } from 'https://deno.land/x/og_edge@0.0.4/mod.ts' import CustomerStories from './component/CustomerStories.tsx' import Docs from './component/Docs.tsx' +import Events from './component/Events.tsx' const corsHeaders = { 'Access-Control-Allow-Origin': '*', @@ -48,6 +49,9 @@ export async function handler(req: Request) { const type = getParamValue(url, 'type') const title = getParamValue(url, 'title', { decodeURI: true }) const description = getParamValue(url, 'description', { decodeURI: true }) + const date = getParamValue(url, 'date', { decodeURI: true }) + const eventType = getParamValue(url, 'eventType') + const duration = getParamValue(url, 'duration') if (!site || !title) { return new Response(JSON.stringify({ message: 'missing params' }), { @@ -89,7 +93,6 @@ export async function handler(req: Request) { }, } ) - break case 'customers': return new ImageResponse(, { width: 1200, @@ -107,12 +110,43 @@ export async function handler(req: Request) { 'cdn-cache-control': 'max-age=31536000', }, }) - break + case 'events': + return new ImageResponse( + ( + + ), + { + width: 1200, + height: 630, + fonts: [ + { + name: 'Circular', + data: CIRCULAR_FONT_DATA, + style: 'normal', + }, + { + name: 'SourceCode', + data: MONO_FONT_DATA, + style: 'mono', + }, + ], + headers: { + 'content-type': 'image/png', + 'cache-control': 'public, max-age=31536000, s-maxage=31536000, no-transform, immutable', + 'cdn-cache-control': 'max-age=31536000', + }, + } + ) default: return new Response(JSON.stringify({ message: 'site not found' }), { headers: { ...corsHeaders }, status: 404, }) - break } }