DEV: Finalize glimmer search menu (#23174)
There was a few outstanding items that needed cleaning up. ### Make sure we don't clear the topic context prematurely ##### Before https://github.com/discourse/discourse/assets/50783505/e92e4d6f-f42c-4357-8f13-8fa9f1024ade _getting to zero search characters would automatically clear the search context_ ##### After https://github.com/discourse/discourse/assets/50783505/fd805dfd-576d-4e32-b6b5-5b93c25a5782 ### Style fixes ##### Before <img width="498" alt="Screenshot 2023-08-21 at 4 37 31 PM" src="https://github.com/discourse/discourse/assets/50783505/70847db1-43ec-477e-a21a-54ef2de0af42"> ##### After <img width="500" alt="Screenshot 2023-08-21 at 4 38 36 PM" src="https://github.com/discourse/discourse/assets/50783505/98cfb2e9-7c4d-44a6-bde2-53b85318fed3"> ##### Before <img width="450" alt="Screenshot 2023-08-21 at 4 33 45 PM" src="https://github.com/discourse/discourse/assets/50783505/3e057a52-5d1c-4776-93d0-a48133a722bc"> ##### After <img width="451" alt="Screenshot 2023-08-21 at 4 34 30 PM" src="https://github.com/discourse/discourse/assets/50783505/77548f6c-a9cf-4cf8-88d8-ee249736d684"> ##### Before <img width="460" alt="Screenshot 2023-08-21 at 4 31 01 PM" src="https://github.com/discourse/discourse/assets/50783505/9da57868-bc66-4d84-9108-4ae705a0562b"> ##### After <img width="456" alt="Screenshot 2023-08-21 at 4 30 52 PM" src="https://github.com/discourse/discourse/assets/50783505/f9444546-97f2-4d1a-9f78-7407f0f32ae7">
This commit is contained in:
parent
3eb8046dde
commit
742d71e99c
|
@ -59,6 +59,11 @@ export default class AssistantItem extends Component {
|
|||
|
||||
@action
|
||||
onKeydown(e) {
|
||||
// don't capture tab key
|
||||
if (e.key === "Tab") {
|
||||
return;
|
||||
}
|
||||
|
||||
if (e.key === "Escape") {
|
||||
focusSearchButton();
|
||||
this.args.closeSearchMenu();
|
||||
|
|
|
@ -16,6 +16,7 @@ export default class SearchTerm extends Component {
|
|||
@service appEvents;
|
||||
|
||||
@tracked lastEnterTimestamp = null;
|
||||
@tracked searchCleared = !this.search.activeGlobalSearchTerm;
|
||||
|
||||
// make constant available in template
|
||||
get inputId() {
|
||||
|
@ -28,6 +29,8 @@ export default class SearchTerm extends Component {
|
|||
this.search.activeGlobalSearchTerm,
|
||||
input.target.value
|
||||
);
|
||||
|
||||
this.searchCleared = this.search.activeGlobalSearchTerm ? false : true;
|
||||
}
|
||||
|
||||
@action
|
||||
|
@ -70,9 +73,13 @@ export default class SearchTerm extends Component {
|
|||
|
||||
if (e.key === "Backspace") {
|
||||
if (!e.target.value) {
|
||||
this.args.clearTopicContext();
|
||||
this.args.clearPMInboxContext();
|
||||
this.focus(e.target);
|
||||
// only clear context if we're not in the middle of a search
|
||||
if (this.searchCleared) {
|
||||
this.args.clearTopicContext();
|
||||
this.args.clearPMInboxContext();
|
||||
this.focus(e.target);
|
||||
}
|
||||
this.searchCleared = true;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -426,7 +426,7 @@ createWidget("glimmer-search-menu-wrapper", {
|
|||
},
|
||||
|
||||
buildClasses() {
|
||||
return ["search-menu"];
|
||||
return ["search-menu glimmer-search-menu"];
|
||||
},
|
||||
|
||||
html() {
|
||||
|
|
|
@ -363,3 +363,22 @@ $search-pad-horizontal: 0.5em;
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
// these styles will become the default once the glimmer search menu
|
||||
// is enabled for all users, and the old search menu is removed
|
||||
// we can then drop any '!important' rules
|
||||
.search-menu.glimmer-search-menu {
|
||||
.search-item-tag .d-icon {
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
.search-item-user {
|
||||
.username {
|
||||
margin-right: 0.33rem;
|
||||
}
|
||||
|
||||
img.avatar {
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue