diff --git a/.gitmodules b/.gitmodules
new file mode 100644
index 00000000..b6c6947f
--- /dev/null
+++ b/.gitmodules
@@ -0,0 +1,3 @@
+[submodule "public/res/twemoji"]
+ path = public/res/twemoji
+ url = https://github.com/twitter/twemoji.git
diff --git a/public/res/twemoji b/public/res/twemoji
new file mode 160000
index 00000000..d94f4cf7
--- /dev/null
+++ b/public/res/twemoji
@@ -0,0 +1 @@
+Subproject commit d94f4cf793e6d5ca592aa00f58a88f6a4229ad43
diff --git a/src/app/organisms/emoji-board/EmojiBoard.jsx b/src/app/organisms/emoji-board/EmojiBoard.jsx
index d9762323..5310ef10 100644
--- a/src/app/organisms/emoji-board/EmojiBoard.jsx
+++ b/src/app/organisms/emoji-board/EmojiBoard.jsx
@@ -30,6 +30,7 @@ import PhotoIC from '../../../../public/res/ic/outlined/photo.svg';
import BulbIC from '../../../../public/res/ic/outlined/bulb.svg';
import PeaceIC from '../../../../public/res/ic/outlined/peace.svg';
import FlagIC from '../../../../public/res/ic/outlined/flag.svg';
+import { GetTwemojiCDN } from '../../../util/twemojify';
const ROW_EMOJIS_COUNT = 7;
@@ -37,7 +38,7 @@ const EmojiGroup = React.memo(({ name, groupEmojis }) => {
function getEmojiBoard() {
const emojiBoard = [];
const totalEmojis = groupEmojis.length;
-
+ var cdn = GetTwemojiCDN()
for (let r = 0; r < totalEmojis; r += ROW_EMOJIS_COUNT) {
const emojiRow = [];
for (let c = r; c < r + ROW_EMOJIS_COUNT; c += 1) {
@@ -58,6 +59,7 @@ const EmojiGroup = React.memo(({ name, groupEmojis }) => {
hexcode: emoji.hexcode,
loading: 'lazy',
}),
+ base: cdn,
},
))
// This is a custom emoji, and should be render as an mxc
@@ -250,6 +252,8 @@ function EmojiBoard({ onSelect, searchRef }) {
$emojiContent.children[tabIndex].scrollIntoView();
}
+ var cdn = GetTwemojiCDN()
+
return (
@@ -333,7 +337,7 @@ function EmojiBoard({ onSelect, searchRef }) {
-
{ parse(twemoji.parse('🙂')) }
+
{ parse(twemoji.parse('🙂', {base: cdn})) }
:slight_smile:
diff --git a/src/app/organisms/room/RoomViewCmdBar.jsx b/src/app/organisms/room/RoomViewCmdBar.jsx
index 8c390a06..e6696537 100644
--- a/src/app/organisms/room/RoomViewCmdBar.jsx
+++ b/src/app/organisms/room/RoomViewCmdBar.jsx
@@ -5,7 +5,7 @@ import './RoomViewCmdBar.scss';
import parse from 'html-react-parser';
import twemoji from 'twemoji';
-import { twemojify } from '../../../util/twemojify';
+import { GetTwemojiCDN, twemojify } from '../../../util/twemojify';
import initMatrix from '../../../client/initMatrix';
import { getEmojiForCompletion } from '../emoji-board/custom-emoji';
@@ -60,6 +60,7 @@ function renderSuggestions({ prefix, option, suggestions }, fireCmd) {
unicode: emoji.unicode,
shortcodes: emoji.shortcodes?.toString(),
}),
+ base: GetTwemojiCDN()
},
));
}
diff --git a/src/util/twemojify.jsx b/src/util/twemojify.jsx
index 0a4fede7..505fdf2b 100644
--- a/src/util/twemojify.jsx
+++ b/src/util/twemojify.jsx
@@ -8,6 +8,20 @@ import { sanitizeText } from './sanitize';
const Math = lazy(() => import('../app/atoms/math/Math'));
+const CDN_LOCAL = "/public/res/twemoji/assets/"
+const CDN_EXTERNAL = "https://cdn.jsdelivr.net/gh/twitter/twemoji@14.0.2/assets/";
+
+export const GetTwemojiCDN = () => {
+ if(window.__TAURI__){
+ return CDN_LOCAL
+ }
+ else{
+ return CDN_EXTERNAL
+ }
+};
+
+
+
const mathOptions = {
replace: (node) => {
const maths = node.attribs?.['data-mx-maths'];
@@ -42,7 +56,15 @@ export function twemojify(text, opts, linkify = false, sanitize = true, maths =
if (sanitize) {
content = sanitizeText(content);
}
+
+ if(opts){
+ opts.base = GetTwemojiCDN()
+ } else {
+ opts = { base: GetTwemojiCDN() }
+ }
+
content = twemoji.parse(content, opts);
+
if (linkify) {
content = linkifyHtml(content, {
target: '_blank',