From 06e5b868898299cbcd39de71aac5835fef865d01 Mon Sep 17 00:00:00 2001
From: gabriellsh <40830821+gabriellsh@users.noreply.github.com>
Date: Fri, 15 May 2020 00:36:32 -0300
Subject: [PATCH] [NEW] Added "Add custom emoji" link to emoji picker (#16250)

Co-authored-by: Guilherme Gazzo <guilhermegazzo@gmail.com>
---
 app/emoji/client/emojiPicker.html                   | 5 ++++-
 app/emoji/client/emojiPicker.js                     | 7 +++++++
 app/theme/client/imports/components/emojiPicker.css | 6 ++++++
 packages/rocketchat-i18n/i18n/en.i18n.json          | 1 +
 4 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/app/emoji/client/emojiPicker.html b/app/emoji/client/emojiPicker.html
index 0e3a5c7546e..498f4ec1e48 100644
--- a/app/emoji/client/emojiPicker.html
+++ b/app/emoji/client/emojiPicker.html
@@ -44,6 +44,9 @@
 				{{/each}}
 			{{/if}}
 		</div>
-		<div class="emoji-footer">{{{_"Emoji_provided_by_JoyPixels"}}}</div>
+		<div class="emoji-footer">
+			{{#if hasPermission 'manage-emoji'}}<a class="add-custom" href="/admin/emoji-custom">{{_"Add_custom_emoji"}}</a>{{/if}}
+			{{{_"Emoji_provided_by_JoyPixels"}}}
+		</div>
 	</div>
 </template>
diff --git a/app/emoji/client/emojiPicker.js b/app/emoji/client/emojiPicker.js
index 410bbfa5682..86360cc4757 100644
--- a/app/emoji/client/emojiPicker.js
+++ b/app/emoji/client/emojiPicker.js
@@ -1,6 +1,7 @@
 import _ from 'underscore';
 import { ReactiveVar } from 'meteor/reactive-var';
 import { ReactiveDict } from 'meteor/reactive-dict';
+import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Template } from 'meteor/templating';
 
 import { t } from '../../utils/client';
@@ -142,6 +143,12 @@ Template.emojiPicker.events({
 		event.stopPropagation();
 		event.preventDefault();
 	},
+	'click .add-custom'(event) {
+		event.stopPropagation();
+		event.preventDefault();
+		FlowRouter.go('/admin/emoji-custom');
+		EmojiPicker.close();
+	},
 	'click .category-link'(event) {
 		event.stopPropagation();
 		event.preventDefault();
diff --git a/app/theme/client/imports/components/emojiPicker.css b/app/theme/client/imports/components/emojiPicker.css
index bd2d72a0b9c..f8601a798a4 100644
--- a/app/theme/client/imports/components/emojiPicker.css
+++ b/app/theme/client/imports/components/emojiPicker.css
@@ -122,6 +122,12 @@
 	font-size: 12px;
 
 	font-weight: 500;
+
+	& .add-custom {
+		display: inline-block;
+
+		width: 100%;
+	}
 }
 
 .emoji-top {
diff --git a/packages/rocketchat-i18n/i18n/en.i18n.json b/packages/rocketchat-i18n/i18n/en.i18n.json
index 00c5277b543..5253a9c8327 100644
--- a/packages/rocketchat-i18n/i18n/en.i18n.json
+++ b/packages/rocketchat-i18n/i18n/en.i18n.json
@@ -233,6 +233,7 @@
   "MAU_value": "MAU __value__",
   "Activity": "Activity",
   "Add": "Add",
+  "Add_custom_emoji": "Add custom emoji",
   "add-oauth-service": "Add Oauth Service",
   "add-oauth-service_description": "Permission to add a new Oauth service",
   "add-user": "Add User",