# Discourse Category Headers theme component

**URL:** https://meta.discourse.org/t/discourse-category-headers-theme-component/148682
**Category:** Theme component
**Created:** [April 21, 2020, 1:02am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682 "2020-04-21T01:02:59Z")
**Posts on this page:** 20
**Page:** 6

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [July 2, 2025, 11:07am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/105 "2025-07-02T11:07:33Z")

</div>

Those tags are part of the category description. I can try to put a html-safe on it, but I’m not sure if this will introduce vulnerabilities?

> [@jackierenee](#):
>
> I just see a blank page

What is the error in the console with this blank page? Is it the one posted above?

> [@nathank](#):
>
> Also, the ‘normal’ Description text size doesn’t seem to match vanilla (in my example above the TC is set to `larger`

Apologies, could you elaborate a little more on this? Thanks!

---

<div class="post-metadata">

### Author: ![jackierenee](https://avatars.discourse-cdn.com/v4/letter/j/a3d4f5/32.png) [@jackierenee](https://meta.discourse.org/u/jackierenee)
#### Post date: [July 2, 2025, 11:49am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/106 "2025-07-02T11:49:48Z")

</div>

> [@NateDhaliwal](#):
>
> What is the error in the console with this blank page? Is it the one posted above?

@NateDhaliwal I’m not sure! I’m sorry, I have no idea what these errors correspond to or how to find the one that directly relates to that page.

---

<div class="post-metadata">

### Author: ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [July 2, 2025, 11:50am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/107 "2025-07-02T11:50:49Z")

</div>

> [@NateDhaliwal](#):
>
> I can try to put a html-safe on it, but I’m not sure if this will introduce vulnerabilities?

Did you take a look at how other components handle that?  
I’d assume it’s save. At least I have the impression the official category banner component uses html-safe without any separate escaping too

> <https://github.com/discourse/discourse-category-banners/blob/2bb12651b180abe514b9789746bb79f13efb4b40/javascripts/discourse/components/category-banner.gjs#L201>

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [July 2, 2025, 11:58am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/108 "2025-07-02T11:58:50Z")

</div>

> [@jackierenee](#):
>
> ```plaintext
> Message (4397 copies reported)
> 
> [db6814] ActionController::RoutingError (No route matches [GET] "/admin/customize/user_fields.json")
> 
> ```

FWIW This one appears to be an issue with something trying to use the old route rather than the new `/admin/config/user-fields.json` one.

It also has a mention of:

> [@jackierenee](#):
>
> `plugins/z-communiteq-features/plugin.rb`

So maybe @RGJ may know more? 🤞

---

<div class="post-metadata">

### Author: ![RGJ](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rgj/32/523185_2.png) [@RGJ](https://meta.discourse.org/u/RGJ)
#### Post date: [July 2, 2025, 12:04pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/109 "2025-07-02T12:04:31Z")

</div>

TL;DR no. 🙂

Long version:

This is an internal plugin that we use on our hosting (similar to CDCK “hosted site”) that adds some extra features that we need to host the site. This specific line replaces the multisite “not found” with a more verbose error message which indicates that the owner of the site has probably misconfigured their DNS.

Since it patches the multisite middleware, _every request on every site we host_ goes through it. If you see this plugin in a stack trace, and the line `lib/middleware/enforce_hostname.rb` is immediately above it, it is a normal call and not a cause of the issue.

---

<div class="post-metadata">

### Author: ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [July 2, 2025, 12:08pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/110 "2025-07-02T12:08:24Z")

</div>

Are you on the stable branch? Maybe the update caused the plugin to be broken on stable. Then it could help if an entry was added to the compatibility file.

---

<div class="post-metadata">

### Author: ![jackierenee](https://avatars.discourse-cdn.com/v4/letter/j/a3d4f5/32.png) [@jackierenee](https://meta.discourse.org/u/jackierenee)
#### Post date: [July 2, 2025, 12:20pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/111 "2025-07-02T12:20:54Z")

</div>

@Moin I don’t know, how can I check what branch I’m on?

---

<div class="post-metadata">

### Author: ![RGJ](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rgj/32/523185_2.png) [@RGJ](https://meta.discourse.org/u/RGJ)
#### Post date: [July 2, 2025, 12:22pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/112 "2025-07-02T12:22:19Z")

</div>

Yes, you’re on stable @jackierenee.

And it indeed looks like what Moin said, the theme component was updated but there was no compatibility pin. @Rhidian @NateDhaliwal

---

<div class="post-metadata">

### Author: ![jackierenee](https://avatars.discourse-cdn.com/v4/letter/j/a3d4f5/32.png) [@jackierenee](https://meta.discourse.org/u/jackierenee)
#### Post date: [July 2, 2025, 2:17pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/113 "2025-07-02T14:17:58Z")

</div>

Thanks for confirming @RGJ

So, do I need to simply wait for the compatibility pin before adding this component back to our site?

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [July 2, 2025, 2:28pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/114 "2025-07-02T14:28:05Z")

</div>

I’m working on a PR that should hopefully fix this issue.

---

<div class="post-metadata">

### Author: ![RGJ](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rgj/32/523185_2.png) [@RGJ](https://meta.discourse.org/u/RGJ)
#### Post date: [July 2, 2025, 2:33pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/115 "2025-07-02T14:33:24Z")

</div>

> [@jackierenee](#):
>
> simply wait for the compatibility pin

Yes 👍

---

<div class="post-metadata">

### Author: ![nathank](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nathank/32/290039_2.png) [@nathank](https://meta.discourse.org/u/nathank)
#### Post date: [July 2, 2025, 11:54pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/116 "2025-07-02T23:54:53Z")

</div>

> [@NateDhaliwal](#):
>
> Apologies, could you elaborate a little more on this? Thanks!

Sure.

Without the Theme Component, the text in the category description is `--font-up-3` by default. This is via the `.category-heading` class. I think that this has grown in recent times.

With the Theme Component, the text in the category description is `--font-0`. This can be bumped up to `--font-up-1`(larger) or `font-up-2`(largest). Neither of these achieve the new normal!

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [July 3, 2025, 12:08am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/117 "2025-07-03T00:08:49Z")

</div>

Righto, so is this okay?  
smaller → `--font-up-2`  
normal → `--font-up-3`  
larger → `--font-up-4`  
largest → `--font-up-5`  
Cc: @Rhidian

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [July 3, 2025, 10:23am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/119 "2025-07-03T10:23:48Z")

</div>

Hi @jackierenee , I’ve merged a PR. Could you try updating and see if it works?

---

<div class="post-metadata">

### Author: ![jackierenee](https://avatars.discourse-cdn.com/v4/letter/j/a3d4f5/32.png) [@jackierenee](https://meta.discourse.org/u/jackierenee)
#### Post date: [July 3, 2025, 11:16am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/120 "2025-07-03T11:16:25Z")

</div>

Hi @NateDhaliwal I just tried updating and added the component back to my site. Category pages are still blank.

 ![A screenshot of a webpage displaying the administrative sidebar of an online community platform, with categories and tags listed on the left and a mostly white background. (Captioned by AI)](https://global.discourse-cdn.com/meta/original/4X/8/4/2/842affc62f6118c077f81db29825eba7b25be8cf.png)

And if I try to use it in combination with the minimal category boxes, I get a blank homepage also.

 ![This is a screenshot of the European Association for International Education (EAIE) Community Platform's homepage, displaying a welcome message, search bar, navigation menu, and various categories and tags. (Captioned by AI)](https://global.discourse-cdn.com/meta/original/4X/f/1/0/f10f55b918605b241d2e26dc5da9b0afab9ad5fe.png)

Maybe I’m doing something wrong, but I don’t know how to solve it.

I also got an error at the top of my site now:

 ![This screenshot displays the EAIe Community Platform's welcome page with an error message about loading route headers at the top. (Captioned by AI)](https://global.discourse-cdn.com/meta/original/4X/f/b/3/fb3e81b2d412c998f72212712900b368390b4519.png)

---

<div class="post-metadata">

### Author: ![jackierenee](https://avatars.discourse-cdn.com/v4/letter/j/a3d4f5/32.png) [@jackierenee](https://meta.discourse.org/u/jackierenee)
#### Post date: [July 3, 2025, 11:19am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/121 "2025-07-03T11:19:40Z")

</div>

One more bit, I think this is the error log that is related to that error message:

```plaintext
Message (4472 copies reported)

[db6814] ActionController::RoutingError (No route matches [GET] "/admin/customize/user_fields.json")
config/initializers/100-quiet_logger.rb:20:in `call'
config/initializers/100-silence_logger.rb:29:in `call'
lib/middleware/enforce_hostname.rb:24:in `call'
lib/middleware/processing_request.rb:12:in `call'
lib/middleware/request_tracker.rb:385:in `call'

Backtrace

actionpack (7.2.2.1) lib/action_dispatch/middleware/debug_exceptions.rb:35:in `call'
actionpack (7.2.2.1) lib/action_dispatch/middleware/show_exceptions.rb:32:in `call'
logster (2.20.0) lib/logster/middleware/reporter.rb:40:in `call'
railties (7.2.2.1) lib/rails/rack/logger.rb:41:in `call_app'
railties (7.2.2.1) lib/rails/rack/logger.rb:29:in `call'
config/initializers/100-quiet_logger.rb:20:in `call'
config/initializers/100-silence_logger.rb:29:in `call'
actionpack (7.2.2.1) lib/action_dispatch/middleware/request_id.rb:33:in `call'
lib/middleware/enforce_hostname.rb:24:in `call'
plugins/z-communiteq-features/plugin.rb:142:in `call'
rack (2.2.10) lib/rack/method_override.rb:24:in `call'
rack (2.2.10) lib/rack/sendfile.rb:110:in `call'
rack-mini-profiler (3.3.1) lib/mini_profiler.rb:191:in `call'
lib/middleware/processing_request.rb:12:in `call'
message_bus (4.3.8) lib/message_bus/rack/middleware.rb:60:in `call'
lib/middleware/request_tracker.rb:385:in `call'
actionpack (7.2.2.1) lib/action_dispatch/middleware/remote_ip.rb:96:in `call'
rails_multisite (6.1.0) lib/rails_multisite/middleware.rb:26:in `call'
plugins/z-communiteq-features/plugin.rb:168:in `call'
railties (7.2.2.1) lib/rails/engine.rb:535:in `call'
railties (7.2.2.1) lib/rails/railtie.rb:226:in `public_send'
railties (7.2.2.1) lib/rails/railtie.rb:226:in `method_missing'
rack (2.2.10) lib/rack/urlmap.rb:74:in `block in call'
rack (2.2.10) lib/rack/urlmap.rb:58:in `each'
rack (2.2.10) lib/rack/urlmap.rb:58:in `call'
unicorn (6.1.0) lib/unicorn/http_server.rb:634:in `process_client'
unicorn (6.1.0) lib/unicorn/http_server.rb:739:in `worker_loop'
unicorn (6.1.0) lib/unicorn/http_server.rb:547:in `spawn_missing_workers'
unicorn (6.1.0) lib/unicorn/http_server.rb:143:in `start'
unicorn (6.1.0) bin/unicorn:128:in `<top (required)>'
vendor/bundle/ruby/3.3.0/bin/unicorn:25:in `load'
vendor/bundle/ruby/3.3.0/bin/unicorn:25:in `<main>'

Env

HTTP HOSTS: community.eaie.org

```

Thanks!

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [July 3, 2025, 11:22am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/122 "2025-07-03T11:22:03Z")

</div>

Are there any errors in the browser console?  
Could you share your Discourse version you’re currently on? This in the /admin page.  
Thanks!

---

<div class="post-metadata">

### Author: ![jackierenee](https://avatars.discourse-cdn.com/v4/letter/j/a3d4f5/32.png) [@jackierenee](https://meta.discourse.org/u/jackierenee)
#### Post date: [July 3, 2025, 11:25am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/123 "2025-07-03T11:25:09Z")

</div>

Hi @NateDhaliwal, sorry, I don’t know what errors in the browser console means exactly.

I believe this is the version of discourse that I’m running: Discourse 3.4.6 - [GitHub - discourse/discourse: A platform for community discussion. Free, open, simple. · GitHub](https://github.com/discourse/discourse) version 3d149ba8244585f4bcb41db77aa8825e72468bdb

---

<div class="post-metadata">

### Author: ![jackierenee](https://avatars.discourse-cdn.com/v4/letter/j/a3d4f5/32.png) [@jackierenee](https://meta.discourse.org/u/jackierenee)
#### Post date: [July 3, 2025, 11:30am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/124 "2025-07-03T11:30:44Z")

</div>

Hi @NateDhaliwal sorry, I was able to figure it out, here are some of the errors:

```plaintext
Discourse v3.4.6 — https://github.com/discourse/discourse/commits/3d149ba824 — Ember v5.12.0
category-header.gjs:51 Uncaught TypeError: Cannot read properties of undefined (reading 'mobileView')
    at get showHeader (category-header.gjs:51:61)
    at eE (index.js:78:1)
    at index.js:78:1
    at index.js:78:1
    at X (index.js:78:1)
    at T (index.js:78:1)
    at index.js:78:1
    at index.js:78:1
    at X (index.js:78:1)
    at T (index.js:78:1)
    at Object.evaluate (index.js:78:1)
    at Object.evaluate (index.js:78:1)
    at tV.evaluateSyscall (index.js:78:1)
    at tV.evaluateInner (index.js:78:1)
    at tV.evaluateOuter (index.js:78:1)
    at t1.next (index.js:78:1)
    at t1._execute (index.js:78:1)
    at t1.execute (index.js:78:1)
    at t2.sync (index.js:78:1)
    at t6.render (index.js:78:1)
    at index.js:78:1
    at tx (index.js:78:1)
    at io._renderRoots (index.js:78:1)
    at io._renderRootsTransaction (index.js:78:1)
    at io._revalidate (index.js:78:1)
    at invoke (index.js:78:1)
    at m.flush (index.js:78:1)
    at g.flush (index.js:78:1)
    at V._end (index.js:78:1)
    at V.end (index.js:78:1)
    at V._run (index.js:78:1)
    at V.run (index.js:78:1)
    at d (deprecate.js:100:1)
    at Object.success (video-placeholder.js:39:1)
    at l (jquery.js:10:1)
    at Object.fireWith [as resolveWith] (jquery.js:10:1)
    at C (jquery.js:10:1)
    at XMLHttpRequest.<anonymous> (jquery.js:10:1)Understand this error
category-header.gjs:51 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'mobileView')
    at get showHeader (category-header.gjs:51:61)
    at eE (index.js:78:1)
    at index.js:78:1
    at index.js:78:1
    at X (index.js:78:1)
    at T (index.js:78:1)
    at index.js:78:1
    at index.js:78:1
    at X (index.js:78:1)
    at T (index.js:78:1)
    at Object.evaluate (index.js:78:1)
    at Object.evaluate (index.js:78:1)
    at tV.evaluateSyscall (index.js:78:1)
    at tV.evaluateInner (index.js:78:1)
    at tV.evaluateOuter (index.js:78:1)
    at t1.next (index.js:78:1)
    at t1._execute (index.js:78:1)
    at t1.execute (index.js:78:1)
    at t2.sync (index.js:78:1)
    at t6.render (index.js:78:1)
    at index.js:78:1
    at tx (index.js:78:1)
    at io._renderRoots (index.js:78:1)
    at io._renderRootsTransaction (index.js:78:1)
    at io._renderRoot (index.js:78:1)
    at io._appendDefinition (index.js:78:1)
    at io.appendOutletView (index.js:78:1)
    at invoke (index.js:78:1)
    at m.flush (index.js:78:1)
    at g.flush (index.js:78:1)
    at V._end (index.js:78:1)
    at index.js:78:1Understand this error
category-header.gjs:51 Uncaught TypeError: Cannot read properties of undefined (reading 'mobileView')
    at get showHeader (category-header.gjs:51:61)
    at eE (index.js:78:1)
    at index.js:78:1
    at index.js:78:1
    at X (index.js:78:1)
    at T (index.js:78:1)
    at index.js:78:1
    at index.js:78:1
    at X (index.js:78:1)
    at T (index.js:78:1)
    at Object.evaluate (index.js:78:1)
    at Object.evaluate (index.js:78:1)
    at tV.evaluateSyscall (index.js:78:1)
    at tV.evaluateInner (index.js:78:1)
    at tV.evaluateOuter (index.js:78:1)
    at t1.next (index.js:78:1)
    at t1._execute (index.js:78:1)
    at t1.execute (index.js:78:1)
    at t2.sync (index.js:78:1)
    at t6.render (index.js:78:1)
    at index.js:78:1
    at tx (index.js:78:1)
    at io._renderRoots (index.js:78:1)
    at io._renderRootsTransaction (index.js:78:1)
    at io._revalidate (index.js:78:1)
    at invoke (index.js:78:1)
    at m.flush (index.js:78:1)
    at g.flush (index.js:78:1)
    at V._end (index.js:78:1)
    at V.end (index.js:78:1)
    at V._runExpiredTimers (index.js:78:1)Understand this error
category-header.gjs:51 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'mobileView')
    at get showHeader (category-header.gjs:51:61)
    at eE (index.js:78:1)
    at index.js:78:1
    at index.js:78:1
    at X (index.js:78:1)
    at T (index.js:78:1)
    at index.js:78:1
    at index.js:78:1
    at X (index.js:78:1)
    at T (index.js:78:1)
    at Object.evaluate (index.js:78:1)
    at Object.evaluate (index.js:78:1)
    at tV.evaluateSyscall (index.js:78:1)
    at tV.evaluateInner (index.js:78:1)
    at tV.evaluateOuter (index.js:78:1)
    at t1.next (index.js:78:1)
    at t1._execute (index.js:78:1)
    at t1.execute (index.js:78:1)
    at t2.sync (index.js:78:1)
    at t6.render (index.js:78:1)
    at index.js:78:1
    at tx (index.js:78:1)
    at io._renderRoots (index.js:78:1)
    at io._renderRootsTransaction (index.js:78:1)
    at io._revalidate (index.js:78:1)
    at invoke (index.js:78:1)
    at m.flush (index.js:78:1)
    at g.flush (index.js:78:1)
    at V._end (index.js:78:1)
    at index.js:78:1Understand this error

```

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [July 3, 2025, 2:14pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/125 "2025-07-03T14:14:32Z")

</div>

That is very odd. It’s strange that this error is appearing now, as `this.site.mobileView` was in the original version 🤔. I cannot repo this with latest tests-passed, could this be a limitation of stable (though, it seems unlikely - core uses this as well).

[Previous page](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682.md?page=5)

[Next page](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682.md?page=7)
