From 24b6811a6ed5c3449b6fd82dc30e5b988b76df99 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Tue, 28 Aug 2018 13:52:18 +0200 Subject: [Glitch] Implement tag auto-completion by history Port 460e380d386367b6809d319859e13d17a6a2acea to glitch-soc --- .../glitch/features/composer/textarea/index.js | 2 +- .../composer/textarea/suggestions/item/index.js | 68 ++++++++++++---------- 2 files changed, 38 insertions(+), 32 deletions(-) (limited to 'app/javascript/flavours/glitch/features') diff --git a/app/javascript/flavours/glitch/features/composer/textarea/index.js b/app/javascript/flavours/glitch/features/composer/textarea/index.js index 51d44a83b..50e46fc78 100644 --- a/app/javascript/flavours/glitch/features/composer/textarea/index.js +++ b/app/javascript/flavours/glitch/features/composer/textarea/index.js @@ -58,7 +58,7 @@ const handlers = { const right = value.slice(selectionStart).search(/[\s\u200B]/); const token = function () { switch (true) { - case left < 0 || !/[@:]/.test(value[left]): + case left < 0 || !/[@:#]/.test(value[left]): return null; case right < 0: return value.slice(left); diff --git a/app/javascript/flavours/glitch/features/composer/textarea/suggestions/item/index.js b/app/javascript/flavours/glitch/features/composer/textarea/suggestions/item/index.js index f55640bcf..331692398 100644 --- a/app/javascript/flavours/glitch/features/composer/textarea/suggestions/item/index.js +++ b/app/javascript/flavours/glitch/features/composer/textarea/suggestions/item/index.js @@ -57,6 +57,42 @@ export default class ComposerTextareaSuggestionsItem extends React.Component { } = this.props; const computedClass = classNames('composer--textarea--suggestions--item', { selected }); + // If the suggestion is an object, then we render an emoji. + // Otherwise, we render a hashtag if it starts with #, or an account. + let inner; + if (typeof suggestion === 'object') { + let url; + if (suggestion.custom) { + url = suggestion.imageUrl; + } else { + const mapping = unicodeMapping[suggestion.native] || unicodeMapping[suggestion.native.replace(/\uFE0F$/, '')]; + if (mapping) { + url = `${assetHost}/emoji/${mapping.filename}.svg`; + } + } + if (url) { + inner = ( +
+ {suggestion.native + {suggestion.colons} +
+ ); + } + } else if (suggestion[0] === '#') { + inner = suggestion; + } else { + inner = ( + + ); + } + // The result. return (
- { // If the suggestion is an object, then we render an emoji. - // Otherwise, we render an account. - typeof suggestion === 'object' ? function () { - const url = function () { - if (suggestion.custom) { - return suggestion.imageUrl; - } else { - const mapping = unicodeMapping[suggestion.native] || unicodeMapping[suggestion.native.replace(/\uFE0F$/, '')]; - if (!mapping) { - return null; - } - return `${assetHost}/emoji/${mapping.filename}.svg`; - } - }(); - return url ? ( -
- {suggestion.native - {suggestion.colons} -
- ) : null; - }() : ( - - ) - } + { inner }
); } -- cgit