mirror of
https://github.com/supabase/supabase.git
synced 2026-07-05 12:14:27 +08:00
cab0585533
* Replace all usage of useProjectContext with useSelectedProjectQuery * Replace all usage of useSelectedProject with useSelectedProjectQuery * Replace all usage of useProjectByRef with useProjectByRefQuery * Replace all usage of useSelectedOrganization with useSelectedOrganizationQuery * Deprecate useSelectedProject, useSelectedOrganization, and useProjectByRef hooks * Deprecate ProjecContext
101 lines
3.5 KiB
TypeScript
101 lines
3.5 KiB
TypeScript
import { PermissionAction } from '@supabase/shared-types/out/constants'
|
|
import { useQueryClient } from '@tanstack/react-query'
|
|
import { Pause } from 'lucide-react'
|
|
import { useRouter } from 'next/router'
|
|
import { useState } from 'react'
|
|
import { toast } from 'sonner'
|
|
|
|
import { useIsProjectActive } from 'components/layouts/ProjectLayout/ProjectContext'
|
|
import { ButtonTooltip } from 'components/ui/ButtonTooltip'
|
|
import { useProjectPauseMutation } from 'data/projects/project-pause-mutation'
|
|
import { setProjectStatus } from 'data/projects/projects-query'
|
|
import { useCheckPermissions } from 'hooks/misc/useCheckPermissions'
|
|
import { useSelectedOrganizationQuery } from 'hooks/misc/useSelectedOrganization'
|
|
import { useIsAwsK8sCloudProvider, useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
|
|
import { PROJECT_STATUS } from 'lib/constants'
|
|
import ConfirmationModal from 'ui-patterns/Dialogs/ConfirmationModal'
|
|
|
|
const PauseProjectButton = () => {
|
|
const router = useRouter()
|
|
const queryClient = useQueryClient()
|
|
const { data: project } = useSelectedProjectQuery()
|
|
const { data: organization } = useSelectedOrganizationQuery()
|
|
const isProjectActive = useIsProjectActive()
|
|
const [isModalOpen, setIsModalOpen] = useState(false)
|
|
|
|
const projectRef = project?.ref ?? ''
|
|
const isPaused = project?.status === PROJECT_STATUS.INACTIVE
|
|
const canPauseProject = useCheckPermissions(
|
|
PermissionAction.INFRA_EXECUTE,
|
|
'queue_jobs.projects.pause'
|
|
)
|
|
|
|
const isAwsK8s = useIsAwsK8sCloudProvider()
|
|
const isFreePlan = organization?.plan.id === 'free'
|
|
const isPaidAndNotAwsK8s = !isFreePlan && !isAwsK8s
|
|
|
|
const { mutate: pauseProject, isLoading: isPausing } = useProjectPauseMutation({
|
|
onSuccess: (_, variables) => {
|
|
setProjectStatus(queryClient, variables.ref, PROJECT_STATUS.PAUSING)
|
|
toast.success('Pausing project...')
|
|
router.push(`/project/${projectRef}`)
|
|
},
|
|
})
|
|
|
|
const requestPauseProject = () => {
|
|
if (!canPauseProject) {
|
|
return toast.error('You do not have the required permissions to pause this project')
|
|
}
|
|
pauseProject({ ref: projectRef })
|
|
}
|
|
|
|
const buttonDisabled =
|
|
isPaidAndNotAwsK8s || project === undefined || isPaused || !canPauseProject || !isProjectActive
|
|
|
|
return (
|
|
<>
|
|
<ButtonTooltip
|
|
type="default"
|
|
icon={<Pause />}
|
|
onClick={() => setIsModalOpen(true)}
|
|
loading={isPausing}
|
|
disabled={buttonDisabled}
|
|
tooltip={{
|
|
content: {
|
|
side: 'bottom',
|
|
text: isPaused
|
|
? 'Your project is already paused'
|
|
: !canPauseProject
|
|
? 'You need additional permissions to pause this project'
|
|
: !isProjectActive
|
|
? 'Unable to pause project as project is not active'
|
|
: isPaidAndNotAwsK8s
|
|
? 'Projects on a paid plan will always be running'
|
|
: undefined,
|
|
},
|
|
}}
|
|
>
|
|
Pause project
|
|
</ButtonTooltip>
|
|
|
|
<ConfirmationModal
|
|
variant={'destructive'}
|
|
visible={isModalOpen}
|
|
loading={isPausing}
|
|
title="Pause this project?"
|
|
confirmLabel="Pause project"
|
|
confirmLabelLoading="Pausing project"
|
|
onCancel={() => setIsModalOpen(false)}
|
|
onConfirm={requestPauseProject}
|
|
>
|
|
<p className="text-foreground-light text-sm">
|
|
Are you sure you want to pause this project? It will not be accessible until you unpause
|
|
it.
|
|
</p>
|
|
</ConfirmationModal>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default PauseProjectButton
|