mirror of
https://github.com/supabase/supabase.git
synced 2026-10-08 02:45:07 +03:00
[FE-2942] feat(studio): add partner icon to org selection cards (#44513)
Show Vercel/AWS partner badge on organization selection cards, matching the existing behaviour in the org dropdown switcher. Uses the existing `PartnerIcon` component. **Added:** - `PartnerIcon` to `OrganizationCard` – renders alongside the MFA lock icon on the right side of each card <img width="626" height="275" alt="Screenshot 2026-04-03 at 5 36 54 PM" src="https://github.com/user-attachments/assets/f3cd2eb4-bf9d-4b42-b94c-e4636ebf7303" /> ## To test - Verify Vercel-managed orgs show the Vercel triangle badge <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Partner icon now appears in the organization card header next to the MFA/security indicator. * **Style** * Improved alignment and spacing of header elements; MFA tooltip now appears alongside the icon with consistent sizing. * Cleaner grouping of header metadata for easier scanning and visual clarity. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com> Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
1 file changed
+14
-10
@@ -5,6 +5,7 @@ import { Fragment } from 'react'
|
||||
import { cn, Tooltip, TooltipContent, TooltipTrigger } from 'ui'
|
||||
|
||||
import { ActionCard } from '@/components/ui/ActionCard'
|
||||
import PartnerIcon from '@/components/ui/PartnerIcon'
|
||||
import { useOrgProjectsInfiniteQuery } from '@/data/projects/org-projects-infinite-query'
|
||||
import type { Organization } from '@/types'
|
||||
|
||||
@@ -49,16 +50,19 @@ export const OrganizationCard = ({
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
{isMfaRequired && (
|
||||
<Tooltip>
|
||||
<TooltipTrigger className="cursor-default">
|
||||
<Lock size={12} />
|
||||
</TooltipTrigger>
|
||||
<TooltipContent side="bottom" className={!isUserMFAEnabled ? 'w-80' : ''}>
|
||||
MFA enforced
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
)}
|
||||
<div className="flex items-center gap-x-2">
|
||||
<PartnerIcon organization={organization} />
|
||||
{isMfaRequired && (
|
||||
<Tooltip>
|
||||
<TooltipTrigger className="cursor-default">
|
||||
<Lock size={12} />
|
||||
</TooltipTrigger>
|
||||
<TooltipContent side="bottom" className={!isUserMFAEnabled ? 'w-80' : ''}>
|
||||
MFA enforced
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
/>
|
||||
|
||||
Reference in new issue
Block a user