[MM-14018] Ignore leading/trailing colon in emoji picker search (#2974)
* [MM-14018] Ignore leading/trailing colon in emoji picker search * Respond to feedback * fix failing test on ESlint
This commit is contained in:
parent
577ab85151
commit
958df2e65f
2 changed files with 38 additions and 10 deletions
|
|
@ -35,6 +35,10 @@ const SECTION_MARGIN = 15;
|
|||
const SECTION_HEADER_HEIGHT = 28;
|
||||
const EMOJIS_PER_PAGE = 200;
|
||||
|
||||
export function filterEmojiSearchInput(searchText) {
|
||||
return searchText.toLowerCase().replace(/^:|:$/g, '');
|
||||
}
|
||||
|
||||
export default class EmojiPicker extends PureComponent {
|
||||
static propTypes = {
|
||||
customEmojisEnabled: PropTypes.bool.isRequired,
|
||||
|
|
@ -160,24 +164,25 @@ export default class EmojiPicker extends PureComponent {
|
|||
});
|
||||
};
|
||||
|
||||
changeSearchTerm = (text) => {
|
||||
changeSearchTerm = (rawText) => {
|
||||
const searchTerm = filterEmojiSearchInput(rawText);
|
||||
const nextState = {
|
||||
searchTerm: text,
|
||||
searchTerm: rawText,
|
||||
};
|
||||
|
||||
if (!text) {
|
||||
nextState.currentSectionIndex = 0;
|
||||
}
|
||||
|
||||
this.setState(nextState);
|
||||
|
||||
if (!searchTerm) {
|
||||
nextState.currentSectionIndex = 0;
|
||||
return;
|
||||
}
|
||||
|
||||
clearTimeout(this.searchTermTimeout);
|
||||
const timeout = text ? 100 : 0;
|
||||
const timeout = searchTerm ? 100 : 0;
|
||||
this.searchTermTimeout = setTimeout(async () => {
|
||||
if (isMinimumServerVersion(this.props.serverVersion, 4, 7)) {
|
||||
await this.props.actions.searchCustomEmojis(text);
|
||||
await this.props.actions.searchCustomEmojis(searchTerm);
|
||||
}
|
||||
const filteredEmojis = this.searchEmojis(text);
|
||||
const filteredEmojis = this.searchEmojis(searchTerm);
|
||||
this.setState({
|
||||
filteredEmojis,
|
||||
});
|
||||
|
|
|
|||
23
app/components/emoji_picker/emoji_picker.test.js
Normal file
23
app/components/emoji_picker/emoji_picker.test.js
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
||||
// See LICENSE.txt for license information.
|
||||
|
||||
import {filterEmojiSearchInput} from './emoji_picker.js';
|
||||
|
||||
describe('components/emoji_picker/EmojiPicker', () => {
|
||||
const testCases = [
|
||||
{input: 'smile', output: 'smile'},
|
||||
{input: 'SMILE', output: 'smile'},
|
||||
{input: ':smile', output: 'smile'},
|
||||
{input: ':SMILE', output: 'smile'},
|
||||
{input: 'smile:', output: 'smile'},
|
||||
{input: 'SMILE:', output: 'smile'},
|
||||
{input: ':smile:', output: 'smile'},
|
||||
{input: ':SMILE:', output: 'smile'},
|
||||
];
|
||||
|
||||
testCases.forEach((testCase) => {
|
||||
test(`'${testCase.input}' should return '${testCase.output}'`, () => {
|
||||
expect(filterEmojiSearchInput(testCase.input)).toEqual(testCase.output);
|
||||
});
|
||||
});
|
||||
});
|
||||
Loading…
Reference in a new issue