subflag-rails 0.6.0 → 0.6.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 474015cc849b73a4360fa11418161fbc78c6bbc163596b5b9add7e45929b6db4
-  data.tar.gz: 25f595010b6722d107b0604774ac089386e9d3ced39d7fef72411964a310140c
+  metadata.gz: 67d1ea6917f303ab8a78a5ffa90a9d5cfc3d6c30b7c13cd039f89cdd20365402
+  data.tar.gz: f8e5269abd5ef6ec77d8a4288b8a5ce91d114dcf96905d56c7aab5db368a1833
 SHA512:
-  metadata.gz: afbe39727f8e70a3273b77e49bf8127debc459487b4d01bc14693c682082592b11fd3506388a8db2bd5021e9bbb914767e19f279a56a56a30c114fe79f10b0f2
-  data.tar.gz: f124c9b3103ff13453615be92dfe7639fabfeb042d514bc4232b5a73e8fa1dcbe812e4d0fb418c45a35c33ac0e71753958d37cff01c6742ff991a408e637946f
+  metadata.gz: 7ba49356001ccb5676eccb9417e54bafc382bbc5ff0af19ad95a7567f4ac7a1fc1c2bd50505fad9d40ca4528e26e18c71900b423de149f91395c41686ce30b17
+  data.tar.gz: 18a47da01c9c44396faf29d4fe2234e4132f2479ff247aa5764f09fe0b27b361ceec05c65057f8cb8e5380ed2b9a319aa8a6fb7499882aa52ee38dcf7f0dcfab

data/CHANGELOG.md

@@ -9,13 +9,14 @@ All notable changes to this project will be documented in this file.
 - **Percentage rollouts for ActiveRecord backend**: Gradually roll out features to a percentage of users
   - Deterministic assignment using MurmurHash3 (same user always gets the same result)
   - Combine with segment conditions (e.g., "50% of pro users")
-  - Configure via Admin UI or targeting rules JSON
+  - Admin UI: percentage field in targeting rules editor
 - New dependency: `murmurhash3` gem for consistent hashing
 
 ### Changed
 
 - `TargetingEngine.evaluate` now accepts optional `flag_key:` parameter (required for percentage rollouts)
 - Targeting rules validation now accepts `percentage` as alternative to `conditions`
+- Admin UI: targeting rules now saved via fetch API with proper redirect handling
 
 ## [0.5.1] - 2025-12-15
 

data/app/views/subflag/rails/flags/edit.html.erb

@@ -49,6 +49,8 @@
   .rule-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
   .rule-value { display: flex; gap: 10px; align-items: center; margin-bottom: 10px; }
   .rule-value input { width: 200px; }
+  .rule-percentage { display: flex; gap: 10px; align-items: center; margin-bottom: 10px; }
+  .rule-percentage input { width: 80px; }
   .rule-logic { margin-bottom: 10px; }
   .rule-logic label { margin-right: 15px; }
   .condition { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
@@ -94,6 +96,8 @@
   function renderRule(rule, ruleIndex) {
     const conditions = rule.conditions?.conditions || [];
     const logicType = rule.conditions?.type || "AND";
+    const percentage = rule.percentage;
+    const hasConditions = conditions.length > 0;
 
     return `
       <div class="rule" data-rule-index="${ruleIndex}">
@@ -105,7 +109,13 @@
           <label>Return value:</label>
           <input type="text" value="${escapeHtml(rule.value || '')}" onchange="updateRuleValue(${ruleIndex}, this.value)" placeholder="value when matched">
         </div>
-        <div class="rule-logic">
+        <div class="rule-percentage">
+          <label>Percentage rollout:</label>
+          <input type="number" min="0" max="100" value="${percentage ?? ''}" onchange="updateRulePercentage(${ruleIndex}, this.value)" placeholder="">
+          <span>% of users</span>
+          <small style="color: #666;">(leave empty to match all)</small>
+        </div>
+        <div class="rule-logic" ${!hasConditions && percentage ? 'style="opacity: 0.5;"' : ''}>
           <label><input type="radio" name="logic-${ruleIndex}" value="AND" ${logicType === 'AND' ? 'checked' : ''} onchange="updateLogic(${ruleIndex}, 'AND')"> ALL match</label>
           <label><input type="radio" name="logic-${ruleIndex}" value="OR" ${logicType === 'OR' ? 'checked' : ''} onchange="updateLogic(${ruleIndex}, 'OR')"> ANY match</label>
         </div>
@@ -113,6 +123,7 @@
           ${conditions.map((c, cIndex) => renderCondition(c, ruleIndex, cIndex)).join("")}
         </div>
         <button type="button" class="btn btn-sm" onclick="addCondition(${ruleIndex})">+ Add Condition</button>
+        <small style="display: block; margin-top: 5px; color: #666;">${hasConditions && percentage ? 'User must match conditions AND be in percentage' : ''}</small>
       </div>
     `;
   }
@@ -139,7 +150,7 @@
   function addRule() {
     rules.push({
       value: "",
-      conditions: { type: "AND", conditions: [{ attribute: "", operator: "EQUALS", value: "" }] }
+      conditions: { type: "AND", conditions: [] }
     });
     renderRules();
   }
@@ -153,6 +164,15 @@
     rules[ruleIndex].value = value;
   }
 
+  function updateRulePercentage(ruleIndex, value) {
+    if (value === '' || value === null) {
+      delete rules[ruleIndex].percentage;
+    } else {
+      rules[ruleIndex].percentage = parseInt(value, 10);
+    }
+    renderRules();
+  }
+
   function updateLogic(ruleIndex, type) {
     rules[ruleIndex].conditions.type = type;
   }
@@ -180,55 +200,42 @@
   }
 
   function saveRules() {
-    const form = document.createElement("form");
-    form.method = "POST";
-    form.action = "<%= flag_path(@flag) %>";
-
-    const methodInput = document.createElement("input");
-    methodInput.type = "hidden";
-    methodInput.name = "_method";
-    methodInput.value = "PATCH";
-    form.appendChild(methodInput);
-
-    const csrfInput = document.createElement("input");
-    csrfInput.type = "hidden";
-    csrfInput.name = "<%= request_forgery_protection_token %>";
-    csrfInput.value = "<%= form_authenticity_token %>";
-    form.appendChild(csrfInput);
-
-    // Send all flag params to preserve other fields
-    const keyInput = document.createElement("input");
-    keyInput.type = "hidden";
-    keyInput.name = "flag[key]";
-    keyInput.value = "<%= @flag.key %>";
-    form.appendChild(keyInput);
-
-    const valueInput = document.createElement("input");
-    valueInput.type = "hidden";
-    valueInput.name = "flag[value]";
-    valueInput.value = "<%= @flag.value %>";
-    form.appendChild(valueInput);
-
-    const typeInput = document.createElement("input");
-    typeInput.type = "hidden";
-    typeInput.name = "flag[value_type]";
-    typeInput.value = "<%= @flag.value_type %>";
-    form.appendChild(typeInput);
-
-    const enabledInput = document.createElement("input");
-    enabledInput.type = "hidden";
-    enabledInput.name = "flag[enabled]";
-    enabledInput.value = "<%= @flag.enabled? %>";
-    form.appendChild(enabledInput);
-
-    const rulesInput = document.createElement("input");
-    rulesInput.type = "hidden";
-    rulesInput.name = "flag[targeting_rules]";
-    rulesInput.value = JSON.stringify(rules);
-    form.appendChild(rulesInput);
-
-    document.body.appendChild(form);
-    form.submit();
+    // Clean up rules before saving - filter out invalid rules
+    const cleanedRules = rules.map(rule => {
+      const cleaned = { value: rule.value };
+      if (rule.percentage !== undefined && rule.percentage !== null && rule.percentage !== '') {
+        cleaned.percentage = rule.percentage;
+      }
+      const conditions = rule.conditions?.conditions?.filter(c => c.attribute && c.operator);
+      if (conditions && conditions.length > 0) {
+        cleaned.conditions = { type: rule.conditions?.type || "AND", conditions };
+      }
+      return cleaned;
+    }).filter(rule => rule.conditions || rule.percentage !== undefined);
+
+    const formData = new FormData();
+    formData.append("flag[key]", "<%= @flag.key %>");
+    formData.append("flag[value]", "<%= @flag.value %>");
+    formData.append("flag[value_type]", "<%= @flag.value_type %>");
+    formData.append("flag[enabled]", "<%= @flag.enabled? %>");
+    formData.append("flag[targeting_rules]", JSON.stringify(cleanedRules));
+
+    fetch("<%= flag_path(@flag) %>", {
+      method: "PATCH",
+      headers: {
+        "X-CSRF-Token": "<%= form_authenticity_token %>",
+      },
+      body: formData,
+      redirect: "manual"
+    }).then(response => {
+      if (response.ok || response.type === "opaqueredirect" || response.status === 302) {
+        window.location.reload();
+      } else {
+        alert("Failed to save rules: " + response.status);
+      }
+    }).catch(err => {
+      alert("Error saving rules: " + err.message);
+    });
   }
 
   function escapeHtml(str) {

data/lib/subflag/rails/version.rb

@@ -2,6 +2,6 @@
 
 module Subflag
   module Rails
-    VERSION = "0.6.0"
+    VERSION = "0.6.1"
   end
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: subflag-rails
 version: !ruby/object:Gem::Version
-  version: 0.6.0
+  version: 0.6.1
 platform: ruby
 authors:
 - Subflag