From 2e46c9afa4bc36d542c213c7be80fc2bc489f2f7 Mon Sep 17 00:00:00 2001
From: Pavlos Koutoglou <pkoutoglou@gmail.com>
Date: Wed, 9 Jul 2025 14:51:57 +0200
Subject: [PATCH] fix: Replace sign out button with prompt button for better
 user confirmation [INS-5877] (#8841)

* refactor: replace sign out button with prompt button for better user confirmation

* refactor: replace sign out button with prompt button for improved user experience
---
 .../github-repository-settings-form.tsx       | 22 ++++++-------------
 .../gitlab-repository-settings-form.tsx       | 21 +++++-------------
 2 files changed, 13 insertions(+), 30 deletions(-)

diff --git a/packages/insomnia/src/ui/components/git-credentials/github-repository-settings-form.tsx b/packages/insomnia/src/ui/components/git-credentials/github-repository-settings-form.tsx
index 4a261672af..a35636016a 100644
--- a/packages/insomnia/src/ui/components/git-credentials/github-repository-settings-form.tsx
+++ b/packages/insomnia/src/ui/components/git-credentials/github-repository-settings-form.tsx
@@ -4,7 +4,7 @@ import { useFetcher } from 'react-router';
 
 import type { GitCredentials } from '../../../models/git-credentials';
 import type { GitRepository } from '../../../models/git-repository';
-import { showAlert } from '../modals';
+import { PromptButton } from '../base/prompt-button';
 import { GitHubRepositorySelect } from './github-repository-select';
 
 interface Props {
@@ -100,22 +100,14 @@ const GitHubRepositoryForm = ({ uri, credentials, onSubmit }: GitHubRepositoryFo
             <span className="text-sm text-[--hl]">{credentials.author.email || 'Signed in'}</span>
           </div>
         </div>
-        <Button
-          type="button"
-          onPress={() => {
-            showAlert({
-              title: 'Sign out of GitHub',
-              message:
-                'Are you sure you want to sign out? You will need to re-authenticate with GitHub to use this feature.',
-              okLabel: 'Sign out',
-              onConfirm: () => {
-                signOutFetcher.submit({}, { action: '/git-credentials/github/sign-out', method: 'POST' });
-              },
-            });
+        <PromptButton
+          confirmMessage="Confirm"
+          onClick={() => {
+            signOutFetcher.submit({}, { action: '/git-credentials/github/sign-out', method: 'POST' });
           }}
         >
-          Sign out
-        </Button>
+          Disconnect
+        </PromptButton>
       </div>
       <GitHubRepositorySelect uri={uri} token={credentials.token} />
       {error && (
diff --git a/packages/insomnia/src/ui/components/git-credentials/gitlab-repository-settings-form.tsx b/packages/insomnia/src/ui/components/git-credentials/gitlab-repository-settings-form.tsx
index 98451794d6..3ce93bfd84 100644
--- a/packages/insomnia/src/ui/components/git-credentials/gitlab-repository-settings-form.tsx
+++ b/packages/insomnia/src/ui/components/git-credentials/gitlab-repository-settings-form.tsx
@@ -4,8 +4,8 @@ import { useFetcher } from 'react-router';
 
 import type { GitCredentials } from '../../../models/git-credentials';
 import type { GitRepository } from '../../../models/git-repository';
+import { PromptButton } from '../base/prompt-button';
 import { Icon } from '../icon';
-import { showAlert } from '../modals';
 
 interface Props {
   uri?: string;
@@ -98,22 +98,13 @@ const GitLabRepositoryForm = ({ uri, credentials, onSubmit }: GitLabRepositoryFo
             <span className="text-sm text-[--hl]">{credentials.author.email || 'Signed in'}</span>
           </div>
         </div>
-        <Button
-          type="button"
-          onPress={() => {
-            showAlert({
-              title: 'Sign out of GitLab',
-              message:
-                'Are you sure you want to sign out? You will need to re-authenticate with GitLab to use this feature.',
-              okLabel: 'Sign out',
-              onConfirm: () => {
-                signOutFetcher.submit({}, { action: '/git-credentials/gitlab/sign-out', method: 'POST' });
-              },
-            });
+        <PromptButton
+          onClick={() => {
+            signOutFetcher.submit({}, { action: '/git-credentials/gitlab/sign-out', method: 'POST' });
           }}
         >
-          Sign out
-        </Button>
+          Disconnect
+        </PromptButton>
       </div>
       <TextField autoFocus name="uri" className="flex w-full flex-col gap-1 px-0.5" isRequired>
         <Label className="text-start text-sm font-semibold">Git URI (https, including .git suffix)</Label>