mirror of
https://github.com/supabase/supabase.git
synced 2026-10-13 13:19:09 +03:00
Joshen Lim
7ebb7af1f6
* CmdK OrgProjectSwitcher to swap useProjectsQuery with useProjectsInfiniteQuery * Remove usage of useProjectsQuery in ProjectDropdown * Remove usage of useProjectsQuery in NotificationsPopover * Remove usage of useProjectsQuery in NotificationsFilter * Remove usage of useProjectsQuery from LoadingState * Clean * Remove usage of getProjects from org-ai-details and fix missing key props in AIOnboarding * Remove useAutoProjectsPrefetch from org/[slug]/index * Fix TS + clean up * Clean * Remove usage of useProjectsQuery in NewOrgForm * Remove usage of useProjectsQuery in SupportForm -> AIAssistantOption * Remove usage of useProjectsQuery in PlanUpdateSidePanel * Remove usage of useProjectsQuery in NoProjectsOnPaidPlan * Remove useProjectsQuery in IntegrationPanels * Remove useProjectsQuery from IntegrationPanels 2 * Remove useProjectsQuery from IntegrationConnection * Remove useProjectsQuery from ProjectLinker, SidePanelVercelProjectLinker, and choose-project * Clean up * Remove useProjectsQuery in AwsMarketplaceLinkExistingOrg * Clean * chore/projects pagination part 08 (#39355) Optimize useProjectsQuery for Team settings * Remove console log
68 lines
2.1 KiB
TypeScript
68 lines
2.1 KiB
TypeScript
import { Boxes, Lock } from 'lucide-react'
|
|
import Link from 'next/link'
|
|
|
|
import { useIsMFAEnabled } from 'common'
|
|
import { ActionCard } from 'components/ui/ActionCard'
|
|
import { useOrgProjectsInfiniteQuery } from 'data/projects/org-projects-infinite-query'
|
|
import { Fragment } from 'react'
|
|
import { Organization } from 'types'
|
|
import { cn, Tooltip, TooltipContent, TooltipTrigger } from 'ui'
|
|
|
|
export const OrganizationCard = ({
|
|
organization,
|
|
href,
|
|
isLink = true,
|
|
className,
|
|
}: {
|
|
organization: Organization
|
|
href?: string
|
|
isLink?: boolean
|
|
className?: string
|
|
}) => {
|
|
const isUserMFAEnabled = useIsMFAEnabled()
|
|
const { data } = useOrgProjectsInfiniteQuery({ slug: organization.slug })
|
|
const numProjects = data?.pages[0].pagination.count ?? 0
|
|
const isMfaRequired = organization.organization_requires_mfa
|
|
|
|
const Parent = isLink ? Link : Fragment
|
|
|
|
return (
|
|
<Parent href={href ?? `/org/${organization.slug}`}>
|
|
<ActionCard
|
|
bgColor="bg border"
|
|
className={cn(
|
|
'flex items-center min-h-[70px] [&>div]:w-full [&>div]:items-center',
|
|
className
|
|
)}
|
|
icon={<Boxes size={18} strokeWidth={1} className="text-foreground" />}
|
|
title={organization.name}
|
|
description={
|
|
<div className="flex items-center justify-between text-xs text-foreground-light font-sans">
|
|
<div className="flex items-center gap-x-1.5">
|
|
<span>{organization.plan.name} Plan</span>
|
|
{numProjects > 0 && (
|
|
<>
|
|
<span>•</span>
|
|
<span>
|
|
{numProjects} project{numProjects > 1 ? 's' : ''}
|
|
</span>
|
|
</>
|
|
)}
|
|
</div>
|
|
{isMfaRequired && (
|
|
<Tooltip>
|
|
<TooltipTrigger className="cursor-default">
|
|
<Lock size={12} />
|
|
</TooltipTrigger>
|
|
<TooltipContent side="bottom" className={!isUserMFAEnabled ? 'w-80' : ''}>
|
|
MFA enforced
|
|
</TooltipContent>
|
|
</Tooltip>
|
|
)}
|
|
</div>
|
|
}
|
|
/>
|
|
</Parent>
|
|
)
|
|
}
|