From c6dd79c805abd08def8f9eccef587604f35ed23d Mon Sep 17 00:00:00 2001
From: Bianca Nenciu <nbianca@users.noreply.github.com>
Date: Mon, 17 Jan 2022 13:45:40 +0200
Subject: [PATCH] FIX: Do not stringify null parameters (#151)

Sometimes the query page did not load if one of the query was null
because it called null.toString() and raised an exception.
---
 .../discourse/components/param-input.js.es6   |  2 +-
 assets/stylesheets/explorer.scss              |  6 +++--
 .../acceptance/run-query-test.js.es6          | 26 +++++++++++++++++++
 3 files changed, 31 insertions(+), 3 deletions(-)

diff --git a/assets/javascripts/discourse/components/param-input.js.es6 b/assets/javascripts/discourse/components/param-input.js.es6
index 97dd855..945c283 100644
--- a/assets/javascripts/discourse/components/param-input.js.es6
+++ b/assets/javascripts/discourse/components/param-input.js.es6
@@ -58,7 +58,7 @@ export default Ember.Component.extend({
       return this.params[this.get("info.identifier")];
     },
     set(key, value) {
-      this.params[this.get("info.identifier")] = value.toString();
+      this.params[this.get("info.identifier")] = value?.toString();
       return value;
     },
   }),
diff --git a/assets/stylesheets/explorer.scss b/assets/stylesheets/explorer.scss
index 5a8ebaf..48da11e 100644
--- a/assets/stylesheets/explorer.scss
+++ b/assets/stylesheets/explorer.scss
@@ -238,7 +238,8 @@ table.group-reports {
 
 .query-params {
   border: 1px solid var(--header_primary-medium);
-  .param > input {
+  .param > input,
+  .param > .select-kit {
     margin: 9px;
   }
   .invalid > input {
@@ -257,7 +258,8 @@ table.group-reports {
         width: 100px !important; // override an inline style
       }
     }
-    input {
+    input,
+    .select-kit {
       width: 190px;
     }
   }
diff --git a/test/javascripts/acceptance/run-query-test.js.es6 b/test/javascripts/acceptance/run-query-test.js.es6
index d342b64..1cc0cff 100644
--- a/test/javascripts/acceptance/run-query-test.js.es6
+++ b/test/javascripts/acceptance/run-query-test.js.es6
@@ -117,6 +117,26 @@ acceptance("Data Explorer Plugin | Run Query", function (needs) {
             hidden: false,
             user_id: -1,
           },
+          {
+            id: -7,
+            sql: "-- [params]\n-- user_id :user\n\nSELECT :user_id\n\n",
+            name: "Invalid Query",
+            description: "",
+            param_info: [
+              {
+                identifier: "user",
+                type: "user_id",
+                default: null,
+                nullable: false,
+              },
+            ],
+            created_at: "2022-01-14T16:40:05.458Z",
+            username: "bianca",
+            group_ids: [],
+            last_run_at: "2022-01-14T16:47:34.244Z",
+            hidden: false,
+            user_id: 1,
+          },
         ],
       });
     });
@@ -201,4 +221,10 @@ acceptance("Data Explorer Plugin | Run Query", function (needs) {
     let paramsMonthsAgo = JSON.parse(searchParams.get("params")).months_ago;
     assert.equal(paramsMonthsAgo, monthsAgoValue);
   });
+
+  test("it loads the page if one of the parameter is null", async function (assert) {
+    await visit('admin/plugins/explorer?id=-7&params={"user":null}');
+    assert.ok(exists(".query-params .user-chooser"));
+    assert.ok(exists(".query-run .btn.btn-primary"));
+  });
 });