mirror of
https://github.com/supabase/supabase.git
synced 2026-09-22 13:37:53 +08:00
Danny White
476d4a5851
## What kind of change does this PR introduce? Mechanical cleanup on top of the Button default-variant change (#50160). ## What is the current behavior? Many callsites still pass `variant="default"` even though that is now the component default. ## What is the new behavior? Removes redundant static `variant="default"` from legacy `Button` and `ButtonTooltip` callsites. Keeps explicit defaults where they document the API: - `button-default.tsx` and `button-sizes.tsx` demos - `DocsButton`, which pins neutral styling at the wrapper boundary ## To test Studio: - [Auth → Rate Limits](https://studio-staging-2s957kwc4-supabase.vercel.app/dashboard/project/_/auth/rate-limits): dirty the form so Cancel appears; Cancel stays neutral, Save stays green - [Project Settings → API Keys](https://studio-staging-2s957kwc4-supabase.vercel.app/dashboard/project/_/settings/api-keys): `DocsButton` in the header actions stays neutral Design system: - [Design system → Button](https://design-system-git-dnywh-dc924ac1-supabase.vercel.app/design-system/docs/components/button): `button-default` / `button-sizes` still show explicit default styling; Primary (green) is restricted to the Primary section (and `asChild`) WWW: - [www → Brand assets](https://zone-www-dot-com-git-dnywh-dc924ac1-supabase.vercel.app/brand-assets): Download logo kit / Download button kit stay neutral
72 lines
2.2 KiB
TypeScript
72 lines
2.2 KiB
TypeScript
import { Check } from 'lucide-react'
|
|
import Link from 'next/link'
|
|
import { Button, IconDiscord } from 'ui'
|
|
|
|
import { NO_PROJECT_MARKER } from './SupportForm.utils'
|
|
import { useProjectDetailQuery } from '@/data/projects/project-detail-query'
|
|
import { useProfile } from '@/lib/profile'
|
|
|
|
interface SuccessProps {
|
|
sentCategory?: string
|
|
selectedProject?: string
|
|
onFinish?: () => void
|
|
finishLabel?: string
|
|
showFinishAction?: boolean
|
|
}
|
|
|
|
export const Success = ({
|
|
sentCategory: _sentCategory = '',
|
|
selectedProject = NO_PROJECT_MARKER,
|
|
onFinish,
|
|
finishLabel = 'Finish',
|
|
showFinishAction = true,
|
|
}: SuccessProps) => {
|
|
const { profile } = useProfile()
|
|
const respondToEmail = profile?.primary_email ?? 'your email'
|
|
|
|
const { data: project } = useProjectDetailQuery(
|
|
{ ref: selectedProject },
|
|
{ enabled: selectedProject !== NO_PROJECT_MARKER }
|
|
)
|
|
const projectName = project ? project.name : 'No specific project'
|
|
|
|
const finishAction = showFinishAction ? (
|
|
onFinish ? (
|
|
<Button onClick={onFinish}>{finishLabel}</Button>
|
|
) : (
|
|
<Button asChild>
|
|
<Link href="/">{finishLabel}</Link>
|
|
</Button>
|
|
)
|
|
) : null
|
|
|
|
return (
|
|
<div className="flex w-full flex-col items-center gap-4 px-4 py-4 text-center">
|
|
<Check strokeWidth={1.5} size={24} className="text-brand" />
|
|
|
|
<div className="flex max-w-[620px] flex-col items-center gap-2">
|
|
<h3 className="text-xl">Support request sent</h3>
|
|
<p className="text-balance text-sm text-foreground-light">
|
|
{selectedProject !== NO_PROJECT_MARKER && (
|
|
<>
|
|
Your ticket has been logged for{' '}
|
|
<span className="font-medium text-foreground">{projectName}</span>.{' '}
|
|
</>
|
|
)}
|
|
We'll reach out at{' '}
|
|
<span className="font-medium text-foreground">{respondToEmail}</span>.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="flex flex-wrap items-center justify-center gap-3">
|
|
{finishAction}
|
|
<Button asChild icon={<IconDiscord size={16} fill="var(--background-default)" />}>
|
|
<Link href="https://discord.supabase.com/" target="_blank">
|
|
Join Discord
|
|
</Link>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|