# 🎀 디스코urs용 모던 테마, 네오모피즘

**URL:** https://meta.discourse.org/t/neomorphism-a-modern-theme-for-discourse/188657
**Category:** Theme
**Tags:** broken
**Created:** [4월 30, 2021, 7:20오전 UTC](https://meta.discourse.org/t/neomorphism-a-modern-theme-for-discourse/188657 "2021-04-30T07:20:23Z")
**Posts on this page:** 1
**Showing post:** 15

<div class="post-metadata">

### Author: ![isaac](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/isaac/32/235758_2.png) [@isaac](https://meta.discourse.org/u/isaac)
#### Post date: [9월 8, 2023, 6:27오후 UTC](https://meta.discourse.org/t/neomorphism-a-modern-theme-for-discourse/188657/15 "2023-09-08T18:27:26Z")

</div>

@amanintech 안녕하세요,

검색 메뉴와 그 로직이 (비추천된) 위젯에서 글리머 컴포넌트로 [변경](https://github.com/discourse/discourse/pull/20482)되었습니다. 해당 변경 사항은 현재 그룹 기반 기능 플래그로 비공개되어 있지만, 가까운 미래에 글리머 검색 메뉴를 새로운 기본값으로 전환할 계획입니다. 이 변경 사항은 테마의 `search` 오버라이드를 깨뜨리게 되므로, 전환하기 전에 미리 말씀드리고자 합니다.

참고용 PR 링크입니다.

> <https://github.com/discourse/discourse/pull/20482>
>
> \# Top level view
> This PR is the first version of converting the search menu and… its logic from (deprecated) widgets to glimmer components. The changes are hidden behind a group based feature flag. This will give us the ability to test the new implementation in a production setting before fully committing to the new search menu.
> 
> \# What has changed
> The majority of the logic from the widget implementation has been updated to fit within the context of a glimmer component, but it has not fundamentally changed. Instead of having a single widget - \[search-menu.js\](https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/widgets/search-menu.js) - that built the bulk of the search menu logic, we split the logic into (20+) bite size components. This greatly increases the readability and makes extending a component in the search menu much more straightforward.
> 
> That being said, certain pieces needed to be rewritten from scratch as they did not translate from widget -\> glimmer, or there was a general code upgraded needed. There are a few of these changes worth noting:
> 
> \### Search Service
> \*\*Search Term\*\* -\> In the widget implementation we had a overly complex way of managing the current search term. We tracked the search term across multiple different states (\`term\`, \`opts.term\`, \`searchData.term\`) causing headaches. This PR introduces a single source of truth: 
> \`\`\`js
> this.search.activeGlobalSearchTerm
> \`\`\`
> This tracked value is available anywhere the \`search\` service is injected. In the case the search term should be needs to be updated you can call 
> \`\`\`js
> this.search.activeGlobalSearchTerm = "foo"
> \`\`\`
>  
> \*\*event listeners\*\* -\> In the widget implementation we defined event listeners \*\*only\*\* on the search input to handle things such as 
> \- keyboard navigation / shortcuts
> \- closing the search menu
> \- performing a search with "enter"
> 
> Having this in one place caused a lot of bloat in our logic as we had to handle multiple different cases in one location. Do \_x\_ if it is this element, but do \_y\_ if it is another. This PR updates the event listeners to be attached to individual components, allowing for a more fine tuned set of actions per element. To not duplicate logic across multiple components, we have condensed shared logic to actions on the search service to be reused. For example - \`this.search.handleArrowUpOrDown\` - to handle keyboard navigation.
> 
> \### Search Context
> We have unique logic based on the current search context (topic / tag / category / user / etc). This context is set within a models route file. We have updated the search service with a tracked value \`searchContext\` that can be utilized and updated from any component where the search service is injected.
> 
> \`\`\`js
> \# before
> this.searchService.set("searchContext", user.searchContext);
> 
> \# after
> this.searchService.searchContext = user.searchContext;
> \`\`\`
> 
> \# Views
> \<img width="434" alt="Screenshot 2023-06-15 at 11 01 01 AM" src="https://github.com/discourse/discourse/assets/50783505/ef57e8e6-4e7b-4ba0-a770-8f2ed6310569"\>
> 
> \<img width="418" alt="Screenshot 2023-06-15 at 11 04 11 AM" src="https://github.com/discourse/discourse/assets/50783505/2c1e0b38-d12c-4339-a1d5-04f0c1932b08"\>
> 
> \<img width="413" alt="Screenshot 2023-06-15 at 11 04 34 AM" src="https://github.com/discourse/discourse/assets/50783505/b871d164-88cb-405e-9b78-d326a6f63686"\>
> 
> \<img width="419" alt="Screenshot 2023-06-15 at 11 07 51 AM" src="https://github.com/discourse/discourse/assets/50783505/c7309a19-f541-47f4-94ef-10fa65658d8c"\>
> 
> \<img width="424" alt="Screenshot 2023-06-15 at 11 04 48 AM" src="https://github.com/discourse/discourse/assets/50783505/f3dba06e-b029-431c-b3d0-36727b9e6dce"\>
> 
> \<img width="415" alt="Screenshot 2023-06-15 at 11 08 57 AM" src="https://github.com/discourse/discourse/assets/50783505/ad4e7250-040c-4d06-bf06-99652f4c7b7c"\>

감사합니다. 👋

---

_[View the full topic](https://meta.discourse.org/t/neomorphism-a-modern-theme-for-discourse/188657)._