From b49d2a87ddf82082f8ba2d65e1c68a2b7c8488d3 Mon Sep 17 00:00:00 2001
From: Joshen Lim <joshenlimek@gmail.com>
Date: Thu, 19 Jan 2023 15:45:54 +0800
Subject: [PATCH] Disable pause button if project is already paused

---
 .../Infrastructure/PauseProjectButton.tsx     | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/studio/components/interfaces/Settings/General/Infrastructure/PauseProjectButton.tsx b/studio/components/interfaces/Settings/General/Infrastructure/PauseProjectButton.tsx
index 4923bfcb441..9c198671b9e 100644
--- a/studio/components/interfaces/Settings/General/Infrastructure/PauseProjectButton.tsx
+++ b/studio/components/interfaces/Settings/General/Infrastructure/PauseProjectButton.tsx
@@ -24,6 +24,7 @@ const PauseProjectButton: FC<Props> = observer(({ projectRef, projectId }) => {
   const openModal = () => setIsModalOpen(true)
   const closeModal = () => setIsModalOpen(false)
 
+  const isPaused = ui?.selectedProject?.status === PROJECT_STATUS.INACTIVE
   const canPauseProject = checkPermissions(
     PermissionAction.INFRA_EXECUTE,
     'queue_jobs.projects.pause'
@@ -66,12 +67,24 @@ const PauseProjectButton: FC<Props> = observer(({ projectRef, projectId }) => {
             icon={<IconPause />}
             onClick={openModal}
             loading={loading}
-            disabled={!canPauseProject}
+            disabled={isPaused || !canPauseProject}
           >
             Pause Project
           </Button>
         </Tooltip.Trigger>
-        {!canPauseProject && (
+        {isPaused ? (
+          <Tooltip.Content side="bottom">
+            <Tooltip.Arrow className="radix-tooltip-arrow" />
+            <div
+              className={[
+                'rounded bg-scale-100 py-1 px-2 leading-none shadow', // background
+                'border border-scale-200 ', //border
+              ].join(' ')}
+            >
+              <span className="text-xs text-scale-1200">Your project is already paused</span>
+            </div>
+          </Tooltip.Content>
+        ) : !canPauseProject ? (
           <Tooltip.Content side="bottom">
             <Tooltip.Arrow className="radix-tooltip-arrow" />
             <div
@@ -85,6 +98,8 @@ const PauseProjectButton: FC<Props> = observer(({ projectRef, projectId }) => {
               </span>
             </div>
           </Tooltip.Content>
+        ) : (
+          <></>
         )}
       </Tooltip.Root>
       <ConfirmModal