mirror of
https://github.com/supabase/supabase.git
synced 2026-07-06 21:44:22 +08:00
5754c23abb
* Change all imports in the ui package which import via the @ui shortcut. * Add a new ui-patterns package. Add it to all apps. * Migrate PrivacySettings from ui to ui-patterns. * Migrate ConsentToast from ui to ui-patterns. * Remove providers folder from ui package. * Move GlassPanel. * Migrate IconPanel. * Migrate TweetCard. * Migrate ThemeImage. * Remove LWXCountdownBanner. * Migrate CountdownWidget. * Migrate SchemaTableNode. * Migrate ExpandableVideo. * Migrate ThemeToggle. * Fix bunch of imports in the docs app. * Revert some unnecessary changes. * Expand the README.md. * Fix the tailwind configs, they were using old folder structure. * Fix leftover merge conflicts. * Remove a deleted page in master. --------- Co-authored-by: Terry Sutton <saltcod@gmail.com>
44 lines
1.1 KiB
TypeScript
44 lines
1.1 KiB
TypeScript
import { useEffect, useState } from 'react'
|
|
import { cn } from 'ui'
|
|
|
|
interface CountdownStepProps {
|
|
value: string | number
|
|
unit: string
|
|
showCard?: boolean
|
|
}
|
|
|
|
function CountdownStep({ value, unit, showCard = true }: CountdownStepProps) {
|
|
const [isMounted, setIsMounted] = useState(false)
|
|
const valueWithZero = (value as number) > 9 ? value : '0' + value
|
|
|
|
useEffect(() => {
|
|
setIsMounted(true)
|
|
}, [])
|
|
|
|
if (!isMounted) return null
|
|
|
|
return (
|
|
<div
|
|
className={cn(
|
|
'font-mono uppercase text-foreground-lighter tracking-[0.05rem] text-sm',
|
|
showCard
|
|
? 'rounded-md p-[1px] overflow-hidden bg-gradient-to-b from-border-muted to-border-muted/20'
|
|
: 'tracking-[0.1rem]'
|
|
)}
|
|
>
|
|
<div
|
|
className={cn(
|
|
showCard
|
|
? 'py-1 px-2 rounded-md w-11 leading-4 flex items-center justify-center bg-black backdrop-blur-md'
|
|
: 'flex items-center justify-center w-7 py-1 px-1'
|
|
)}
|
|
>
|
|
<span className="m-0">{valueWithZero}</span>
|
|
<span>{unit}</span>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default CountdownStep
|