Add exclusive scope behavior to api key creation form

rubygems · Jan 26, 2024 · f0d06f4 · f0d06f4
1 parent ceb715f
commit f0d06f4
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 10 deletions.
diff --git a/app/helpers/api_keys_helper.rb b/app/helpers/api_keys_helper.rb
@@ -5,6 +5,19 @@ def gem_scope(api_key)
     api_key.rubygem ? api_key.rubygem.name : t("api_keys.all_gems")
   end
 
+  def api_key_scope_html_data(api_scope)
+    if ApiKey::EXCLUSIVE_SCOPES.include?(api_scope)
+      {
+        api_key_form_target: "exclusiveCheckbox"
+      }
+    else
+      {
+        api_key_form_target: "checkbox",
+        gemscope: ApiKey::APPLICABLE_GEM_API_SCOPES.include?(api_scope) ? api_scope : nil
+      }
+    end
+  end
+
   private
 
   def invalid_gem_tooltip(name)

diff --git a/app/javascript/controllers/api_key_form_controller.js b/app/javascript/controllers/api_key_form_controller.js
@@ -1,24 +1,38 @@
 import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
-  static targets = ["gemCheckbox", "gemSelector"]
+  static targets = ["checkbox", "exclusiveCheckbox", "gemSelector"]
 
   connect() {
     this.toggleGemSelector();
   }
 
-  gemCheckboxTargetConnected(el) {
-    el.addEventListener("click", () => this.toggleGemSelector() );
+  checkboxTargetConnected(el) {
+    el.addEventListener("change", () => {
+      if (el.checked) { this.exclusiveCheckboxTarget.checked = false }
+      if (el.dataset.gemscope) { this.toggleGemSelector(); }
+    })
+  }
+
+  exclusiveCheckboxTargetConnected(el) {
+    el.addEventListener("change", () => {
+      if (el.checked) { this.checkboxTargets.forEach((checkbox) => checkbox.checked = false) }
+      this.toggleGemSelector();
+    });
   }
 
   toggleGemSelector() {
-    var isApplicableGemSelected = this.gemCheckboxTargets.find((target) => target.checked);
-    if (isApplicableGemSelected) {
+    // what type is checkboxTargets?
+    var selected = this.checkboxTargets.find(function(target) {
+      return target.dataset.gemscope && target.checked
+    })
+
+    if (selected) {
       this.gemSelectorTarget.disabled = false;
       this.removeHiddenRubygemField();
     } else {
       this.gemSelectorTarget.value = "";
-      this.gemSelectorTarget.disable = true;
+      this.gemSelectorTarget.disabled = true;
       this.addHiddenRubygemField();
     }
   }

diff --git a/app/models/api_key.rb b/app/models/api_key.rb
@@ -1,6 +1,7 @@
 class ApiKey < ApplicationRecord
-  API_SCOPES = %i[index_rubygems push_rubygem yank_rubygem add_owner remove_owner access_webhooks show_dashboard].freeze
+  API_SCOPES = %i[show_dashboard index_rubygems push_rubygem yank_rubygem add_owner remove_owner access_webhooks].freeze
   APPLICABLE_GEM_API_SCOPES = %i[push_rubygem yank_rubygem add_owner remove_owner].freeze
+  EXCLUSIVE_SCOPES = %i[show_dashboard].freeze
 
   belongs_to :owner, polymorphic: true
 

diff --git a/app/views/api_keys/new.html.erb b/app/views/api_keys/new.html.erb
@@ -5,12 +5,20 @@
     <%= label_tag :name, t("api_keys.index.name"), class: "form__label" %>
     <%= f.text_field :name, class: "form__input", autocomplete: :off %>
 
+    <div class="form__group">
+      <%= label_tag :scope, t("api_keys.index.exclusive_scopes"), class: "form__label" %>
+      <% ApiKey::EXCLUSIVE_SCOPES.each do |api_scope| %>
+        <div class = "form__checkbox__item">
+          <%= f.check_box "#{api_scope}", { class: "form__checkbox__input", id: "#{api_scope}", data: api_key_scope_html_data(api_scope) }, "true", "false" %>
+          <%= label_tag api_scope, t("api_keys.index.#{api_scope}"), class: "form__checkbox__label" %>
+        </div>
+      <% end %>
+    </div>
     <div class="form__group">
       <%= label_tag :scope, t("api_keys.index.scopes"), class: "form__label" %>
-      <% ApiKey::API_SCOPES.each do |api_scope| %>
-        <% data = { api_key_form_target: "gemCheckbox" } if ApiKey::APPLICABLE_GEM_API_SCOPES.include?(api_scope) %>
+      <% (ApiKey::API_SCOPES - ApiKey::EXCLUSIVE_SCOPES).each do |api_scope| %>
         <div class = "form__checkbox__item">
-          <%= f.check_box "#{api_scope}", { class: "form__checkbox__input", id: "#{api_scope}", data: data }, "true", "false" %>
+          <%= f.check_box "#{api_scope}", { class: "form__checkbox__input", id: "#{api_scope}", data: api_key_scope_html_data(api_scope) }, "true", "false" %>
           <%= label_tag api_scope, t("api_keys.index.#{api_scope}"), class: "form__checkbox__label" %>
         </div>
       <% end %>