1 files changed, 48 insertions, 1 deletions

diff --git a/webapp/stores/emoji_store.jsx b/webapp/stores/emoji_store.jsx
index 212583ea8..444a27c72 100644
--- a/webapp/stores/emoji_store.jsx
+++ b/webapp/stores/emoji_store.jsx
@@ -5,12 +5,13 @@ import Client from '../client/web_client.jsx';
 import AppDispatcher from '../dispatcher/app_dispatcher.jsx';
 import Constants from 'utils/constants.jsx';
 import EventEmitter from 'events';
-
 import * as Emoji from 'utils/emoji.jsx';
 
 const ActionTypes = Constants.ActionTypes;
 
 const CHANGE_EVENT = 'changed';
+const RECENT_EMOJI_KEY = 'recentEmojis';
+const MAXIMUM_RECENT_EMOJI = 27;
 
 // Wrap the contents of the store so that we don't need to construct an ES6 map where most of the content
 // (the system emojis) will never change. It provides the get/has functions of a map and an iterator so
@@ -139,6 +140,48 @@ class EmojiStore extends EventEmitter {
         return this.map.get(name);
     }
 
+    addRecentEmoji(rawAlias) {
+        const recentEmojis = this.getRecentEmojis();
+
+        const alias = rawAlias.split(':').join('');
+
+        let emoji = this.getCustomEmojiMap().get(alias);
+
+        if (!emoji) {
+            const emojiIndex = Emoji.EmojiIndicesByAlias.get(alias);
+            emoji = Emoji.Emojis[emojiIndex];
+        }
+
+        if (!emoji) {
+            // something is wrong, so we return
+            return;
+        }
+
+        // odd workaround to the lack of array.findLastIndex - reverse looping & splice
+        for (let i = recentEmojis.length - 1; i >= 0; i--) {
+            if ((emoji.name && recentEmojis[i].name === emoji.name) ||
+                (emoji.filename && recentEmojis[i].filename === emoji.filename)) {
+                recentEmojis.splice(i, 1);
+                break;
+            }
+        }
+        recentEmojis.push(emoji);
+
+        // cut off the _top_ if it's over length (since new are added to end)
+        if (recentEmojis.length > MAXIMUM_RECENT_EMOJI) {
+            recentEmojis.splice(0, recentEmojis.length - MAXIMUM_RECENT_EMOJI);
+        }
+        localStorage.setItem(RECENT_EMOJI_KEY, JSON.stringify(recentEmojis));
+    }
+
+    getRecentEmojis() {
+        const result = JSON.parse(localStorage.getItem(RECENT_EMOJI_KEY));
+        if (!result) {
+            return [];
+        }
+        return result;
+    }
+
     hasUnicode(codepoint) {
         return Emoji.EmojiIndicesByUnicode.has(codepoint);
     }
@@ -174,6 +217,10 @@ class EmojiStore extends EventEmitter {
             this.removeCustomEmoji(action.id);
             this.emitChange();
             break;
+        case ActionTypes.EMOJI_POSTED:
+            this.addRecentEmoji(action.alias);
+            this.emitChange();
+            break;
         }
     }
 }