mirror of
https://github.com/supabase/supabase.git
synced 2026-10-18 23:59:08 +03:00
Joshen LimandJonathan Summers-Muir
07699ad76b
* init * moar * moat * moar * add read replica bar * moar * Update DiskMangementPanelForm.tsx * added temp state mang to test * moar * Prepare react queries + data from API for disk mgt * moat * moat * moar * Update DiskMangementReviewAndSubmitDialog.tsx * badge updates * Hook up actual endpoints for E2E testing, but commented out for now for local dev * Hook up real data + clean up files and add tests * Update APi types * Hook up E2E and fix all validation logic * Only show new disk mgt UI for orb billing * Add note on RRs 25% more disk size * Add state to handle free plan for disk mgt * Update increase disk size CTA in reports/database * Fix file spelling errors * Address feedback * Fix missing framer motion package in ui * Address comments * Address feedabck * Minor fix * Use new disk util endpoint * Remove unused import * Address feedback * More addressing of feedback * Update pricing details for IO2 - no included disk size --------- Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
47 lines
1.6 KiB
TypeScript
47 lines
1.6 KiB
TypeScript
import { AnimatePresence, motion } from 'framer-motion'
|
|
import Link from 'next/link'
|
|
|
|
import { useOrgSubscriptionQuery } from 'data/subscriptions/org-subscription-query'
|
|
import { useSelectedOrganization } from 'hooks/misc/useSelectedOrganization'
|
|
import {
|
|
Alert_Shadcn_ as Alert,
|
|
AlertDescription_Shadcn_ as AlertDescription,
|
|
AlertTitle_Shadcn_ as AlertTitle,
|
|
buttonVariants,
|
|
cn,
|
|
InfoIcon,
|
|
} from 'ui'
|
|
|
|
export function DiskManagementPlanUpgradeRequired() {
|
|
const org = useSelectedOrganization()
|
|
const { data } = useOrgSubscriptionQuery({ orgSlug: org?.slug })
|
|
|
|
return (
|
|
<AnimatePresence>
|
|
<motion.div
|
|
initial={{ opacity: 0, height: 0 }}
|
|
animate={{ opacity: 1, height: 'auto' }}
|
|
exit={{ opacity: 0, height: 0 }}
|
|
transition={{ duration: 0.2 }}
|
|
>
|
|
<Alert variant="default" className="px-6 py-4 rounded-none [&_svg]:left-8 pl-10">
|
|
<InfoIcon className="w-4 h-4" />
|
|
<AlertTitle>Disable spend cap to manage your disk</AlertTitle>
|
|
<AlertDescription>
|
|
To access advanced disk management features, you need to disable your spend cap. These
|
|
features offer more flexibility and control over your database disk size.
|
|
</AlertDescription>
|
|
<div className="mt-3">
|
|
<Link
|
|
href={`/org/${org?.slug}/billing?panel=costControl`}
|
|
className={cn(buttonVariants({ type: 'default', size: 'tiny' }))}
|
|
>
|
|
Disable spend cap
|
|
</Link>
|
|
</div>
|
|
</Alert>
|
|
</motion.div>
|
|
</AnimatePresence>
|
|
)
|
|
}
|