Twemojify text

Signed-off-by: Ajay Bura <ajbura@gmail.com>

diff --git a/src/app/atoms/context-menu/ContextMenu.jsx b/src/app/atoms/context-menu/ContextMenu.jsx
index 69734518efc77afd5ac570e40393cd847f80672b..3c914c342dbf872d13d60fe6e24f31969d81a3cc 100644 (file)
--- a/src/app/atoms/context-menu/ContextMenu.jsx
+++ b/src/app/atoms/context-menu/ContextMenu.jsx
@@ -67,7 +67,7 @@ function MenuHeader({ children }) {
 }
 
 MenuHeader.propTypes = {
-  children: PropTypes.string.isRequired,
+  children: PropTypes.node.isRequired,
 };
 
 function MenuItem({

diff --git a/src/app/molecules/sidebar-avatar/SidebarAvatar.jsx b/src/app/molecules/sidebar-avatar/SidebarAvatar.jsx
index 882c00c948376414d3a5635e1d41e4c6603cb55d..e67b69fd9308c8c9aa79d6b965d7fb44eb3ea51b 100644 (file)
--- a/src/app/molecules/sidebar-avatar/SidebarAvatar.jsx
+++ b/src/app/molecules/sidebar-avatar/SidebarAvatar.jsx
@@ -2,6 +2,8 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import './SidebarAvatar.scss';
 
+import { twemojify } from '../../../util/twemojify';
+
 import Avatar from '../../atoms/avatar/Avatar';
 import Text from '../../atoms/text/Text';
 import Tooltip from '../../atoms/tooltip/Tooltip';
@@ -16,7 +18,7 @@ const SidebarAvatar = React.forwardRef(({
   if (active) activeClass = ' sidebar-avatar--active';
   return (
     <Tooltip
-      content={<Text variant="b1">{tooltip}</Text>}
+      content={<Text variant="b1">{twemojify(tooltip)}</Text>}
       placement="right"
     >
       <button

diff --git a/src/app/organisms/room-optons/RoomOptions.jsx b/src/app/organisms/room-optons/RoomOptions.jsx
index dbacc548ed55e96da4b9fdaa1aa801a427f1bf95..c95821d536c3a83c9f44c407adbd12d2b084f2f9 100644 (file)
--- a/src/app/organisms/room-optons/RoomOptions.jsx
+++ b/src/app/organisms/room-optons/RoomOptions.jsx
@@ -1,6 +1,8 @@
 import React, { useState, useEffect, useRef } from 'react';
 import './RoomOptions.scss';
 
+import { twemojify } from '../../../util/twemojify';
+
 import initMatrix from '../../../client/initMatrix';
 import cons from '../../../client/state/cons';
 import navigation from '../../../client/state/navigation';
@@ -166,7 +168,7 @@ function RoomOptions() {
       maxWidth={298}
       content={(toggleMenu) => (
         <>
-          <MenuHeader>{`Options for ${initMatrix.matrixClient.getRoom(roomId)?.name}`}</MenuHeader>
+          <MenuHeader>{twemojify(`Options for ${initMatrix.matrixClient.getRoom(roomId)?.name}`)}</MenuHeader>
           <MenuItem
             iconSrc={AddUserIC}
             onClick={() => {