Browse Source

Add emoji autocomplete

- Fixes #255
unoptim
Dessalines 3 years ago
parent
commit
f1ddd2e2e2
  1. 22
      src/components/comment-form.tsx
  2. 1
      src/emoji_list.ts
  3. 14
      src/utils.ts

22
src/components/comment-form.tsx

@ -1,7 +1,7 @@
import { Component, linkEvent } from 'inferno';
import { CommentNode as CommentNodeI, CommentForm as CommentFormI, SearchForm, SearchType, SortType, UserOperation, SearchResponse } from '../interfaces';
import { Subscription } from "rxjs";
import { capitalizeFirstLetter, fetchLimit, msgOp } from '../utils';
import { capitalizeFirstLetter, fetchLimit, msgOp, md, emojiMentionList } from '../utils';
import { WebSocketService, UserService } from '../services';
import * as autosize from 'autosize';
import { i18n } from '../i18next';
@ -42,7 +42,21 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
this.tribute = new Tribute({
collection: [
// Emojis
{
trigger: ':',
menuItemTemplate: (item: any) => {
let emoji = `:${item.original.key}:`;
return `${md.renderInline(emoji)} ${emoji}`;
},
selectTemplate: (item: any) => {
return `:${item.original.key}:`;
},
values: emojiMentionList(),
allowSpaces: false,
autocompleteMode: true,
menuItemLimit: 10,
},
// Users
{
trigger: '@',
@ -52,7 +66,9 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
values: (text: string, cb: any) => {
this.userSearch(text, (users: any) => cb(users));
},
allowSpaces: false,
autocompleteMode: true,
menuItemLimit: 10,
},
// Communities
@ -64,7 +80,9 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
values: (text: string, cb: any) => {
this.communitySearch(text, (communities: any) => cb(communities));
},
allowSpaces: false,
autocompleteMode: true,
menuItemLimit: 10,
}
]
});

1
src/emoji_list.ts
File diff suppressed because it is too large
View File

14
src/utils.ts

@ -11,15 +11,16 @@ import { UserOperation, Comment, User, SortType, ListingType } from './interface
import * as markdown_it from 'markdown-it';
declare var markdownitEmoji: any;
import * as markdown_it_container from 'markdown-it-container';
import { emoji_list } from './emoji_list';
export let repoUrl = 'https://github.com/dessalines/lemmy';
export const repoUrl = 'https://github.com/dessalines/lemmy';
export function msgOp(msg: any): UserOperation {
let opStr: string = msg.op;
return UserOperation[opStr];
}
var md = new markdown_it({
export const md = new markdown_it({
html: false,
linkify: true,
typographer: true
@ -184,6 +185,15 @@ export function getLanguage(): string {
return (navigator.language || navigator.userLanguage);
}
export function emojiMentionList(): Array<{}> {
let keyedEmojis = [];
for (let e of emoji_list) {
let obj = {key: e};
keyedEmojis.push(obj);
}
return keyedEmojis;
}
export function getMomentLanguage(): string {
let lang = getLanguage();
if (lang.startsWith('zh')) {

Loading…
Cancel
Save