diff --git a/assets/javascripts/discourse/templates/admin/plugins-explorer-queries-details.gjs b/assets/javascripts/discourse/templates/admin/plugins-explorer-queries-details.gjs
index 1e7c6835..0d412d23 100644
--- a/assets/javascripts/discourse/templates/admin/plugins-explorer-queries-details.gjs
+++ b/assets/javascripts/discourse/templates/admin/plugins-explorer-queries-details.gjs
@@ -59,15 +59,13 @@ export default RouteTemplate(
             />
 
             <h1>
-              {{@controller.model.name}}
+              <span>{{@controller.model.name}}</span>
               {{#unless @controller.editDisabled}}
-                <a
-                  href
-                  {{on "click" @controller.editName}}
-                  class="edit-query-name"
-                >
-                  {{icon "pencil"}}
-                </a>
+                <DButton
+                  @action={{@controller.editName}}
+                  @icon="pencil"
+                  class="edit-query-name btn-transparent"
+                />
               {{/unless}}
             </h1>
           </div>
diff --git a/assets/stylesheets/explorer.scss b/assets/stylesheets/explorer.scss
index de474824..7c07d873 100644
--- a/assets/stylesheets/explorer.scss
+++ b/assets/stylesheets/explorer.scss
@@ -215,7 +215,7 @@ table.group-reports {
       margin: 0 0.5em 0 0;
       color: var(--primary);
 
-      a {
+      button .d-icon {
         color: currentcolor;
       }
     }
diff --git a/spec/system/explorer_spec.rb b/spec/system/explorer_spec.rb
index bb99da21..4449eb55 100644
--- a/spec/system/explorer_spec.rb
+++ b/spec/system/explorer_spec.rb
@@ -27,6 +27,16 @@
 
       expect(page).to have_field("limit", with: 42)
     end
+
+    it "allows to edit custom name" do
+      visit("/admin/plugins/explorer/queries/#{query_1.id}")
+      find(".query-run .btn-primary").click
+      find(".edit-query-name").click
+      find(".name-text-field input").fill_in(with: "My custom name edited")
+      find(".btn-primary").click
+      find("button span", text: "Save Changes and Run").click
+      expect(page.find(".name h1")).to have_content("My custom name edited")
+    end
   end
 
   context "with the old url format" do
diff --git a/test/javascripts/acceptance/run-query-test.js b/test/javascripts/acceptance/run-query-test.js
index d9095bf2..5b8ce6f1 100644
--- a/test/javascripts/acceptance/run-query-test.js
+++ b/test/javascripts/acceptance/run-query-test.js
@@ -320,7 +320,7 @@ acceptance("Data Explorer Plugin | Run Query", function (needs) {
     await visit("/admin/plugins/explorer/queries/2");
 
     assert
-      .dom("div.name h1")
+      .dom("div.name h1 span")
       .hasText("What about 0?", "the query name was rendered");
 
     assert