diff --git a/app/assets/javascripts/admin/addon/controllers/admin-customize-themes.js b/app/assets/javascripts/admin/addon/controllers/admin-customize-themes.js index 17dda660401..a598ade6f5c 100644 --- a/app/assets/javascripts/admin/addon/controllers/admin-customize-themes.js +++ b/app/assets/javascripts/admin/addon/controllers/admin-customize-themes.js @@ -15,8 +15,8 @@ export default Controller.extend({ return themes.filter((t) => t.get("component")); }, - @discourseComputed("model", "model.@each.component") - installedThemes(themes) { - return themes.map((t) => t.name); + @discourseComputed("model.content") + installedThemes(content) { + return content || []; }, }); 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 66f87c52e22..fbef0029c60 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 @@ -44,7 +44,9 @@ export default Controller.extend(ModalFunctionality, { @discourseComputed("themesController.installedThemes") themes(installedThemes) { return POPULAR_THEMES.map((t) => { - if (installedThemes.includes(t.name)) { + if ( + installedThemes.some((theme) => this.themeHasSameUrl(theme, t.value)) + ) { set(t, "installed", true); } return t; 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 index bbafc25c4f2..f2fdfbe7a57 100644 --- 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 @@ -1,6 +1,7 @@ import { acceptance, query } from "discourse/tests/helpers/qunit-helpers"; import { click, fillIn, visit } from "@ember/test-helpers"; import { test } from "qunit"; +import I18n from "I18n"; acceptance("Admin - Themes - Install modal", function (needs) { needs.user(); @@ -50,4 +51,29 @@ acceptance("Admin - Themes - Install modal", function (needs) { "repo url is visible" ); }); + + test("installed themes are matched with the popular list by URL", async function (assert) { + await visit("/admin/customize/themes"); + await click(".create-actions .btn-primary"); + + assert.notOk( + query( + '.popular-theme-item[data-name="Graceful"] .popular-theme-buttons button' + ), + "no install button is shown for installed themes" + ); + assert.equal( + query( + '.popular-theme-item[data-name="Graceful"] .popular-theme-buttons' + ).textContent.trim(), + I18n.t("admin.customize.theme.installed") + ); + + assert.ok( + query( + '.popular-theme-item[data-name="Minima"] .popular-theme-buttons button' + ), + "install button is shown for not installed themes" + ); + }); }); diff --git a/app/assets/javascripts/discourse/tests/helpers/create-pretender.js b/app/assets/javascripts/discourse/tests/helpers/create-pretender.js index 210b5e4fac5..08fbde994ec 100644 --- a/app/assets/javascripts/discourse/tests/helpers/create-pretender.js +++ b/app/assets/javascripts/discourse/tests/helpers/create-pretender.js @@ -690,7 +690,18 @@ export function applyDefaultHandlers(pretender) { }); pretender.get("/admin/themes", () => { - return response(200, { themes: [], extras: {} }); + return response(200, { + themes: [ + { + id: 1, + name: "Graceful Renamed", + remote_theme: { + remote_url: "https://github.com/discourse/graceful.git", + }, + }, + ], + extras: {}, + }); }); pretender.post("/admin/themes/generate_key_pair", () => {