mirror of
https://github.com/supabase/supabase.git
synced 2026-10-19 08:09:11 +03:00
Ivan VasilovandJoshen Lim
05a542ccea
* Add lucide-react to docs (to make the autocomplete work). * Migrate the docs app icons. * Migrate the ui-patterns. * Remove the old icons from ui package. * Migrate the www app from react-feather icons. * Migrate all of studio icons. * Migrate the only component in design-system. * Fix an old import in ui package. Revert an import in docs app. * Fix some pages in www. * Remove unneeded files used in generation of icons. * Fix a prettier error. * Fix more issues in www. * Fix an issue in Log Date picker. * Replace all string sizes with number sizes because the icons grew in some cases. * Fix more imports in security page. * Fix an extra import. * Remove the size prop from all icons if they're in a button and they match the button size. * Minor fixes for docs and www. --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
85 lines
3.2 KiB
TypeScript
85 lines
3.2 KiB
TypeScript
import Link from 'next/link'
|
|
import { Button } from 'ui'
|
|
import { Admonition } from 'ui-patterns/admonition'
|
|
|
|
import type { MemberWithFreeProjectLimit } from 'data/organizations/free-project-limit-check-query'
|
|
|
|
interface FreeProjectLimitWarningProps {
|
|
membersExceededLimit: MemberWithFreeProjectLimit[]
|
|
orgSlug: string
|
|
}
|
|
|
|
const FreeProjectLimitWarning = ({
|
|
membersExceededLimit,
|
|
orgSlug,
|
|
}: FreeProjectLimitWarningProps) => {
|
|
return (
|
|
<>
|
|
<Admonition
|
|
type={'default'}
|
|
title={'The organization has members who have exceeded their free project limits'}
|
|
description={
|
|
<div className="space-y-3">
|
|
<p className="text-sm leading-normal">
|
|
The following members have reached their maximum limits for the number of active free
|
|
plan projects within organizations where they are an administrator or owner:
|
|
</p>
|
|
<ul className="pl-5 list-disc">
|
|
{membersExceededLimit.map((member, idx: number) => (
|
|
<li key={`member-${idx}`}>
|
|
{member.username || member.primary_email} (Limit: {member.free_project_limit} free
|
|
projects)
|
|
</li>
|
|
))}
|
|
</ul>
|
|
<p className="text-sm leading-normal">
|
|
These members will need to either delete, pause, or upgrade one or more of these
|
|
projects before you're able to create a free project within this organization.
|
|
</p>
|
|
|
|
<div>
|
|
<Button asChild type="secondary">
|
|
<Link href={`/org/${orgSlug}/billing?panel=subscriptionPlan`}>Upgrade plan</Link>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
}
|
|
></Admonition>
|
|
{/* <InformationBox
|
|
icon={<AlertCircle className="text-foreground" size="large" strokeWidth={1.5} />}
|
|
defaultVisibility={true}
|
|
hideCollapse
|
|
title="The organization has members who have exceeded their free project limits"
|
|
description={
|
|
<div className="space-y-3">
|
|
<p className="text-sm leading-normal">
|
|
The following members have reached their maximum limits for the number of active free
|
|
plan projects within organizations where they are an administrator or owner:
|
|
</p>
|
|
<ul className="pl-5 list-disc">
|
|
{membersExceededLimit.map((member, idx: number) => (
|
|
<li key={`member-${idx}`}>
|
|
{member.username || member.primary_email} (Limit: {member.free_project_limit} free
|
|
projects)
|
|
</li>
|
|
))}
|
|
</ul>
|
|
<p className="text-sm leading-normal">
|
|
These members will need to either delete, pause, or upgrade one or more of these
|
|
projects before you're able to create a free project within this organization.
|
|
</p>
|
|
|
|
<div>
|
|
<Button asChild type="primary">
|
|
<Link href={`/org/${orgSlug}/billing?panel=subscriptionPlan`}>Upgrade plan</Link>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
}
|
|
/> */}
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default FreeProjectLimitWarning
|