From cdfb30f76ae7d821711060740705d73ca404bbfe Mon Sep 17 00:00:00 2001
From: Cindy Halim <chalim@gitlab.com>
Date: Fri, 21 Jun 2024 16:49:34 -0400
Subject: [PATCH 01/10] Web IDE OAuth Application callout

Create callout component and add unit tests.
---
 .../components/oauth_application_callout.vue  | 120 ++++++++++++++++++
 .../ide/oauth_application_callout.js          |  21 +++
 locale/gitlab.pot                             |  30 +++++
 .../oauth_application_callout_spec.js         |  56 ++++++++
 4 files changed, 227 insertions(+)
 create mode 100644 app/assets/javascripts/ide/components/oauth_application_callout.vue
 create mode 100644 app/assets/javascripts/ide/oauth_application_callout.js
 create mode 100644 spec/frontend/ide/components/oauth_application_callout_spec.js

diff --git a/app/assets/javascripts/ide/components/oauth_application_callout.vue b/app/assets/javascripts/ide/components/oauth_application_callout.vue
new file mode 100644
index 00000000000000..76f7db1bb41531
--- /dev/null
+++ b/app/assets/javascripts/ide/components/oauth_application_callout.vue
@@ -0,0 +1,120 @@
+<script>
+import { GlAlert, GlModal, GlSprintf } from '@gitlab/ui';
+import { s__ } from '~/locale';
+
+export const I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT = {
+  alertTitle: s__(
+    "IDE|Changes to this application configuration can affect the Web IDE's functionality. Ensure that the configuration satisfies these conditions:",
+  ),
+  alertButtonText: s__('IDE|Restore to default'),
+  configurations: [
+    s__(
+      'IDE|The redirect URI path is: %{codeBlockStart}%{pathFormat}%{codeBlockEnd}. An example of a valid redirect URI: %{codeBlockStart}%{example}%{codeBlockEnd}.',
+    ),
+    s__('IDE|%{boldStart}Trusted%{boldEnd} is checked.'),
+    s__('IDE|%{boldStart}Confidential%{boldEnd} is unchecked.'),
+    s__('IDE|The %{boldStart}api%{boldEnd} scope is checked.'),
+  ],
+  modalTitle: s__('IDE|Restore application to default'),
+  modalBody: s__(
+    'IDE|Are you sure you want to restore this application to its original configuration? All your changes will be lost.',
+  ),
+  modalPrimaryButton: s__('IDE|Confirm'),
+  modalCancel: s__('IDE|Cancel'),
+};
+
+export default {
+  name: 'WebIdeOAuthApplicationCallout',
+  components: {
+    GlAlert,
+    GlModal,
+    GlSprintf,
+  },
+  inject: ['resetApplicationSettings'],
+  data() {
+    return {
+      isModalVisible: false,
+      isLoading: false,
+      resetApplicationSettings: this.resetApplicationSettings,
+    };
+  },
+  computed: {
+    modalActionPrimary() {
+      return {
+        text: I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT.modalPrimaryButton,
+        attributes: {
+          variant: 'danger',
+          id: 'confirm-restore-button',
+          disabled: this.isLoading,
+        },
+      };
+    },
+    modalActionSecondary() {
+      return {
+        text: I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT.modalCancel,
+        attributes: {
+          disabled: this.isLoading,
+        },
+      };
+    },
+  },
+  methods: {
+    displayModal() {
+      this.isModalVisible = true;
+    },
+    async restoreToDefault() {
+      this.isLoading = true;
+      try {
+        await this.resetApplicationSettings();
+        this.isModalVisible = false;
+      } finally {
+        this.isLoading = false;
+        window.location.reload();
+      }
+    },
+  },
+  redirectUrlPath: '/-/ide/oauth_redirect/',
+  urlOrigin: window.location.origin,
+  i18n: I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT,
+};
+</script>
+<template>
+  <div>
+    <gl-modal
+      v-model="isModalVisible"
+      size="sm"
+      modal-id="restore-to-default-modal"
+      :title="$options.i18n.modalTitle"
+      :action-primary="modalActionPrimary"
+      :action-secondary="modalActionSecondary"
+      @primary="restoreToDefault"
+      >{{ $options.i18n.modalBody }}
+    </gl-modal>
+    <gl-alert
+      variant="info"
+      :dismissible="false"
+      class="gl-my-5"
+      :primary-button-text="$options.i18n.alertButtonText"
+      @primaryAction="displayModal"
+    >
+      <p>{{ $options.i18n.alertTitle }}</p>
+      <ul class="gl-m-0">
+        <li v-for="(message, index) in $options.i18n.configurations" :key="index">
+          <gl-sprintf :message="message">
+            <template #bold="{ content }">
+              <strong>{{ content }}</strong>
+            </template>
+            <template #codeBlock="{ content }">
+              <code>{{
+                sprintf(content, {
+                  pathFormat: $options.redirectUrlPath,
+                  example: `${$options.urlOrigin}${$options.redirectUrlPath}`,
+                })
+              }}</code>
+            </template>
+          </gl-sprintf>
+        </li>
+      </ul>
+    </gl-alert>
+  </div>
+</template>
diff --git a/app/assets/javascripts/ide/oauth_application_callout.js b/app/assets/javascripts/ide/oauth_application_callout.js
new file mode 100644
index 00000000000000..942f66de190c63
--- /dev/null
+++ b/app/assets/javascripts/ide/oauth_application_callout.js
@@ -0,0 +1,21 @@
+import Vue from 'vue';
+import WebIdeOAuthApplicationCallout from './components/oauth_application_callout.vue';
+
+export const initWebIdeOAuthApplicationCallout = () => {
+  const el = document.querySelector('#web_ide_oauth_application_callout');
+
+  if (!el) {
+    return null;
+  }
+
+  const { resetApplicationSettings } = el.dataset;
+
+  return new Vue({
+    el,
+    name: 'WebIdeOAuthApplicationCallout',
+    provide: { resetApplicationSettings },
+    render(h) {
+      return h(WebIdeOAuthApplicationCallout);
+    },
+  });
+};
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index 655ee11de12378..2c9e801d9a3d59 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -26513,15 +26513,33 @@ msgstr ""
 msgid "IDE"
 msgstr ""
 
+msgid "IDE|%{boldStart}Confidential%{boldEnd} is unchecked."
+msgstr ""
+
+msgid "IDE|%{boldStart}Trusted%{boldEnd} is checked."
+msgstr ""
+
+msgid "IDE|Are you sure you want to restore this application to its original configuration? All your changes will be lost."
+msgstr ""
+
+msgid "IDE|Cancel"
+msgstr ""
+
 msgid "IDE|Cannot open Web IDE"
 msgstr ""
 
+msgid "IDE|Changes to this application configuration can affect the Web IDE's functionality. Ensure that the configuration satisfies these conditions:"
+msgstr ""
+
 msgid "IDE|Commit"
 msgstr ""
 
 msgid "IDE|Commit to %{branchName} branch"
 msgstr ""
 
+msgid "IDE|Confirm"
+msgstr ""
+
 msgid "IDE|Contact your administrator or try to open the Web IDE again with another domain."
 msgstr ""
 
@@ -26546,6 +26564,12 @@ msgstr ""
 msgid "IDE|Reopen with other domain"
 msgstr ""
 
+msgid "IDE|Restore application to default"
+msgstr ""
+
+msgid "IDE|Restore to default"
+msgstr ""
+
 msgid "IDE|Review"
 msgstr ""
 
@@ -26555,9 +26579,15 @@ msgstr ""
 msgid "IDE|Successful commit"
 msgstr ""
 
+msgid "IDE|The %{boldStart}api%{boldEnd} scope is checked."
+msgstr ""
+
 msgid "IDE|The URL you're using to access the Web IDE and the configured OAuth callback URL do not match. This issue often occurs when you're using a proxy."
 msgstr ""
 
+msgid "IDE|The redirect URI path is: %{codeBlockStart}%{pathFormat}%{codeBlockEnd}. An example of a valid redirect URI: %{codeBlockStart}%{example}%{codeBlockEnd}."
+msgstr ""
+
 msgid "IDE|This option is disabled because you are not allowed to create merge requests in this project."
 msgstr ""
 
diff --git a/spec/frontend/ide/components/oauth_application_callout_spec.js b/spec/frontend/ide/components/oauth_application_callout_spec.js
new file mode 100644
index 00000000000000..902b430fddc8c2
--- /dev/null
+++ b/spec/frontend/ide/components/oauth_application_callout_spec.js
@@ -0,0 +1,56 @@
+import { GlAlert, GlButton, GlModal } from '@gitlab/ui';
+import { mount } from '@vue/test-utils';
+import { nextTick } from 'vue';
+import { useMockLocationHelper } from 'helpers/mock_window_location_helper';
+import WebIdeOAuthApplicationCallout, {
+  I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT,
+} from '~/ide/components/oauth_application_callout.vue';
+
+describe('WebIdeOAuthApplicationCallout', () => {
+  const mockResetApplicationSettings = jest.fn();
+  useMockLocationHelper();
+
+  let wrapper;
+
+  const findAlert = () => wrapper.findComponent(GlAlert);
+  const findButton = () => wrapper.findComponent(GlButton);
+  const findModal = () => wrapper.findComponent(GlModal);
+
+  const createWrapper = () => {
+    wrapper = mount(WebIdeOAuthApplicationCallout, {
+      provide: {
+        resetApplicationSettings: mockResetApplicationSettings,
+      },
+    });
+  };
+
+  beforeEach(() => {
+    createWrapper();
+  });
+
+  it('renders alert', () => {
+    expect(findAlert().exists()).toBe(true);
+    expect(findButton().text()).toBe(I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT.alertButtonText);
+  });
+
+  describe('on restore button click', () => {
+    beforeEach(async () => {
+      findButton().vm.$emit('click');
+      await nextTick();
+    });
+
+    it('shows modal if restore button is clicked', () => {
+      const modal = findModal();
+      expect(modal.props('modalId')).toBe('restore-to-default-modal');
+      expect(modal.props('visible')).toBe(true);
+    });
+
+    it('calls reset application settings on modal primary action click', async () => {
+      findModal().vm.$emit('primary');
+      await nextTick();
+
+      expect(mockResetApplicationSettings).toHaveBeenCalledTimes(1);
+      expect(window.location.reload).toHaveBeenCalledTimes(1);
+    });
+  });
+});
-- 
GitLab


From 76277eac574a8dd4602c31035747d1ae4d27f510 Mon Sep 17 00:00:00 2001
From: Cindy Halim <chalim@gitlab.com>
Date: Fri, 21 Jun 2024 16:53:29 -0400
Subject: [PATCH 02/10] Restore to default application settings logic

---
 lib/web_ide/default_oauth_application.rb      | 25 +++++++++++++------
 .../web_ide/default_oauth_application_spec.rb | 20 +++++++++++++++
 2 files changed, 38 insertions(+), 7 deletions(-)

diff --git a/lib/web_ide/default_oauth_application.rb b/lib/web_ide/default_oauth_application.rb
index b9108914c9a96f..d7b5a3a3b494b2 100644
--- a/lib/web_ide/default_oauth_application.rb
+++ b/lib/web_ide/default_oauth_application.rb
@@ -25,6 +25,12 @@ def oauth_application_callback_urls
         URI.extract(oauth_application.redirect_uri, %w[http https]).uniq
       end
 
+      def reset_oauth_application_settings
+        return unless oauth_application
+
+        oauth_application.update!(default_settings)
+      end
+
       def ensure_oauth_application!
         return if oauth_application
 
@@ -35,17 +41,12 @@ def ensure_oauth_application!
           #       https://gitlab.com/gitlab-org/gitlab/-/merge_requests/132496#note_1587293087
           application_settings.lock!
 
-          # note: `lock!`` breaks applicaiton_settings cache and will trigger another query.
+          # note: `lock!`` breaks application_settings cache and will trigger another query.
           # We need to double check here so that requests previously waiting on the lock can
           # now just skip.
           next if oauth_application
 
-          application = Doorkeeper::Application.new(
-            name: 'GitLab Web IDE',
-            redirect_uri: oauth_callback_url,
-            scopes: ['api'],
-            trusted: true,
-            confidential: false)
+          application = Doorkeeper::Application.new(default_settings)
           application.save!
           application_settings.update!(web_ide_oauth_application: application)
           should_expire_cache = true
@@ -60,6 +61,16 @@ def ensure_oauth_application!
       def application_settings
         ::Gitlab::CurrentSettings.current_application_settings
       end
+
+      def default_settings
+        {
+          "name" => 'GitLab Web IDE',
+          "redirect_uri" => oauth_callback_url,
+          "scopes" => ['api'],
+          "trusted" => true,
+          "confidential" => false
+        }.freeze
+      end
     end
   end
 end
diff --git a/spec/lib/web_ide/default_oauth_application_spec.rb b/spec/lib/web_ide/default_oauth_application_spec.rb
index 4f051ffaafbedc..dc2359e771da8d 100644
--- a/spec/lib/web_ide/default_oauth_application_spec.rb
+++ b/spec/lib/web_ide/default_oauth_application_spec.rb
@@ -110,6 +110,26 @@
     end
   end
 
+  describe '#reset_oauth_application_settings' do
+    it 'resets oauth application settings to original' do
+      mock_bad_oauth_application = oauth_application
+      mock_bad_oauth_application["confidential"] = true
+      mock_bad_oauth_application["trusted"] = false
+
+      stub_application_setting({ web_ide_oauth_application: mock_bad_oauth_application })
+
+      described_class.reset_oauth_application_settings
+
+      expect(oauth_application).to have_attributes(
+        name: 'GitLab Web IDE',
+        redirect_uri: described_class.oauth_callback_url,
+        scopes: ['api'],
+        trusted: true,
+        confidential: false
+      )
+    end
+  end
+
   def application_settings
     ::Gitlab::CurrentSettings.current_application_settings
   end
-- 
GitLab


From ebe5842e51de524c08699feb549438aedf5c027f Mon Sep 17 00:00:00 2001
From: Cindy Halim <chalim@gitlab.com>
Date: Fri, 21 Jun 2024 16:54:17 -0400
Subject: [PATCH 03/10] Render callout on edit Web IDE OAuth application page

---
 app/assets/javascripts/pages/admin/applications/index.js      | 2 ++
 app/helpers/ide_helper.rb                                     | 4 ++++
 .../applications/_web_ide_oauth_application_callout.html.haml | 3 +++
 app/views/admin/applications/edit.html.haml                   | 2 ++
 4 files changed, 11 insertions(+)
 create mode 100644 app/views/admin/applications/_web_ide_oauth_application_callout.html.haml

diff --git a/app/assets/javascripts/pages/admin/applications/index.js b/app/assets/javascripts/pages/admin/applications/index.js
index df9e38431b06a9..3d52ea1530a45f 100644
--- a/app/assets/javascripts/pages/admin/applications/index.js
+++ b/app/assets/javascripts/pages/admin/applications/index.js
@@ -1,5 +1,7 @@
 import initApplicationDeleteButtons from '~/admin/applications';
 import { initOAuthApplicationSecret } from '~/oauth_application';
+import { initWebIdeOAuthApplicationCallout } from '~/ide/oauth_application_callout';
 
 initApplicationDeleteButtons();
 initOAuthApplicationSecret();
+initWebIdeOAuthApplicationCallout();
diff --git a/app/helpers/ide_helper.rb b/app/helpers/ide_helper.rb
index e36dc3c75c6657..e49d766f5b41b5 100644
--- a/app/helpers/ide_helper.rb
+++ b/app/helpers/ide_helper.rb
@@ -33,6 +33,10 @@ def web_ide_oauth_application_id
     ::WebIde::DefaultOauthApplication.oauth_application_id
   end
 
+  def reset_web_ide_oauth_application_settings
+    ::Gitlab::WebIde::DefaultOauthApplication.reset_oauth_application_settings
+  end
+
   def use_new_web_ide?
     Feature.enabled?(:vscode_web_ide, current_user)
   end
diff --git a/app/views/admin/applications/_web_ide_oauth_application_callout.html.haml b/app/views/admin/applications/_web_ide_oauth_application_callout.html.haml
new file mode 100644
index 00000000000000..a652b43b6f7440
--- /dev/null
+++ b/app/views/admin/applications/_web_ide_oauth_application_callout.html.haml
@@ -0,0 +1,3 @@
+- return unless web_ide_oauth_application_id == application.id
+
+#web_ide_oauth_application_callout{ :data => {'reset_application_settings' => reset_web_ide_oauth_application_settings.to_s} }
diff --git a/app/views/admin/applications/edit.html.haml b/app/views/admin/applications/edit.html.haml
index 10a27fb906fd02..d0ecba3f977c82 100644
--- a/app/views/admin/applications/edit.html.haml
+++ b/app/views/admin/applications/edit.html.haml
@@ -2,6 +2,8 @@
 - breadcrumb_title @application.name
 - page_title _("Edit"), @application.name, _("Applications")
 
+= render 'web_ide_oauth_application_callout', application: @application
+
 %h1.page-title.gl-font-size-h-display
   = _('Edit application')
 - @url = admin_application_path(@application)
-- 
GitLab


From 2f3df31d0e8338d4b3cc3ba7dcf50e13abc949d9 Mon Sep 17 00:00:00 2001
From: Cindy Halim <chalim@gitlab.com>
Date: Tue, 25 Jun 2024 13:34:36 +0000
Subject: [PATCH 04/10] Update copy based on suggestions

---
 .../components/oauth_application_callout.vue  | 10 ++++-----
 locale/gitlab.pot                             | 22 +++++++++----------
 2 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/app/assets/javascripts/ide/components/oauth_application_callout.vue b/app/assets/javascripts/ide/components/oauth_application_callout.vue
index 76f7db1bb41531..6e011d5176fd49 100644
--- a/app/assets/javascripts/ide/components/oauth_application_callout.vue
+++ b/app/assets/javascripts/ide/components/oauth_application_callout.vue
@@ -4,16 +4,16 @@ import { s__ } from '~/locale';
 
 export const I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT = {
   alertTitle: s__(
-    "IDE|Changes to this application configuration can affect the Web IDE's functionality. Ensure that the configuration satisfies these conditions:",
+    'IDE|Editing this application might affect the functionality of the Web IDE. Ensure the configuration meets the following conditions:',
   ),
   alertButtonText: s__('IDE|Restore to default'),
   configurations: [
     s__(
-      'IDE|The redirect URI path is: %{codeBlockStart}%{pathFormat}%{codeBlockEnd}. An example of a valid redirect URI: %{codeBlockStart}%{example}%{codeBlockEnd}.',
+      'IDE|The redirect URI path is %{codeBlockStart}%{pathFormat}%{codeBlockEnd}. An example of a valid redirect URI is %{codeBlockStart}%{example}%{codeBlockEnd}.',
     ),
-    s__('IDE|%{boldStart}Trusted%{boldEnd} is checked.'),
-    s__('IDE|%{boldStart}Confidential%{boldEnd} is unchecked.'),
-    s__('IDE|The %{boldStart}api%{boldEnd} scope is checked.'),
+    s__('IDE|The %{boldStart}Trusted%{boldEnd} checkbox is selected.'),
+    s__('IDE|The %{boldStart}Confidential%{boldEnd} checkbox is cleared.'),
+    s__('IDE|The %{boldStart}api%{boldEnd} scope is selected.'),
   ],
   modalTitle: s__('IDE|Restore application to default'),
   modalBody: s__(
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index 2c9e801d9a3d59..3da525451970f8 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -26513,12 +26513,6 @@ msgstr ""
 msgid "IDE"
 msgstr ""
 
-msgid "IDE|%{boldStart}Confidential%{boldEnd} is unchecked."
-msgstr ""
-
-msgid "IDE|%{boldStart}Trusted%{boldEnd} is checked."
-msgstr ""
-
 msgid "IDE|Are you sure you want to restore this application to its original configuration? All your changes will be lost."
 msgstr ""
 
@@ -26528,9 +26522,6 @@ msgstr ""
 msgid "IDE|Cannot open Web IDE"
 msgstr ""
 
-msgid "IDE|Changes to this application configuration can affect the Web IDE's functionality. Ensure that the configuration satisfies these conditions:"
-msgstr ""
-
 msgid "IDE|Commit"
 msgstr ""
 
@@ -26546,6 +26537,9 @@ msgstr ""
 msgid "IDE|Edit"
 msgstr ""
 
+msgid "IDE|Editing this application might affect the functionality of the Web IDE. Ensure the configuration meets the following conditions:"
+msgstr ""
+
 msgid "IDE|Error reloading page"
 msgstr ""
 
@@ -26579,13 +26573,19 @@ msgstr ""
 msgid "IDE|Successful commit"
 msgstr ""
 
-msgid "IDE|The %{boldStart}api%{boldEnd} scope is checked."
+msgid "IDE|The %{boldStart}Confidential%{boldEnd} checkbox is cleared."
+msgstr ""
+
+msgid "IDE|The %{boldStart}Trusted%{boldEnd} checkbox is selected."
+msgstr ""
+
+msgid "IDE|The %{boldStart}api%{boldEnd} scope is selected."
 msgstr ""
 
 msgid "IDE|The URL you're using to access the Web IDE and the configured OAuth callback URL do not match. This issue often occurs when you're using a proxy."
 msgstr ""
 
-msgid "IDE|The redirect URI path is: %{codeBlockStart}%{pathFormat}%{codeBlockEnd}. An example of a valid redirect URI: %{codeBlockStart}%{example}%{codeBlockEnd}."
+msgid "IDE|The redirect URI path is %{codeBlockStart}%{pathFormat}%{codeBlockEnd}. An example of a valid redirect URI is %{codeBlockStart}%{example}%{codeBlockEnd}."
 msgstr ""
 
 msgid "IDE|This option is disabled because you are not allowed to create merge requests in this project."
-- 
GitLab


From e14e82863e65b72bccdabf830460ebd405085245 Mon Sep 17 00:00:00 2001
From: Cindy Halim <chalim@gitlab.com>
Date: Wed, 26 Jun 2024 10:49:15 -0400
Subject: [PATCH 05/10] Add reset_web_ide_oauth_application_settings unit test

---
 spec/helpers/ide_helper_spec.rb | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/spec/helpers/ide_helper_spec.rb b/spec/helpers/ide_helper_spec.rb
index 59671f02e86bad..c12d0f6de94b15 100644
--- a/spec/helpers/ide_helper_spec.rb
+++ b/spec/helpers/ide_helper_spec.rb
@@ -180,4 +180,14 @@
       expect(helper.web_ide_oauth_application_id).to eq(oauth_application.id)
     end
   end
+
+  describe '#reset_web_ide_oauth_application_settings' do
+    let_it_be(:oauth_application) { create(:oauth_application, owner: nil) }
+
+    it 'resets Web IDE OAuth application settings' do
+      stub_application_setting({ web_ide_oauth_application: oauth_application })
+      helper.reset_web_ide_oauth_application_settings
+      expect(oauth_application.name).to eq('GitLab Web IDE')
+    end
+  end
 end
-- 
GitLab


From 8ad179223774c6d326c2c4f01237637b5721047b Mon Sep 17 00:00:00 2001
From: Cindy Halim <chalim@gitlab.com>
Date: Wed, 3 Jul 2024 09:15:14 -0400
Subject: [PATCH 06/10] Address MR feedback

---
 .../javascripts/ide/components/oauth_application_callout.vue    | 2 +-
 spec/helpers/ide_helper_spec.rb                                 | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/ide/components/oauth_application_callout.vue b/app/assets/javascripts/ide/components/oauth_application_callout.vue
index 6e011d5176fd49..213614c8e444ff 100644
--- a/app/assets/javascripts/ide/components/oauth_application_callout.vue
+++ b/app/assets/javascripts/ide/components/oauth_application_callout.vue
@@ -73,7 +73,7 @@ export default {
       }
     },
   },
-  redirectUrlPath: '/-/ide/oauth_redirect/',
+  redirectUrlPath: '/-/ide/oauth_redirect',
   urlOrigin: window.location.origin,
   i18n: I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT,
 };
diff --git a/spec/helpers/ide_helper_spec.rb b/spec/helpers/ide_helper_spec.rb
index c12d0f6de94b15..1d70d4947b3f4b 100644
--- a/spec/helpers/ide_helper_spec.rb
+++ b/spec/helpers/ide_helper_spec.rb
@@ -186,6 +186,7 @@
 
     it 'resets Web IDE OAuth application settings' do
       stub_application_setting({ web_ide_oauth_application: oauth_application })
+      expect(oauth_application.name).not_to eq('GitLab Web IDE')
       helper.reset_web_ide_oauth_application_settings
       expect(oauth_application.name).to eq('GitLab Web IDE')
     end
-- 
GitLab


From d0172d7a3160152c110455edecac701b251971ab Mon Sep 17 00:00:00 2001
From: Cindy Halim <chalim@gitlab.com>
Date: Thu, 11 Jul 2024 18:15:47 -0400
Subject: [PATCH 07/10] Create reset web IDE oauth application route

---
 app/controllers/ide_controller.rb    | 10 +++++++
 config/routes.rb                     |  2 ++
 spec/requests/ide_controller_spec.rb | 45 ++++++++++++++++++++++++++++
 3 files changed, 57 insertions(+)

diff --git a/app/controllers/ide_controller.rb b/app/controllers/ide_controller.rb
index 1861f0692d81fc..f5372572750fb4 100644
--- a/app/controllers/ide_controller.rb
+++ b/app/controllers/ide_controller.rb
@@ -36,6 +36,16 @@ def oauth_redirect
     render layout: 'fullscreen', locals: { minimal: true }
   end
 
+  def reset_oauth_application_settings
+    return render json: {}, status: :forbidden unless current_user.can_admin_all_resources?
+
+    success = ::Gitlab::WebIde::DefaultOauthApplication.reset_oauth_application_settings
+
+    return render json: {}, status: :bad_request unless success
+
+    render json: {}
+  end
+
   private
 
   def authorize_read_project!
diff --git a/config/routes.rb b/config/routes.rb
index 868934605a9e28..a6e0efc56fa3bd 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -164,6 +164,8 @@
           as: :remote,
           to: 'web_ide/remote_ide#index',
           constraints: { remote_host: %r{[^/?]+} }
+
+        post '/reset_oauth_application_settings' => 'ide#reset_oauth_application_settings'
       end
 
       draw :operations
diff --git a/spec/requests/ide_controller_spec.rb b/spec/requests/ide_controller_spec.rb
index 925484810e9c24..dd7e5fb13aa2d0 100644
--- a/spec/requests/ide_controller_spec.rb
+++ b/spec/requests/ide_controller_spec.rb
@@ -275,6 +275,51 @@
     end
   end
 
+  describe "#reset_oauth_application_settings" do
+    subject(:reset_oauth_application_settings) { post '/-/ide/reset_oauth_application_settings' }
+
+    before do
+      stub_feature_flags(web_ide_oauth: true)
+    end
+
+    context "with admin user" do
+      let(:admin) { create(:admin) }
+
+      before do
+        allow(admin).to receive(:can_admin_all_resources?).and_return(true)
+        sign_in(admin)
+      end
+
+      it 'returns 400 if no oauth application exists' do
+        stub_application_setting(web_ide_oauth_application: nil)
+        reset_oauth_application_settings
+
+        expect(response).to have_gitlab_http_status(:bad_request)
+      end
+
+      it 'returns 200' do
+        stub_application_setting({
+          web_ide_oauth_application: create(:oauth_application, owner_id: nil, owner_type: nil)
+        })
+
+        reset_oauth_application_settings
+
+        expect(response).to have_gitlab_http_status(:ok)
+      end
+    end
+
+    context "with non-admin user" do
+      before do
+        sign_in(user)
+      end
+
+      it('returns 403 if user is not admin') do
+        reset_oauth_application_settings
+        expect(response).to have_gitlab_http_status(:forbidden)
+      end
+    end
+  end
+
   def web_ide_oauth_application
     ::Gitlab::CurrentSettings.current_application_settings.web_ide_oauth_application
   end
-- 
GitLab


From 9923cb4f01ffb73b4936b05ab67e6bb312b829e7 Mon Sep 17 00:00:00 2001
From: Cindy Halim <chalim@gitlab.com>
Date: Thu, 11 Jul 2024 18:18:54 -0400
Subject: [PATCH 08/10] Update restore to default logic in callout

Extract restore to default confirmation modal to separate component.
Use new reset Web IDE OAuth application settings endpoint to restore to default settings.
---
 .../components/oauth_application_callout.vue  |  65 +++-------
 .../reset_application_settings_modal.vue      | 103 +++++++++++++++
 .../ide/oauth_application_callout.js          |   3 -
 app/helpers/ide_helper.rb                     |   4 -
 ...eb_ide_oauth_application_callout.html.haml |   2 +-
 locale/gitlab.pot                             |   3 +
 .../oauth_application_callout_spec.js         |  49 +++-----
 .../reset_application_settings_modal_spec.js  | 118 ++++++++++++++++++
 spec/helpers/ide_helper_spec.rb               |  11 --
 9 files changed, 259 insertions(+), 99 deletions(-)
 create mode 100644 app/assets/javascripts/ide/components/reset_application_settings_modal.vue
 create mode 100644 spec/frontend/ide/components/reset_application_settings_modal_spec.js

diff --git a/app/assets/javascripts/ide/components/oauth_application_callout.vue b/app/assets/javascripts/ide/components/oauth_application_callout.vue
index 213614c8e444ff..6ee9882ac592e7 100644
--- a/app/assets/javascripts/ide/components/oauth_application_callout.vue
+++ b/app/assets/javascripts/ide/components/oauth_application_callout.vue
@@ -1,6 +1,8 @@
 <script>
-import { GlAlert, GlModal, GlSprintf } from '@gitlab/ui';
+import { GlAlert, GlSprintf } from '@gitlab/ui';
+
 import { s__ } from '~/locale';
+import ResetApplicationSettingsModal from './reset_application_settings_modal.vue';
 
 export const I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT = {
   alertTitle: s__(
@@ -15,85 +17,46 @@ export const I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT = {
     s__('IDE|The %{boldStart}Confidential%{boldEnd} checkbox is cleared.'),
     s__('IDE|The %{boldStart}api%{boldEnd} scope is selected.'),
   ],
-  modalTitle: s__('IDE|Restore application to default'),
-  modalBody: s__(
-    'IDE|Are you sure you want to restore this application to its original configuration? All your changes will be lost.',
-  ),
-  modalPrimaryButton: s__('IDE|Confirm'),
-  modalCancel: s__('IDE|Cancel'),
 };
 
 export default {
   name: 'WebIdeOAuthApplicationCallout',
   components: {
     GlAlert,
-    GlModal,
     GlSprintf,
+    ResetApplicationSettingsModal,
   },
-  inject: ['resetApplicationSettings'],
   data() {
     return {
       isModalVisible: false,
-      isLoading: false,
-      resetApplicationSettings: this.resetApplicationSettings,
     };
   },
-  computed: {
-    modalActionPrimary() {
-      return {
-        text: I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT.modalPrimaryButton,
-        attributes: {
-          variant: 'danger',
-          id: 'confirm-restore-button',
-          disabled: this.isLoading,
-        },
-      };
-    },
-    modalActionSecondary() {
-      return {
-        text: I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT.modalCancel,
-        attributes: {
-          disabled: this.isLoading,
-        },
-      };
-    },
-  },
   methods: {
     displayModal() {
       this.isModalVisible = true;
     },
-    async restoreToDefault() {
-      this.isLoading = true;
-      try {
-        await this.resetApplicationSettings();
-        this.isModalVisible = false;
-      } finally {
-        this.isLoading = false;
-        window.location.reload();
-      }
+    hideModal() {
+      this.isModalVisible = false;
     },
   },
   redirectUrlPath: '/-/ide/oauth_redirect',
+  resetApplicationSettingsPath: '/-/ide/reset_oauth_application_settings',
   urlOrigin: window.location.origin,
   i18n: I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT,
 };
 </script>
 <template>
   <div>
-    <gl-modal
-      v-model="isModalVisible"
-      size="sm"
-      modal-id="restore-to-default-modal"
-      :title="$options.i18n.modalTitle"
-      :action-primary="modalActionPrimary"
-      :action-secondary="modalActionSecondary"
-      @primary="restoreToDefault"
-      >{{ $options.i18n.modalBody }}
-    </gl-modal>
+    <reset-application-settings-modal
+      :visible="isModalVisible"
+      :reset-application-settings-path="$options.resetApplicationSettingsPath"
+      @cancel="hideModal"
+      @close="hideModal"
+    />
     <gl-alert
       variant="info"
-      :dismissible="false"
       class="gl-my-5"
+      :dismissible="false"
       :primary-button-text="$options.i18n.alertButtonText"
       @primaryAction="displayModal"
     >
diff --git a/app/assets/javascripts/ide/components/reset_application_settings_modal.vue b/app/assets/javascripts/ide/components/reset_application_settings_modal.vue
new file mode 100644
index 00000000000000..45442f04068cec
--- /dev/null
+++ b/app/assets/javascripts/ide/components/reset_application_settings_modal.vue
@@ -0,0 +1,103 @@
+<script>
+import { GlAlert, GlModal } from '@gitlab/ui';
+import { s__ } from '~/locale';
+import axios from '~/lib/utils/axios_utils';
+
+export const I18N_RESET_APPLICATION_SETTINGS_MODAL = {
+  errorMessage: s__(
+    'IDE|An error occurred while restoring the application to default. Please try again.',
+  ),
+  title: s__('IDE|Restore application to default'),
+  body: s__(
+    'IDE|Are you sure you want to restore this application to its original configuration? All your changes will be lost.',
+  ),
+  primaryButton: s__('IDE|Confirm'),
+  cancel: s__('IDE|Cancel'),
+};
+
+export default {
+  name: 'ResetApplicationSettingsModal',
+  components: {
+    GlAlert,
+    GlModal,
+  },
+  props: {
+    visible: {
+      type: Boolean,
+      required: true,
+    },
+    resetApplicationSettingsPath: {
+      type: String,
+      required: true,
+    },
+  },
+  data() {
+    return {
+      loading: false,
+      showErrorAlert: false,
+    };
+  },
+  computed: {
+    modalActionPrimary() {
+      return {
+        text: I18N_RESET_APPLICATION_SETTINGS_MODAL.primaryButton,
+        attributes: {
+          variant: 'danger',
+          id: 'confirm-restore-button',
+          loading: this.loading,
+          type: 'submit',
+        },
+      };
+    },
+    modalActionSecondary() {
+      return {
+        text: I18N_RESET_APPLICATION_SETTINGS_MODAL.cancel,
+        attributes: {
+          loading: this.loading,
+        },
+      };
+    },
+  },
+  methods: {
+    handlePrimaryButtonClick(event) {
+      event.preventDefault();
+      this.resetApplicationSetings();
+    },
+    async resetApplicationSetings() {
+      this.loading = true;
+      this.showErrorAlert = false;
+      try {
+        await axios.post(this.resetApplicationSettingsPath);
+        this.$refs.modal.hide();
+        window.location.reload();
+      } catch (e) {
+        this.showErrorAlert = true;
+      }
+
+      this.loading = false;
+    },
+  },
+  i18n: I18N_RESET_APPLICATION_SETTINGS_MODAL,
+};
+</script>
+<template>
+  <gl-modal
+    ref="modal"
+    size="sm"
+    modal-id="reset-application-settings-modal"
+    :visible="visible"
+    :title="$options.i18n.title"
+    :action-primary="modalActionPrimary"
+    :action-secondary="modalActionSecondary"
+    v-bind="$attrs"
+    v-on="$listeners"
+    @primary="handlePrimaryButtonClick"
+  >
+    <div>
+      <gl-alert v-if="showErrorAlert" variant="danger" class="gl-mb-5" :dismissible="false">
+        {{ $options.i18n.errorMessage }}
+      </gl-alert>
+      <p>{{ $options.i18n.body }}</p>
+    </div>
+  </gl-modal>
+</template>
diff --git a/app/assets/javascripts/ide/oauth_application_callout.js b/app/assets/javascripts/ide/oauth_application_callout.js
index 942f66de190c63..7c7595a21b4f05 100644
--- a/app/assets/javascripts/ide/oauth_application_callout.js
+++ b/app/assets/javascripts/ide/oauth_application_callout.js
@@ -8,12 +8,9 @@ export const initWebIdeOAuthApplicationCallout = () => {
     return null;
   }
 
-  const { resetApplicationSettings } = el.dataset;
-
   return new Vue({
     el,
     name: 'WebIdeOAuthApplicationCallout',
-    provide: { resetApplicationSettings },
     render(h) {
       return h(WebIdeOAuthApplicationCallout);
     },
diff --git a/app/helpers/ide_helper.rb b/app/helpers/ide_helper.rb
index e49d766f5b41b5..e36dc3c75c6657 100644
--- a/app/helpers/ide_helper.rb
+++ b/app/helpers/ide_helper.rb
@@ -33,10 +33,6 @@ def web_ide_oauth_application_id
     ::WebIde::DefaultOauthApplication.oauth_application_id
   end
 
-  def reset_web_ide_oauth_application_settings
-    ::Gitlab::WebIde::DefaultOauthApplication.reset_oauth_application_settings
-  end
-
   def use_new_web_ide?
     Feature.enabled?(:vscode_web_ide, current_user)
   end
diff --git a/app/views/admin/applications/_web_ide_oauth_application_callout.html.haml b/app/views/admin/applications/_web_ide_oauth_application_callout.html.haml
index a652b43b6f7440..8ae840c96d886c 100644
--- a/app/views/admin/applications/_web_ide_oauth_application_callout.html.haml
+++ b/app/views/admin/applications/_web_ide_oauth_application_callout.html.haml
@@ -1,3 +1,3 @@
 - return unless web_ide_oauth_application_id == application.id
 
-#web_ide_oauth_application_callout{ :data => {'reset_application_settings' => reset_web_ide_oauth_application_settings.to_s} }
+#web_ide_oauth_application_callout
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index 3da525451970f8..e86c74083f8475 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -26513,6 +26513,9 @@ msgstr ""
 msgid "IDE"
 msgstr ""
 
+msgid "IDE|An error occurred while restoring the application to default. Please try again."
+msgstr ""
+
 msgid "IDE|Are you sure you want to restore this application to its original configuration? All your changes will be lost."
 msgstr ""
 
diff --git a/spec/frontend/ide/components/oauth_application_callout_spec.js b/spec/frontend/ide/components/oauth_application_callout_spec.js
index 902b430fddc8c2..52e84920b22387 100644
--- a/spec/frontend/ide/components/oauth_application_callout_spec.js
+++ b/spec/frontend/ide/components/oauth_application_callout_spec.js
@@ -1,27 +1,20 @@
-import { GlAlert, GlButton, GlModal } from '@gitlab/ui';
+import { GlAlert, GlButton } from '@gitlab/ui';
 import { mount } from '@vue/test-utils';
 import { nextTick } from 'vue';
-import { useMockLocationHelper } from 'helpers/mock_window_location_helper';
 import WebIdeOAuthApplicationCallout, {
   I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT,
 } from '~/ide/components/oauth_application_callout.vue';
+import ResetApplicationSettingsModal from '~/ide/components/reset_application_settings_modal.vue';
 
 describe('WebIdeOAuthApplicationCallout', () => {
-  const mockResetApplicationSettings = jest.fn();
-  useMockLocationHelper();
-
   let wrapper;
 
   const findAlert = () => wrapper.findComponent(GlAlert);
   const findButton = () => wrapper.findComponent(GlButton);
-  const findModal = () => wrapper.findComponent(GlModal);
+  const findModal = () => wrapper.findComponent(ResetApplicationSettingsModal);
 
   const createWrapper = () => {
-    wrapper = mount(WebIdeOAuthApplicationCallout, {
-      provide: {
-        resetApplicationSettings: mockResetApplicationSettings,
-      },
-    });
+    wrapper = mount(WebIdeOAuthApplicationCallout);
   };
 
   beforeEach(() => {
@@ -33,24 +26,22 @@ describe('WebIdeOAuthApplicationCallout', () => {
     expect(findButton().text()).toBe(I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT.alertButtonText);
   });
 
-  describe('on restore button click', () => {
-    beforeEach(async () => {
-      findButton().vm.$emit('click');
-      await nextTick();
-    });
-
-    it('shows modal if restore button is clicked', () => {
-      const modal = findModal();
-      expect(modal.props('modalId')).toBe('restore-to-default-modal');
-      expect(modal.props('visible')).toBe(true);
-    });
+  it('shows reset application settings modal on restore button click', async () => {
+    findButton().vm.$emit('click');
+    await nextTick();
+    const modal = findModal();
+    expect(modal.exists()).toBe(true);
+    expect(modal.props('visible')).toBe(true);
+  });
 
-    it('calls reset application settings on modal primary action click', async () => {
-      findModal().vm.$emit('primary');
+  it.each(['close', 'cancel'])(
+    'hides reset application settings modal on close or cancel',
+    async (eventName) => {
+      findModal().vm.$emit(eventName);
       await nextTick();
-
-      expect(mockResetApplicationSettings).toHaveBeenCalledTimes(1);
-      expect(window.location.reload).toHaveBeenCalledTimes(1);
-    });
-  });
+      const modal = findModal();
+      expect(modal.exists()).toBe(true);
+      expect(modal.props('visible')).toBe(false);
+    },
+  );
 });
diff --git a/spec/frontend/ide/components/reset_application_settings_modal_spec.js b/spec/frontend/ide/components/reset_application_settings_modal_spec.js
new file mode 100644
index 00000000000000..ca818e541f4242
--- /dev/null
+++ b/spec/frontend/ide/components/reset_application_settings_modal_spec.js
@@ -0,0 +1,118 @@
+import MockAdapter from 'axios-mock-adapter';
+import { GlAlert, GlModal } from '@gitlab/ui';
+import { mount } from '@vue/test-utils';
+import { nextTick } from 'vue';
+
+import axios from '~/lib/utils/axios_utils';
+import { HTTP_STATUS_NO_CONTENT, HTTP_STATUS_BAD_REQUEST } from '~/lib/utils/http_status';
+import ResetApplicationSettingsModal, {
+  I18N_RESET_APPLICATION_SETTINGS_MODAL,
+} from '~/ide/components/reset_application_settings_modal.vue';
+import { useMockLocationHelper } from 'helpers/mock_window_location_helper';
+import waitForPromises from 'helpers/wait_for_promises';
+import { stubComponent } from 'helpers/stub_component';
+
+const mockEvent = { preventDefault: jest.fn() };
+const mockHide = jest.fn();
+const MOCK_RESET_APPLICATION_SETTINGS_PATH = '/reset_application_settings_path';
+
+describe('ResetApplicationSettingsModal', () => {
+  useMockLocationHelper();
+
+  let mockAxios;
+  let wrapper;
+
+  const findModal = () => wrapper.findComponent(GlModal);
+  const findAlert = () => wrapper.findComponent(GlAlert);
+  const firePrimaryEvent = () => findModal().vm.$emit('primary', mockEvent);
+
+  const createWrapper = () => {
+    wrapper = mount(ResetApplicationSettingsModal, {
+      propsData: {
+        visible: true,
+        resetApplicationSettingsPath: MOCK_RESET_APPLICATION_SETTINGS_PATH,
+      },
+      stubs: {
+        GlModal: stubComponent(GlModal, {
+          methods: {
+            hide: mockHide,
+          },
+        }),
+      },
+    });
+  };
+
+  beforeEach(() => {
+    mockAxios = new MockAdapter(axios);
+
+    createWrapper();
+  });
+
+  afterEach(() => {
+    mockAxios.restore();
+  });
+
+  it('renders modal with correct props', () => {
+    const modal = findModal();
+
+    expect(modal.props('modalId')).toBe('reset-application-settings-modal');
+    expect(modal.props('title')).toEqual(I18N_RESET_APPLICATION_SETTINGS_MODAL.title);
+    expect(modal.props('visible')).toBe(true);
+  });
+
+  describe('resetApplicationSetings', () => {
+    it('makes request to reset application settings path', async () => {
+      mockAxios.onPost(MOCK_RESET_APPLICATION_SETTINGS_PATH).reply(HTTP_STATUS_NO_CONTENT);
+
+      firePrimaryEvent();
+      await waitForPromises();
+      await nextTick();
+
+      expect(mockAxios.history.post.length).toBe(1);
+      expect(mockAxios.history.post[0].url).toBe(MOCK_RESET_APPLICATION_SETTINGS_PATH);
+    });
+
+    describe('on success', () => {
+      beforeEach(async () => {
+        mockAxios.onPost(MOCK_RESET_APPLICATION_SETTINGS_PATH).reply(HTTP_STATUS_NO_CONTENT);
+
+        firePrimaryEvent();
+        await waitForPromises();
+        await nextTick();
+      });
+
+      it('closes modal and reloads window upon successful reset', () => {
+        expect(mockHide).toHaveBeenCalledTimes(1);
+        expect(window.location.reload).toHaveBeenCalledTimes(1);
+      });
+
+      it('does not display error alert', () => {
+        expect(findAlert().exists()).toBe(false);
+      });
+    });
+
+    describe('on error', () => {
+      beforeEach(async () => {
+        mockAxios.onPost(MOCK_RESET_APPLICATION_SETTINGS_PATH).reply(HTTP_STATUS_BAD_REQUEST);
+
+        firePrimaryEvent();
+        await waitForPromises();
+        await nextTick();
+      });
+
+      it('does not reload window upon error', () => {
+        expect(window.location.reload).not.toHaveBeenCalled();
+      });
+
+      it('displays error alert', () => {
+        const modal = findModal();
+        const errorAlert = findAlert();
+
+        expect(modal.props('visible')).toBe(true);
+        expect(modal.props('actionPrimary').attributes.loading).toBe(false);
+        expect(errorAlert.exists()).toBe(true);
+        expect(errorAlert.text()).toBe(I18N_RESET_APPLICATION_SETTINGS_MODAL.errorMessage);
+      });
+    });
+  });
+});
diff --git a/spec/helpers/ide_helper_spec.rb b/spec/helpers/ide_helper_spec.rb
index 1d70d4947b3f4b..59671f02e86bad 100644
--- a/spec/helpers/ide_helper_spec.rb
+++ b/spec/helpers/ide_helper_spec.rb
@@ -180,15 +180,4 @@
       expect(helper.web_ide_oauth_application_id).to eq(oauth_application.id)
     end
   end
-
-  describe '#reset_web_ide_oauth_application_settings' do
-    let_it_be(:oauth_application) { create(:oauth_application, owner: nil) }
-
-    it 'resets Web IDE OAuth application settings' do
-      stub_application_setting({ web_ide_oauth_application: oauth_application })
-      expect(oauth_application.name).not_to eq('GitLab Web IDE')
-      helper.reset_web_ide_oauth_application_settings
-      expect(oauth_application.name).to eq('GitLab Web IDE')
-    end
-  end
 end
-- 
GitLab


From 8480470e7dcfe6e9c58fea5c8b7a1e00b50bd675 Mon Sep 17 00:00:00 2001
From: Cindy Halim <chalim@gitlab.com>
Date: Mon, 15 Jul 2024 14:24:09 -0400
Subject: [PATCH 09/10] Address MR feedback

Move reset web IDE OAuth application settings to admin applications controller.
Use Rails path helper for OAuth redirect and reset application settings URLs.
---
 .../components/oauth_application_callout.vue  | 22 ++++++---
 .../ide/oauth_application_callout.js          |  9 +++-
 .../admin/applications_controller.rb          |  8 ++++
 app/controllers/ide_controller.rb             | 10 -----
 ...eb_ide_oauth_application_callout.html.haml |  2 +-
 config/routes.rb                              |  2 +-
 .../admin/applications_controller_spec.rb     | 25 +++++++++++
 .../oauth_application_callout_spec.js         | 11 ++++-
 spec/requests/ide_controller_spec.rb          | 45 -------------------
 9 files changed, 69 insertions(+), 65 deletions(-)

diff --git a/app/assets/javascripts/ide/components/oauth_application_callout.vue b/app/assets/javascripts/ide/components/oauth_application_callout.vue
index 6ee9882ac592e7..89805a434bfab2 100644
--- a/app/assets/javascripts/ide/components/oauth_application_callout.vue
+++ b/app/assets/javascripts/ide/components/oauth_application_callout.vue
@@ -26,6 +26,16 @@ export default {
     GlSprintf,
     ResetApplicationSettingsModal,
   },
+  props: {
+    redirectUrlPath: {
+      type: String,
+      required: true,
+    },
+    resetApplicationSettingsPath: {
+      type: String,
+      required: true,
+    },
+  },
   data() {
     return {
       isModalVisible: false,
@@ -38,10 +48,10 @@ export default {
     hideModal() {
       this.isModalVisible = false;
     },
+    getRedirectUrl() {
+      return new URL(this.redirectUrlPath, window.location.origin);
+    },
   },
-  redirectUrlPath: '/-/ide/oauth_redirect',
-  resetApplicationSettingsPath: '/-/ide/reset_oauth_application_settings',
-  urlOrigin: window.location.origin,
   i18n: I18N_WEB_IDE_OAUTH_APPLICATION_CALLOUT,
 };
 </script>
@@ -49,7 +59,7 @@ export default {
   <div>
     <reset-application-settings-modal
       :visible="isModalVisible"
-      :reset-application-settings-path="$options.resetApplicationSettingsPath"
+      :reset-application-settings-path="resetApplicationSettingsPath"
       @cancel="hideModal"
       @close="hideModal"
     />
@@ -70,8 +80,8 @@ export default {
             <template #codeBlock="{ content }">
               <code>{{
                 sprintf(content, {
-                  pathFormat: $options.redirectUrlPath,
-                  example: `${$options.urlOrigin}${$options.redirectUrlPath}`,
+                  pathFormat: redirectUrlPath,
+                  example: `${getRedirectUrl()}`,
                 })
               }}</code>
             </template>
diff --git a/app/assets/javascripts/ide/oauth_application_callout.js b/app/assets/javascripts/ide/oauth_application_callout.js
index 7c7595a21b4f05..a9d336c7ff2c7a 100644
--- a/app/assets/javascripts/ide/oauth_application_callout.js
+++ b/app/assets/javascripts/ide/oauth_application_callout.js
@@ -8,11 +8,18 @@ export const initWebIdeOAuthApplicationCallout = () => {
     return null;
   }
 
+  const { redirectUrlPath, resetApplicationSettingsPath } = el.dataset;
+
   return new Vue({
     el,
     name: 'WebIdeOAuthApplicationCallout',
     render(h) {
-      return h(WebIdeOAuthApplicationCallout);
+      return h(WebIdeOAuthApplicationCallout, {
+        props: {
+          redirectUrlPath,
+          resetApplicationSettingsPath,
+        },
+      });
     },
   });
 };
diff --git a/app/controllers/admin/applications_controller.rb b/app/controllers/admin/applications_controller.rb
index d97fcc5df7483b..c9419354c23242 100644
--- a/app/controllers/admin/applications_controller.rb
+++ b/app/controllers/admin/applications_controller.rb
@@ -58,6 +58,14 @@ def destroy
     redirect_to admin_applications_url, status: :found, notice: _('Application was successfully destroyed.')
   end
 
+  def reset_web_ide_oauth_application_settings
+    success = ::WebIde::DefaultOauthApplication.reset_oauth_application_settings
+
+    return render json: {}, status: :internal_server_error unless success
+
+    render json: {}
+  end
+
   private
 
   def set_application
diff --git a/app/controllers/ide_controller.rb b/app/controllers/ide_controller.rb
index f5372572750fb4..1861f0692d81fc 100644
--- a/app/controllers/ide_controller.rb
+++ b/app/controllers/ide_controller.rb
@@ -36,16 +36,6 @@ def oauth_redirect
     render layout: 'fullscreen', locals: { minimal: true }
   end
 
-  def reset_oauth_application_settings
-    return render json: {}, status: :forbidden unless current_user.can_admin_all_resources?
-
-    success = ::Gitlab::WebIde::DefaultOauthApplication.reset_oauth_application_settings
-
-    return render json: {}, status: :bad_request unless success
-
-    render json: {}
-  end
-
   private
 
   def authorize_read_project!
diff --git a/app/views/admin/applications/_web_ide_oauth_application_callout.html.haml b/app/views/admin/applications/_web_ide_oauth_application_callout.html.haml
index 8ae840c96d886c..aa72307a090147 100644
--- a/app/views/admin/applications/_web_ide_oauth_application_callout.html.haml
+++ b/app/views/admin/applications/_web_ide_oauth_application_callout.html.haml
@@ -1,3 +1,3 @@
 - return unless web_ide_oauth_application_id == application.id
 
-#web_ide_oauth_application_callout
+#web_ide_oauth_application_callout{ :data => { :redirect_url_path => ide_oauth_redirect_path, :reset_application_settings_path => ide_reset_oauth_application_settings_path } }
diff --git a/config/routes.rb b/config/routes.rb
index a6e0efc56fa3bd..c4eeaebc94a53f 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -165,7 +165,7 @@
           to: 'web_ide/remote_ide#index',
           constraints: { remote_host: %r{[^/?]+} }
 
-        post '/reset_oauth_application_settings' => 'ide#reset_oauth_application_settings'
+        post '/reset_oauth_application_settings' => 'admin/applications#reset_web_ide_oauth_application_settings'
       end
 
       draw :operations
diff --git a/spec/controllers/admin/applications_controller_spec.rb b/spec/controllers/admin/applications_controller_spec.rb
index 1feda0ed36ff13..bd131bd5f882aa 100644
--- a/spec/controllers/admin/applications_controller_spec.rb
+++ b/spec/controllers/admin/applications_controller_spec.rb
@@ -152,4 +152,29 @@
       end
     end
   end
+
+  describe "#reset_oauth_application_settings" do
+    subject(:reset_oauth_application_settings) { post :reset_web_ide_oauth_application_settings }
+
+    before do
+      stub_feature_flags(web_ide_oauth: true)
+    end
+
+    it 'returns 400 if no oauth application exists' do
+      stub_application_setting(web_ide_oauth_application: nil)
+      reset_oauth_application_settings
+
+      expect(response).to have_gitlab_http_status(:internal_server_error)
+    end
+
+    it 'returns 200 if oauth application exists' do
+      stub_application_setting({
+        web_ide_oauth_application: create(:oauth_application, owner_id: nil, owner_type: nil)
+      })
+
+      reset_oauth_application_settings
+
+      expect(response).to have_gitlab_http_status(:ok)
+    end
+  end
 end
diff --git a/spec/frontend/ide/components/oauth_application_callout_spec.js b/spec/frontend/ide/components/oauth_application_callout_spec.js
index 52e84920b22387..fd74c90789cd4c 100644
--- a/spec/frontend/ide/components/oauth_application_callout_spec.js
+++ b/spec/frontend/ide/components/oauth_application_callout_spec.js
@@ -6,6 +6,9 @@ import WebIdeOAuthApplicationCallout, {
 } from '~/ide/components/oauth_application_callout.vue';
 import ResetApplicationSettingsModal from '~/ide/components/reset_application_settings_modal.vue';
 
+const MOCK_IDE_REDIRECT_PATH = '/ide/oauth_redirect';
+const MOCK_IDE_RESET_APPLICATION_SETTINGS_PATH = '/ide/reset_application_settings';
+
 describe('WebIdeOAuthApplicationCallout', () => {
   let wrapper;
 
@@ -14,7 +17,12 @@ describe('WebIdeOAuthApplicationCallout', () => {
   const findModal = () => wrapper.findComponent(ResetApplicationSettingsModal);
 
   const createWrapper = () => {
-    wrapper = mount(WebIdeOAuthApplicationCallout);
+    wrapper = mount(WebIdeOAuthApplicationCallout, {
+      propsData: {
+        redirectUrlPath: MOCK_IDE_REDIRECT_PATH,
+        resetApplicationSettingsPath: MOCK_IDE_RESET_APPLICATION_SETTINGS_PATH,
+      },
+    });
   };
 
   beforeEach(() => {
@@ -39,6 +47,7 @@ describe('WebIdeOAuthApplicationCallout', () => {
     async (eventName) => {
       findModal().vm.$emit(eventName);
       await nextTick();
+
       const modal = findModal();
       expect(modal.exists()).toBe(true);
       expect(modal.props('visible')).toBe(false);
diff --git a/spec/requests/ide_controller_spec.rb b/spec/requests/ide_controller_spec.rb
index dd7e5fb13aa2d0..925484810e9c24 100644
--- a/spec/requests/ide_controller_spec.rb
+++ b/spec/requests/ide_controller_spec.rb
@@ -275,51 +275,6 @@
     end
   end
 
-  describe "#reset_oauth_application_settings" do
-    subject(:reset_oauth_application_settings) { post '/-/ide/reset_oauth_application_settings' }
-
-    before do
-      stub_feature_flags(web_ide_oauth: true)
-    end
-
-    context "with admin user" do
-      let(:admin) { create(:admin) }
-
-      before do
-        allow(admin).to receive(:can_admin_all_resources?).and_return(true)
-        sign_in(admin)
-      end
-
-      it 'returns 400 if no oauth application exists' do
-        stub_application_setting(web_ide_oauth_application: nil)
-        reset_oauth_application_settings
-
-        expect(response).to have_gitlab_http_status(:bad_request)
-      end
-
-      it 'returns 200' do
-        stub_application_setting({
-          web_ide_oauth_application: create(:oauth_application, owner_id: nil, owner_type: nil)
-        })
-
-        reset_oauth_application_settings
-
-        expect(response).to have_gitlab_http_status(:ok)
-      end
-    end
-
-    context "with non-admin user" do
-      before do
-        sign_in(user)
-      end
-
-      it('returns 403 if user is not admin') do
-        reset_oauth_application_settings
-        expect(response).to have_gitlab_http_status(:forbidden)
-      end
-    end
-  end
-
   def web_ide_oauth_application
     ::Gitlab::CurrentSettings.current_application_settings.web_ide_oauth_application
   end
-- 
GitLab


From 33625e3125985094e6d17b37b08c008fff5af159 Mon Sep 17 00:00:00 2001
From: Cindy Halim <chalim@gitlab.com>
Date: Wed, 17 Jul 2024 09:41:39 -0400
Subject: [PATCH 10/10] Update spec name

---
 spec/controllers/admin/applications_controller_spec.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/spec/controllers/admin/applications_controller_spec.rb b/spec/controllers/admin/applications_controller_spec.rb
index bd131bd5f882aa..fa15ba607f7da4 100644
--- a/spec/controllers/admin/applications_controller_spec.rb
+++ b/spec/controllers/admin/applications_controller_spec.rb
@@ -160,7 +160,7 @@
       stub_feature_flags(web_ide_oauth: true)
     end
 
-    it 'returns 400 if no oauth application exists' do
+    it 'returns 500 if no oauth application exists' do
       stub_application_setting(web_ide_oauth_application: nil)
       reset_oauth_application_settings
 
-- 
GitLab