From 116a879ff4abe8b6db807b04ac4b8f465189f726 Mon Sep 17 00:00:00 2001
From: Osama Sayegh <asooomaasoooma90@gmail.com>
Date: Mon, 11 Jan 2021 18:27:31 +0300
Subject: [PATCH] FIX: Reset theme install modal state on close (#11670)

The theme install modal should reset its state on close, otherwise it might cause confusion when installing multiple components successively.
---
 .../controllers/modals/admin-install-theme.js | 22 +++++++---
 .../admin-install-theme-modal-test.js         | 42 +++++++++++++++++++
 .../tests/helpers/create-pretender.js         | 11 +++++
 3 files changed, 69 insertions(+), 6 deletions(-)
 create mode 100644 app/assets/javascripts/admin/tests/admin/acceptance/admin-install-theme-modal-test.js

diff --git a/app/assets/javascripts/admin/addon/controllers/modals/admin-install-theme.js b/app/assets/javascripts/admin/addon/controllers/modals/admin-install-theme.js
index bc6258228da..01cc3154234 100644
--- a/app/assets/javascripts/admin/addon/controllers/modals/admin-install-theme.js
+++ b/app/assets/javascripts/admin/addon/controllers/modals/admin-install-theme.js
@@ -26,7 +26,6 @@ export default Controller.extend(ModalFunctionality, {
   checkPrivate: match("uploadUrl", /^git/),
   localFile: null,
   uploadUrl: null,
-  urlPlaceholder: "https://github.com/discourse/sample_theme",
   advancedVisible: false,
   selectedType: alias("themesController.currentTab"),
   component: equal("selectedType", COMPONENTS),
@@ -76,12 +75,15 @@ export default Controller.extend(ModalFunctionality, {
     );
   },
 
+  @discourseComputed("privateChecked")
+  urlPlaceholder(privateChecked) {
+    return privateChecked
+      ? "git@github.com:discourse/sample_theme.git"
+      : "https://github.com/discourse/sample_theme";
+  },
+
   @observes("privateChecked")
   privateWasChecked() {
-    this.privateChecked
-      ? this.set("urlPlaceholder", "git@github.com:discourse/sample_theme.git")
-      : this.set("urlPlaceholder", "https://github.com/discourse/sample_theme");
-
     const checked = this.privateChecked;
     if (checked && !this._keyLoading) {
       this._keyLoading = true;
@@ -126,7 +128,15 @@ export default Controller.extend(ModalFunctionality, {
   },
 
   onClose() {
-    this.set("duplicateRemoteThemeWarning", null);
+    this.setProperties({
+      duplicateRemoteThemeWarning: null,
+      privateChecked: false,
+      privateKey: null,
+      localFile: null,
+      uploadUrl: null,
+      publicKey: null,
+      branch: null,
+    });
   },
 
   themeHasSameUrl(theme, url) {
diff --git a/app/assets/javascripts/admin/tests/admin/acceptance/admin-install-theme-modal-test.js b/app/assets/javascripts/admin/tests/admin/acceptance/admin-install-theme-modal-test.js
new file mode 100644
index 00000000000..47054dbc5be
--- /dev/null
+++ b/app/assets/javascripts/admin/tests/admin/acceptance/admin-install-theme-modal-test.js
@@ -0,0 +1,42 @@
+import { acceptance, queryAll } from "discourse/tests/helpers/qunit-helpers";
+import { click, fillIn, visit } from "@ember/test-helpers";
+import { test } from "qunit";
+
+acceptance("Admin - Themes - Install modal", function (needs) {
+  needs.user();
+  test("closing the modal resets the modal inputs", async function (assert) {
+    const urlInput = ".install-theme-content .repo input";
+    const branchInput = ".install-theme-content .branch input";
+    const privateRepoCheckbox = ".install-theme-content .check-private input";
+
+    const themeUrl = "git@github.com:discourse/discourse.git";
+    await visit("/admin/customize/themes");
+
+    await click(".create-actions .btn-primary");
+    await click("#remote");
+    await fillIn(urlInput, themeUrl);
+    await click(".install-theme-content .inputs .advanced-repo");
+    await fillIn(branchInput, "tests-passed");
+    await click(privateRepoCheckbox);
+    assert.ok(queryAll(urlInput)[0].value === themeUrl, "url input is filled");
+    assert.ok(
+      queryAll(branchInput)[0].value === "tests-passed",
+      "branch input is filled"
+    );
+    assert.ok(
+      queryAll(privateRepoCheckbox)[0].checked,
+      "private repo checkbox is checked"
+    );
+
+    await click(".modal-footer .d-modal-cancel");
+
+    await click(".create-actions .btn-primary");
+    await click("#remote");
+    assert.ok(queryAll(urlInput)[0].value === "", "url input is reset");
+    assert.ok(queryAll(branchInput)[0].value === "", "branch input is reset");
+    assert.ok(
+      !queryAll(privateRepoCheckbox)[0].checked,
+      "private repo checkbox unchecked"
+    );
+  });
+});
diff --git a/app/assets/javascripts/discourse/tests/helpers/create-pretender.js b/app/assets/javascripts/discourse/tests/helpers/create-pretender.js
index cc267d9abce..288e8375e13 100644
--- a/app/assets/javascripts/discourse/tests/helpers/create-pretender.js
+++ b/app/assets/javascripts/discourse/tests/helpers/create-pretender.js
@@ -664,6 +664,17 @@ export function applyDefaultHandlers(pretender) {
     return response(200, { site_text: result });
   });
 
+  pretender.get("/admin/themes", () => {
+    return response(200, { themes: [], extras: {} });
+  });
+
+  pretender.post("/admin/themes/generate_key_pair", () => {
+    return response(200, {
+      private_key: "privateKey",
+      public_key: "publicKey",
+    });
+  });
+
   pretender.get("/tag_groups", () => response(200, { tag_groups: [] }));
 
   pretender.get("/admin/users/1.json", () => {