IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-02-25 18:55:32 -06:00
Code Issues Packages Projects Releases Wiki Activity

FIX: Setting emoji filter from initial autocomplete (#16063)

Browse Source 
…has regressed at some point
This commit is contained in:
Jarek Radosz 2022-02-28 15:01:26 +01:00 committed by GitHub
parent 37b6fa7a1b
commit 1a5c6f7632
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 16 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
app/assets/javascripts/discourse/app/components/d-editor.js
View File

@ -11,7 +11,7 @@ import discourseComputed, {
} from "discourse-common/utils/decorators"; } from "discourse-common/utils/decorators";
import { emojiSearch, isSkinTonableEmoji } from "pretty-text/emoji"; import { emojiSearch, isSkinTonableEmoji } from "pretty-text/emoji";
import { emojiUrlFor, generateCookFunction } from "discourse/lib/text"; import { emojiUrlFor, generateCookFunction } from "discourse/lib/text";
import { later, schedule, scheduleOnce } from "@ember/runloop"; import { schedule, scheduleOnce } from "@ember/runloop";
import Component from "@ember/component"; import Component from "@ember/component";
import I18n from "I18n"; import I18n from "I18n";
import ItsATrap from "@discourse/itsatrap"; import ItsATrap from "@discourse/itsatrap";
@ -221,6 +221,7 @@ export default Component.extend(TextareaTextManipulation, {
_itsatrap: null, _itsatrap: null,
showLink: true, showLink: true,
emojiPickerIsActive: false, emojiPickerIsActive: false,
emojiFilter: "",
emojiStore: service("emoji-store"), emojiStore: service("emoji-store"),
isEditorFocused: false, isEditorFocused: false,
processPreview: true, processPreview: true,
@ -514,17 +515,7 @@ export default Component.extend(TextareaTextManipulation, {
} else { } else {
$textarea.autocomplete({ cancel: true }); $textarea.autocomplete({ cancel: true });
this.set("emojiPickerIsActive", true); this.set("emojiPickerIsActive", true);
this.set("emojiFilter", v.term);
schedule("afterRender", () => {
const filterInput = document.querySelector(
".emoji-picker input[name='filter']"
);
if (filterInput) {
filterInput.value = v.term;
later(() => filterInput.dispatchEvent(new Event("input")), 50);
}
});
return ""; return "";
} }

12
app/assets/javascripts/discourse/app/components/emoji-picker.js
View File

@ -38,6 +38,7 @@ export default Component.extend({
isActive: false, isActive: false,
isLoading: true, isLoading: true,
usePopper: true, usePopper: true,
initialFilter: "",
init() { init() {
this._super(...arguments); this._super(...arguments);
@ -82,6 +83,7 @@ export default Component.extend({
this.set("recentEmojis", this.emojiStore.favorites); this.set("recentEmojis", this.emojiStore.favorites);
schedule("afterRender", () => { schedule("afterRender", () => {
this._applyFilter(this.initialFilter);
document.addEventListener("click", this.handleOutsideClick); document.addEventListener("click", this.handleOutsideClick);
const emojiPicker = document.querySelector(".emoji-picker"); const emojiPicker = document.querySelector(".emoji-picker");
@ -245,13 +247,17 @@ export default Component.extend({
}, },
@action @action
onFilter(event) { onFilterChange(event) {
this._applyFilter(event.target.value);
},
_applyFilter(filter) {
const emojiPicker = document.querySelector(".emoji-picker"); const emojiPicker = document.querySelector(".emoji-picker");
const results = document.querySelector(".emoji-picker-emoji-area .results"); const results = document.querySelector(".emoji-picker-emoji-area .results");
results.innerHTML = ""; results.innerHTML = "";
if (event.target.value) { if (filter) {
results.innerHTML = emojiSearch(event.target.value.toLowerCase(), { results.innerHTML = emojiSearch(filter.toLowerCase(), {
maxResults: 20, maxResults: 20,
diversity: this.emojiStore.diversity, diversity: this.emojiStore.diversity,
}) })

1
app/assets/javascripts/discourse/app/templates/components/d-editor.hbs
View File

@ -72,6 +72,7 @@
{{emoji-picker {{emoji-picker
isActive=emojiPickerIsActive isActive=emojiPickerIsActive
isEditorFocused=isEditorFocused isEditorFocused=isEditorFocused
initialFilter=this.emojiFilter
emojiSelected=(action "emojiSelected") emojiSelected=(action "emojiSelected")
onEmojiPickerClose=(action (mut emojiPickerIsActive) false) onEmojiPickerClose=(action (mut emojiPickerIsActive) false)
}} }}

5
app/assets/javascripts/discourse/app/templates/components/emoji-picker.hbs
View File

@ -1,6 +1,6 @@
{{#if isActive}} {{#if isActive}}
{{!-- template-lint-disable no-invalid-interactive --}} {{!-- template-lint-disable no-invalid-interactive --}}
<div {{on "keydown" (action "keydown")}} class="emoji-picker {{if @isActive "opened"}}"> <div {{on "keydown" (action "keydown")}} class="emoji-picker {{if this.isActive "opened"}}">
{{!-- template-lint-enable no-invalid-interactive --}} {{!-- template-lint-enable no-invalid-interactive --}}
<div class="emoji-picker-category-buttons"> <div class="emoji-picker-category-buttons">
{{#if recentEmojis.length}} {{#if recentEmojis.length}}
@ -23,12 +23,13 @@
{{input {{input
class="filter" class="filter"
name="filter" name="filter"
value=@initialFilter
placeholder=(i18n "emoji_picker.filter_placeholder") placeholder=(i18n "emoji_picker.filter_placeholder")
autocomplete="off" autocomplete="off"
type="search" type="search"
autocorrect="off" autocorrect="off"
autocapitalize="off" autocapitalize="off"
input=(action "onFilter") input=(action "onFilterChange")
}} }}
{{d-icon "search"}} {{d-icon "search"}}