mirror of
https://github.com/supabase/supabase.git
synced 2026-10-05 17:35:10 +03:00
Ivan VasilovandJoshen Lim
9fa96977be
This PR fixes some prettier issues: - Bump and unify all prettier versions to 3.7.3 across teh whole repo - Bump the SQL prettier plugin - When running `test:prettier`, check `mdx` files also - Run the new prettier format on all files --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
57 lines
1.3 KiB
TypeScript
57 lines
1.3 KiB
TypeScript
import Image from 'next/image'
|
|
import { useTheme } from 'next-themes'
|
|
|
|
type VideoType = {
|
|
sources: {
|
|
src: string
|
|
type?: string
|
|
}[]
|
|
poster: string
|
|
title: string
|
|
}
|
|
|
|
interface Props {
|
|
video: VideoType
|
|
highlights?: { label: string; link?: string }[]
|
|
}
|
|
|
|
const VideoWithHighlights = (props: Props) => {
|
|
const { resolvedTheme } = useTheme()
|
|
|
|
return (
|
|
<div className="relative h-full w-full">
|
|
<video
|
|
className="relative z-10 block w-full h-full reduce-motion:hidden"
|
|
height="100%"
|
|
width="100%"
|
|
loop
|
|
muted
|
|
autoPlay
|
|
controls={false}
|
|
playsInline
|
|
poster={
|
|
props.video.poster ??
|
|
`/images/index/dashboard/supabase-table-editor${resolvedTheme?.includes('dark') ? '' : '-light'}.png`
|
|
}
|
|
>
|
|
{props.video.sources.map((source, i) => (
|
|
<source
|
|
key={`${source.src}${i === 0 ? '.webm' : '.mp4'}`}
|
|
src={`${source.src}${i === 0 ? '.webm' : '.mp4'}`}
|
|
type={(source.type ?? i === 0) ? 'video/webm' : 'video/mp4'}
|
|
/>
|
|
))}
|
|
</video>
|
|
<Image
|
|
src={props.video.poster}
|
|
alt={props.video.title}
|
|
width={1920}
|
|
height={1080}
|
|
className="reduce-motion:block relative z-0 overflow-hidden"
|
|
/>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default VideoWithHighlights
|