i18n and type fixes

Author: nmscode

src/components/views/emojipicker/Emoji.tsx

@@ -22,7 +22,7 @@ import { ButtonEvent } from "../elements/AccessibleButton";
 import { RovingAccessibleButton } from "../../../accessibility/RovingTabIndex";
 
 interface IProps {
-    emoji: IEmoji;
+    emoji: EmojiandEmotes;
     selectedEmojis?: Set<string>;
     onClick(ev: ButtonEvent, emoji: IEmoji): void;
     onMouseEnter(emoji: IEmoji): void;
@@ -31,7 +31,10 @@ interface IProps {
     id?: string;
     role?: string;
 }
-
+interface EmojiandEmotes extends IEmoji {
+    customLabel?: string; // Custom label for custom emotes in emojipicker
+    customComponent?: JSX.Element; // Custom react component for rendering custom emotes in emojipicker
+}
 class Emoji extends React.PureComponent<IProps> {
     public render(): React.ReactNode {
         const { onClick, onMouseEnter, onMouseLeave, emoji, selectedEmojis } = this.props;

src/components/views/emojipicker/EmojiPicker.tsx

@@ -63,14 +63,17 @@ interface IProps {
 
 interface IState {
     filter: string;
-    previewEmoji?: IEmoji;
+    previewEmoji?: EmojiandEmotes;
     scrollTop: number;
     // initial estimation of height, dialog is hardcoded to 450px height.
     // should be enough to never have blank rows of emojis as
     // 3 rows of overflow are also rendered. The actual value is updated on scroll.
     viewportHeight: number;
 }
-
+interface EmojiandEmotes extends IEmoji {
+    customLabel?: string; // Custom label for custom emotes in emojipicker
+    customComponent?: JSX.Element; // Custom react component for rendering custom emotes in emojipicker
+}
 class EmojiPicker extends React.Component<IProps, IState> {
     private recentlyUsed: IEmoji[];
     private readonly memoizedDataByCategory: Record<CategoryKey, IEmoji[]>;
@@ -80,8 +83,8 @@ class EmojiPicker extends React.Component<IProps, IState> {
 
     private emotes?: Map<string, JSX.Element>;
     private emotesPromise?: Promise<Map<string, JSX.Element>>;
-    private finalEmotes: IEmoji[];
-    private finalEmotesMap: Map<string, IEmoji>;
+    private finalEmotes: EmojiandEmotes[];
+    private finalEmotesMap: Map<string, EmojiandEmotes>;
     public constructor(props: IProps) {
         super(props);