From 9f1cef9844d42cda4164f799d9ac460f29322209 Mon Sep 17 00:00:00 2001
From: Vincent <vincent@loki.network>
Date: Tue, 21 Jul 2020 17:37:34 +1000
Subject: [PATCH] emoji-rendering

---
 about.html                                    |  2 +-
 background.html                               |  2 +-
 background_test.html                          |  2 +-
 debug_log.html                                |  2 +-
 package.json                                  |  2 +-
 password.html                                 |  2 +-
 permissions_popup.html                        |  2 +-
 stylesheets/_session_conversation.scss        |  2 +-
 .../session/SessionKeyVerification.tsx        |  1 +
 .../conversation/SessionCompositionBox.tsx    | 15 +++++
 yarn.lock                                     | 65 +++++++++++--------
 11 files changed, 62 insertions(+), 35 deletions(-)

diff --git a/about.html b/about.html
index 6c1a9ddf8..3bab2be19 100644
--- a/about.html
+++ b/about.html
@@ -7,7 +7,7 @@
             font-src 'self';
             form-action 'self';
             frame-src 'none';
-            img-src 'self' blob: data:;
+            img-src 'self' data:;
             media-src 'self' blob:;
             object-src 'none';
             script-src 'self';
diff --git a/background.html b/background.html
index d327aa36f..da9f2d4f0 100644
--- a/background.html
+++ b/background.html
@@ -13,7 +13,7 @@
             font-src 'self';
             form-action 'self';
             frame-src 'none';
-            img-src 'self' blob: data:;
+            img-src 'self' data:;
             media-src 'self' blob:;
             object-src 'none';
             script-src 'self';
diff --git a/background_test.html b/background_test.html
index 477c49394..8b74902b8 100644
--- a/background_test.html
+++ b/background_test.html
@@ -13,7 +13,7 @@
             font-src 'self';
             form-action 'self';
             frame-src 'none';
-            img-src 'self' blob: data:;
+            img-src 'self' data:;
             media-src 'self' blob:;
             object-src 'none';
             script-src 'self' 'unsafe-eval';
diff --git a/debug_log.html b/debug_log.html
index f0b7b0262..effc02174 100644
--- a/debug_log.html
+++ b/debug_log.html
@@ -7,7 +7,7 @@
             font-src 'self';
             form-action 'self';
             frame-src 'none';
-            img-src 'self' blob: data:;
+            img-src 'self' data:;
             media-src 'self' blob:;
             object-src 'none';
             script-src 'self';
diff --git a/package.json b/package.json
index 953d576ca..e71636c49 100644
--- a/package.json
+++ b/package.json
@@ -109,6 +109,7 @@
     "react-dom": "16.8.3",
     "react-dropzone": "^11.0.2",
     "react-emoji": "^0.5.0",
+    "react-emoji-render": "^1.2.4",
     "react-h5-audio-player": "^3.2.0",
     "react-portal": "^4.2.0",
     "react-qr-svg": "^2.2.1",
@@ -124,7 +125,6 @@
     "tar": "4.4.8",
     "tmp": "0.0.33",
     "to-arraybuffer": "1.0.1",
-    "twemoji": "^13.0.0",
     "typings-for-css-modules-loader": "^1.7.0",
     "underscore": "1.9.0",
     "uuid": "3.3.2"
diff --git a/password.html b/password.html
index 05478651e..9d14407a4 100644
--- a/password.html
+++ b/password.html
@@ -7,7 +7,7 @@
             font-src 'self';
             form-action 'self';
             frame-src 'none';
-            img-src 'self' blob: data:;
+            img-src 'self' data:;
             media-src 'self' blob:;
             object-src 'none';
             script-src 'self';
diff --git a/permissions_popup.html b/permissions_popup.html
index e95b75ef0..70dffb25b 100644
--- a/permissions_popup.html
+++ b/permissions_popup.html
@@ -7,7 +7,7 @@
             font-src 'self';
             form-action 'self';
             frame-src 'none';
-            img-src 'self' blob: data:;
+            img-src 'self' data:;
             media-src 'self' blob:;
             object-src 'none';
             script-src 'self';
diff --git a/stylesheets/_session_conversation.scss b/stylesheets/_session_conversation.scss
index f800b0fc5..954e1015f 100644
--- a/stylesheets/_session_conversation.scss
+++ b/stylesheets/_session_conversation.scss
@@ -180,7 +180,7 @@ $composition-container-height: 60px;
   overflow-x: hidden;
   min-width: 370px;
   scrollbar-width: 4px;
-  padding: $session-margin-sm $session-margin-lg;
+  padding: $session-margin-sm $session-margin-lg $session-margin-lg;
 
   &__loading {
     position: absolute;
diff --git a/ts/components/session/SessionKeyVerification.tsx b/ts/components/session/SessionKeyVerification.tsx
index 8ec2628fe..bced9b117 100644
--- a/ts/components/session/SessionKeyVerification.tsx
+++ b/ts/components/session/SessionKeyVerification.tsx
@@ -14,6 +14,7 @@ import { SessionSpinner } from './SessionSpinner';
 import classNames from 'classnames';
 import { SessionIcon, SessionIconSize, SessionIconType } from './icon';
 import { Constants } from '../../session';
+import { Emojify } from '../conversation/Emojify';
 
 interface Props {
   conversation: ConversationModel;
diff --git a/ts/components/session/conversation/SessionCompositionBox.tsx b/ts/components/session/conversation/SessionCompositionBox.tsx
index 4f31277a1..eec4e09a3 100644
--- a/ts/components/session/conversation/SessionCompositionBox.tsx
+++ b/ts/components/session/conversation/SessionCompositionBox.tsx
@@ -14,6 +14,9 @@ import { SignalService } from '../../../../ts/protobuf';
 
 import { Constants } from '../../../session';
 
+import { Twemoji } from 'react-emoji-render';
+import { Emojify } from '../../conversation/Emojify';
+
 interface Props {
   placeholder?: string;
 
@@ -194,6 +197,18 @@ export class SessionCompositionBox extends React.Component<Props, State> {
             value={message}
             onChange={this.onChange}
           />
+          <div
+            contentEditable={true}
+
+          >
+            <Twemoji
+              text="EMOJIIIIS 😍😶😥🇬🇧😥😥🏴😆"
+              options={{
+                baseUrl: '/images/session/emojis/',
+                ext: 'svg',
+              }}
+            />
+          </div>
         </div>
 
         <SessionIconButton
diff --git a/yarn.lock b/yarn.lock
index 0cf4f3a24..a15a1dd5b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3277,6 +3277,11 @@ emoji-mart@^2.11.2:
   resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-6.1.1.tgz#c6cd0ec1b0642e2a3c67a1137efc5e796da4f88e"
   integrity sha1-xs0OwbBkLio8Z6ETfvxeeW2k+I4=
 
+emoji-regex@^6.4.1:
+  version "6.5.1"
+  resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-6.5.1.tgz#9baea929b155565c11ea41c6626eaa65cef992c2"
+  integrity sha512-PAHp6TxrCy7MGMFidro8uikr+zlJJKJ/Q6mm2ExZ7HwkyR9lSVFfE3kt36qcwa24BQL7y0G9axycGjK1A/0uNQ==
+
 emoji-regex@^7.0.1:
   version "7.0.3"
   resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-7.0.3.tgz#933a04052860c85e83c122479c4748a8e4c72156"
@@ -4146,7 +4151,7 @@ fs-extra@^4.0.1:
     jsonfile "^4.0.0"
     universalify "^0.1.0"
 
-fs-extra@^8.0.1, fs-extra@^8.1.0:
+fs-extra@^8.1.0:
   version "8.1.0"
   resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-8.1.0.tgz#49d43c45a88cd9677668cb7be1b46efdb8d2e1c0"
   integrity sha512-yhlQgA6mnOJUKOsRUFsgJdQCvkKhcz8tlZG5HBQfReYZy46OwLcY+Zia0mtdHsOo9y/hP+CxMN0TU9QxoOtG4g==
@@ -5141,7 +5146,7 @@ internal-ip@1.2.0:
   dependencies:
     meow "^3.3.0"
 
-invariant@^2.2.2, invariant@^2.2.4:
+invariant@^2.2.1, invariant@^2.2.2, invariant@^2.2.4:
   version "2.2.4"
   resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
   integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==
@@ -5816,15 +5821,6 @@ jsonfile@^4.0.0:
   optionalDependencies:
     graceful-fs "^4.1.6"
 
-jsonfile@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-5.0.0.tgz#e6b718f73da420d612823996fdf14a03f6ff6922"
-  integrity sha512-NQRZ5CRo74MhMMC3/3r5g2k4fjodJ/wh8MxjFbCViWKFjxrnudWSY5vomh+23ZaXzAS7J3fBZIR2dV6WbmfM0w==
-  dependencies:
-    universalify "^0.1.2"
-  optionalDependencies:
-    graceful-fs "^4.1.6"
-
 jsonfile@^6.0.1:
   version "6.0.1"
   resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-6.0.1.tgz#98966cba214378c8c84b82e085907b40bf614179"
@@ -6145,6 +6141,11 @@ lodash.cond@^4.3.0:
   resolved "https://registry.yarnpkg.com/lodash.cond/-/lodash.cond-4.5.2.tgz#f471a1da486be60f6ab955d17115523dd1d255d5"
   integrity sha1-9HGh2khr5g9quVXRcRVSPdHSVdU=
 
+lodash.flatten@^4.2.0, lodash.flatten@^4.4.0:
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/lodash.flatten/-/lodash.flatten-4.4.0.tgz#f31c22225a9632d2bbf8e4addbef240aa765a61f"
+  integrity sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8=
+
 lodash.get@^4.4.2:
   version "4.4.2"
   resolved "https://registry.yarnpkg.com/lodash.get/-/lodash.get-4.4.2.tgz#2d177f652fa31e939b4438d5341499dfa3825e99"
@@ -6155,6 +6156,11 @@ lodash.isequal@^4.5.0:
   resolved "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
   integrity sha1-QVxEePK8wwEgwizhDtMib30+GOA=
 
+lodash.isstring@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/lodash.isstring/-/lodash.isstring-4.0.1.tgz#d527dfb5456eca7cc9bb95d5daeaf88ba54a5451"
+  integrity sha1-1SfftUVuynzJu5XV2ur4i6VKVFE=
+
 lodash.memoize@^4.1.2:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
@@ -8509,6 +8515,17 @@ react-dropzone@^11.0.2:
     file-selector "^0.1.12"
     prop-types "^15.7.2"
 
+react-emoji-render@^1.2.4:
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/react-emoji-render/-/react-emoji-render-1.2.4.tgz#fa3542a692e1eed3236f0f12b8e3a61b2818e2c2"
+  integrity sha512-AqktVXV38uDpgf02BoCXrzLYFsHAsxfdWwjrLexSJ22l1JgB01y1KejjxW/zTuCzod6O7BZfiMS866LEEfMHmA==
+  dependencies:
+    classnames "^2.2.5"
+    emoji-regex "^6.4.1"
+    lodash.flatten "^4.4.0"
+    prop-types "^15.5.8"
+    string-replace-to-array "^1.0.1"
+
 react-emoji@^0.5.0:
   version "0.5.0"
   resolved "https://registry.yarnpkg.com/react-emoji/-/react-emoji-0.5.0.tgz#14b91cc6b3ce3c3246f740e7ef5de2ec0bee664b"
@@ -9903,6 +9920,15 @@ strict-uri-encode@^1.0.0:
   resolved "https://registry.yarnpkg.com/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz#279b225df1d582b1f54e65addd4352e18faa0713"
   integrity sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM=
 
+string-replace-to-array@^1.0.1:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/string-replace-to-array/-/string-replace-to-array-1.0.3.tgz#c93eba999a5ee24d731aebbaf5aba36b5f18f7bf"
+  integrity sha1-yT66mZpe4k1zGuu69auja18Y978=
+  dependencies:
+    invariant "^2.2.1"
+    lodash.flatten "^4.2.0"
+    lodash.isstring "^4.0.1"
+
 string-similarity@1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/string-similarity/-/string-similarity-1.1.0.tgz#3c66498858a465ec7c40c7d81739bbd995904914"
@@ -10564,21 +10590,6 @@ tweetnacl@^0.14.3, tweetnacl@~0.14.0:
   resolved "https://registry.yarnpkg.com/tweetnacl/-/tweetnacl-0.14.5.tgz#5ae68177f192d4456269d108afa93ff8743f4f64"
   integrity sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=
 
-twemoji-parser@13.0.0:
-  version "13.0.0"
-  resolved "https://registry.yarnpkg.com/twemoji-parser/-/twemoji-parser-13.0.0.tgz#bd9d1b98474f1651dc174696b45cabefdfa405af"
-  integrity sha512-zMaGdskpH8yKjT2RSE/HwE340R4Fm+fbie4AaqjDa4H/l07YUmAvxkSfNl6awVWNRRQ0zdzLQ8SAJZuY5MgstQ==
-
-twemoji@^13.0.0:
-  version "13.0.0"
-  resolved "https://registry.yarnpkg.com/twemoji/-/twemoji-13.0.0.tgz#bdda95c0a76553bb57a355459955feb79eeebcfb"
-  integrity sha512-JIkoLy0lL7ZlsiUKAOdXTp0o8C15O3CzDzAmnWdeDHpjeifmKDDKX4CyViUj+9g33pIqMr8Uhcy1WLwETr8oNg==
-  dependencies:
-    fs-extra "^8.0.1"
-    jsonfile "^5.0.0"
-    twemoji-parser "13.0.0"
-    universalify "^0.1.2"
-
 type-check@~0.3.2:
   version "0.3.2"
   resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.3.2.tgz#5884cab512cf1d355e3fb784f30804b2b520db72"
@@ -10809,7 +10820,7 @@ unist-util-visit@^1.1.0, unist-util-visit@^1.3.0:
   dependencies:
     unist-util-visit-parents "^2.0.0"
 
-universalify@^0.1.0, universalify@^0.1.2:
+universalify@^0.1.0:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.1.2.tgz#b646f69be3942dabcecc9d6639c80dc105efaa66"
   integrity sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==