diff --git a/javascripts/discourse/components/custom-header-topic-button.gjs b/javascripts/discourse/components/custom-header-topic-button.gjs
index 41811b3..0ea044b 100644
--- a/javascripts/discourse/components/custom-header-topic-button.gjs
+++ b/javascripts/discourse/components/custom-header-topic-button.gjs
@@ -1,4 +1,5 @@
 import Component from "@glimmer/component";
+import { tracked } from "@glimmer/tracking";
 import { action } from "@ember/object";
 import { getOwner } from "@ember/owner";
 import { service } from "@ember/service";
@@ -12,6 +13,7 @@ export default class CustomHeaderTopicButton extends Component {
   @service currentUser;
   @service router;
 
+  @tracked
   topic = this.router.currentRouteName.includes("topic")
     ? getOwner(this).lookup("controller:topic")
     : null;
diff --git a/spec/system/header_new_topic_button_spec.rb b/spec/system/header_new_topic_button_spec.rb
index 60074e0..e2b66d6 100644
--- a/spec/system/header_new_topic_button_spec.rb
+++ b/spec/system/header_new_topic_button_spec.rb
@@ -6,6 +6,8 @@
   fab!(:user) { Fabricate(:user, trust_level: TrustLevel[1]) }
   fab!(:category)
   fab!(:category2, :category)
+  fab!(:topic) { Fabricate(:topic, category: category) }
+  fab!(:post) { Fabricate(:post, user:, topic:) }
 
   context "with logged in user" do
     before { sign_in(user) }
@@ -23,6 +25,13 @@
       expect(page).to have_css(".category-input [data-category-id='#{category2.id}']")
     end
 
+    it "should open the composer to the correct category when the header button is clicked from a topic page" do
+      visit(topic.url)
+      find("#new-create-topic").click
+
+      expect(page).to have_css(".category-input [data-category-id='#{category.id}']")
+    end
+
     context "when new_topic_button_text is empty" do
       before do
         theme.update_setting(:new_topic_button_text, "")