From 240669da3a793128549a0133f26f511151111372 Mon Sep 17 00:00:00 2001
From: David Taylor <david@taylorhq.com>
Date: Wed, 31 Aug 2022 18:40:40 +0100
Subject: [PATCH] FIX: Immediately show sql options when badge query is
 supplied

`buffered` and `model` are EmberObjects, so we need to call `get()` when accessing values to ensure they are autotracked
---
 .../addon/controllers/admin-badges/show.js    |  4 ++--
 .../addon/templates/admin-badges/show.hbs     |  6 +++---
 .../acceptance/admin-badges-show-test.js      | 21 ++++++++++++++++++-
 3 files changed, 25 insertions(+), 6 deletions(-)

diff --git a/app/assets/javascripts/admin/addon/controllers/admin-badges/show.js b/app/assets/javascripts/admin/addon/controllers/admin-badges/show.js
index 55077f17ea2..0a360789a27 100644
--- a/app/assets/javascripts/admin/addon/controllers/admin-badges/show.js
+++ b/app/assets/javascripts/admin/addon/controllers/admin-badges/show.js
@@ -81,8 +81,8 @@ export default class AdminBadgesShowController extends Controller.extend(
   }
 
   get hasQuery() {
-    let modelQuery = this.model.query;
-    let bufferedQuery = this.bufferedQuery;
+    let modelQuery = this.model.get("query");
+    let bufferedQuery = this.buffered.get("query");
 
     if (bufferedQuery) {
       return bufferedQuery.trim().length > 0;
diff --git a/app/assets/javascripts/admin/addon/templates/admin-badges/show.hbs b/app/assets/javascripts/admin/addon/templates/admin-badges/show.hbs
index 1cf2bbab5a7..31b16af4cc0 100644
--- a/app/assets/javascripts/admin/addon/templates/admin-badges/show.hbs
+++ b/app/assets/javascripts/admin/addon/templates/admin-badges/show.hbs
@@ -97,21 +97,21 @@
 
         <div class="control-group">
           <label>
-            <Input @type="checkbox" @checked={{this.buffered.auto_revoke}} disabled={{this.readOnly}} />
+            <Input name="auto_revoke" @type="checkbox" @checked={{this.buffered.auto_revoke}} disabled={{this.readOnly}} />
             {{i18n "admin.badges.auto_revoke"}}
           </label>
         </div>
 
         <div class="control-group">
           <label>
-            <Input @type="checkbox" @checked={{this.buffered.target_posts}} disabled={{this.readOnly}} />
+            <Input name="target_posts" @type="checkbox" @checked={{this.buffered.target_posts}} disabled={{this.readOnly}} />
             {{i18n "admin.badges.target_posts"}}
           </label>
         </div>
 
         <div class="control-group">
           <label for="trigger">{{i18n "admin.badges.trigger"}}</label>
-          <ComboBox @name="trigger" @value={{this.buffered.trigger}} @content={{this.badgeTriggers}} @onChange={{action (mut this.buffered.trigger)}} @options={{hash
+          <ComboBox name="trigger" @value={{this.buffered.trigger}} @content={{this.badgeTriggers}} @onChange={{action (mut this.buffered.trigger)}} @options={{hash
               disabled=this.readOnly
             }} />
         </div>
diff --git a/app/assets/javascripts/discourse/tests/acceptance/admin-badges-show-test.js b/app/assets/javascripts/discourse/tests/acceptance/admin-badges-show-test.js
index 531342e2fff..2464e770b93 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/admin-badges-show-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/admin-badges-show-test.js
@@ -3,8 +3,9 @@ import {
   exists,
   query,
 } from "discourse/tests/helpers/qunit-helpers";
-import { click, visit } from "@ember/test-helpers";
+import { click, fillIn, settled, visit } from "@ember/test-helpers";
 import { test } from "qunit";
+import { set } from "@ember/object";
 
 acceptance("Admin - Badges - Show", function (needs) {
   needs.user();
@@ -37,6 +38,24 @@ acceptance("Admin - Badges - Show", function (needs) {
       exists(".image-uploader"),
       "image uploader becomes visible after clicking the upload image radio button"
     );
+
+    // SQL fields
+    assert.false(exists("label[for=query]"), "sql input is hidden by default");
+    set(this.siteSettings, "enable_badge_sql", true);
+    await settled();
+    assert.true(exists("label[for=query]"), "sql input shows when enabled");
+
+    assert.false(
+      exists("input[name=auto_revoke]"),
+      "does not show sql-specific options when query is blank"
+    );
+
+    await fillIn(".ace-wrapper textarea", "SELECT 1");
+
+    assert.true(
+      exists("input[name=auto_revoke]"),
+      "shows sql-specific options when query is present"
+    );
   });
 
   test("existing badge that has an icon", async function (assert) {