From 6d975d7e907bf8875761ee62d51b20f22a63929a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=94=A6=E5=BF=83?=
 <41134017+Lhcfl@users.noreply.github.com>
Date: Fri, 5 Jul 2024 17:49:18 +0800
Subject: [PATCH] FEATURE: Add Data Explorer Params to the URL for group
 queries (#298)

We have introduced a URL param mechanism for data explorer queries for administrators
in https://github.com/discourse/discourse-data-explorer/pull/128/
However, for data explorer queries in group page, URL params are not yet introduced.

This PR introduces this missing piece.

Related meta topic: https://meta.discourse.org/t/populate-data-explorer-params-with-url-params/169404/8
---
 .../controllers/group-reports-show.js         | 15 ++++++++++++++-
 .../templates/group-reports-show.hbs          |  1 +
 .../acceptance/param-input-test.js            | 19 ++++++++++++++++++-
 3 files changed, 33 insertions(+), 2 deletions(-)

diff --git a/assets/javascripts/discourse/controllers/group-reports-show.js b/assets/javascripts/discourse/controllers/group-reports-show.js
index 6f20e1d..8949ed9 100644
--- a/assets/javascripts/discourse/controllers/group-reports-show.js
+++ b/assets/javascripts/discourse/controllers/group-reports-show.js
@@ -15,14 +15,21 @@ import { bind } from "discourse-common/utils/decorators";
 export default class GroupReportsShowController extends Controller {
   @service currentUser;
   @service modal;
+  @service router;
 
   @tracked showResults = false;
   @tracked loading = false;
   @tracked results = this.model.results;
   @tracked queryGroupBookmark = this.queryGroup?.bookmark;
 
+  queryParams = ["params"];
+
   explain = false;
 
+  get parsedParams() {
+    return this.params ? JSON.parse(this.params) : null;
+  }
+
   get hasParams() {
     return this.model.param_info.length > 0;
   }
@@ -52,12 +59,18 @@ export default class GroupReportsShowController extends Controller {
     this.showResults = false;
 
     try {
+      const stringifiedParams = JSON.stringify(this.model.params);
+      this.router.transitionTo({
+        queryParams: {
+          params: this.model.params ? stringifiedParams : null,
+        },
+      });
       const response = await ajax(
         `/g/${this.get("group.name")}/reports/${this.model.id}/run`,
         {
           type: "POST",
           data: {
-            params: JSON.stringify(this.model.params),
+            params: stringifiedParams,
             explain: this.explain,
           },
         }
diff --git a/assets/javascripts/discourse/templates/group-reports-show.hbs b/assets/javascripts/discourse/templates/group-reports-show.hbs
index 833c9b8..7a4ebb9 100644
--- a/assets/javascripts/discourse/templates/group-reports-show.hbs
+++ b/assets/javascripts/discourse/templates/group-reports-show.hbs
@@ -6,6 +6,7 @@
     <ParamInputsWrapper
       @hasParams={{this.hasParams}}
       @params={{this.model.params}}
+      @initialValues={{this.parsedParams}}
       @paramInfo={{this.model.param_info}}
       @updateParams={{this.updateParams}}
     />
diff --git a/test/javascripts/acceptance/param-input-test.js b/test/javascripts/acceptance/param-input-test.js
index fbdbb42..cd586f3 100644
--- a/test/javascripts/acceptance/param-input-test.js
+++ b/test/javascripts/acceptance/param-input-test.js
@@ -304,7 +304,18 @@ acceptance("Data Explorer Plugin | Param Input", function (needs) {
     await fillIn(".query-params input", monthsAgoValue);
     await click("form.query-run button");
 
-    const searchParams = new URLSearchParams(currentURL());
+    const searchParams = new URLSearchParams(currentURL().split("?")[1]);
+    const monthsAgoParam = JSON.parse(searchParams.get("params")).months_ago;
+    assert.equal(monthsAgoParam, monthsAgoValue);
+  });
+
+  test("it puts params for the query into the url for group reports", async function (assert) {
+    await visit("/g/discourse/reports/-8");
+    const monthsAgoValue = "2";
+    await fillIn(".query-params input", monthsAgoValue);
+    await click("form.query-run button");
+
+    const searchParams = new URLSearchParams(currentURL().split("?")[1]);
     const monthsAgoParam = JSON.parse(searchParams.get("params")).months_ago;
     assert.equal(monthsAgoParam, monthsAgoValue);
   });
@@ -315,6 +326,12 @@ acceptance("Data Explorer Plugin | Param Input", function (needs) {
     assert.ok(exists(".query-run .btn.btn-primary"));
   });
 
+  test("it loads the page if one of the parameter is null for group reports", async function (assert) {
+    await visit('/g/discourse/reports/-8?params={"months_ago":null}');
+    assert.ok(exists(".query-params input"));
+    assert.ok(exists(".query-run .btn.btn-primary"));
+  });
+
   test("it applies params when running a report", async function (assert) {
     await visit("/g/discourse/reports/-8");
     const monthsAgoValue = "2";