mirror of
https://github.com/discourse/discourse.git
synced 2025-01-19 03:32:45 +08:00
87359cf7aa
When rendering the initial search options, we re-use the `AssistantItem` component. `AssistantItem` requires that you pass in the required params to define what _type_ of component it will be - category, tag, tag intersection, user, etc. This flexibility is nice, as we can just loop through all `@results` and pass in params, without having to predefine what _type_ of result it is. It is is not very good when it comes to seperating the html strucutre of each unique _type_. This is an example of the initial search results: <img width="408" alt="Screenshot 2024-10-23 at 9 04 18 AM" src="https://github.com/user-attachments/assets/46795697-6246-4b60-be18-fea200a57baa"> You can see that both categories **and** tags are being rendered. The HTML strcuture looks like so: ```html <ul class="search-menu-assistant"> <li class="search-menu-assistant-item"> <a class="search-link" href="#"> CATEGORY </a> </li> <li class="search-menu-assistant-item"> <a class="search-link" href="#"> CATEGORY </a> </li> <li class="search-menu-assistant-item"> <a class="search-link" href="#"> TAG </a> </li> <li class="search-menu-assistant-item"> <a class="search-link" href="#"> TAG </a> </li> </ul> ``` There is no way to differentiate between the types, even though some are categories and others tags. This PR adds a _typeClass_ to each component, that will be a additional class included at the top level of the component HTML structure. ```html <ul class="search-menu-assistant"> <li class="category search-menu-assistant-item"> <a class="search-link" href="#"> CATEGORY </a> </li> <li class="category search-menu-assistant-item"> <a class="search-link" href="#"> CATEGORY </a> </li> <li class="tag search-menu-assistant-item"> <a class="search-link" href="#"> TAG </a> </li> <li class="tag search-menu-assistant-item"> <a class="search-link" href="#"> TAG </a> </li> </ul> ``` _See `.category` and `.tag` attached to each `search-menu-assistant-item`._ This will help us identify which _type_ it is, and allow devs to target and customize each element by _type_. |
||
|---|---|---|
| .. | ||
| assets | ||
| controllers | ||
| helpers | ||
| jobs | ||
| mailers | ||
| models | ||
| serializers | ||
| services | ||
| views | ||