Custom emoji & Sticker support (#686)

* Remove comments

* Show custom emoji first in suggestions

* Show global image packs in emoji picker

* Display emoji and sticker in room settings

* Fix some pack not visible in emojiboard

* WIP

* Add/delete/rename images to exisitng packs

* Change pack avatar, name & attribution

* Add checkbox to make pack global

* Bug fix

* Create or delete pack

* Add personal emoji in settings

* Show global pack selector in settings

* Show space emoji in emojiboard

* Send custom emoji reaction as mxc

* Render stickers as stickers

* Fix sticker jump bug

* Fix reaction width

* Fix stretched custom emoji

* Fix sending space emoji in message

* Remove unnessesary comments

* Send user pills

* Fix pill generating regex

* Add support for sending stickers

src/app/molecules/image-upload/ImageUpload.jsx

@@ -7,9 +7,13 @@ import initMatrix from '../../../client/initMatrix';
 import Text from '../../atoms/text/Text';
 import Avatar from '../../atoms/avatar/Avatar';
 import Spinner from '../../atoms/spinner/Spinner';
+import RawIcon from '../../atoms/system-icons/RawIcon';
+
+import PlusIC from '../../../../public/res/ic/outlined/plus.svg';
 
 function ImageUpload({
   text, bgColor, imageSrc, onUpload, onRequestRemove,
+  size,
 }) {
   const [uploadPromise, setUploadPromise] = useState(null);
   const uploadImageRef = useRef(null);
@@ -50,10 +54,14 @@ function ImageUpload({
           imageSrc={imageSrc}
           text={text}
           bgColor={bgColor}
-          size="large"
+          size={size}
         />
         <div className={`img-upload__process ${uploadPromise === null ? ' img-upload__process--stopped' : ''}`}>
-          {uploadPromise === null && <Text variant="b3" weight="bold">Upload</Text>}
+          {uploadPromise === null && (
+            size === 'large'
+              ? <Text variant="b3" weight="bold">Upload</Text>
+              : <RawIcon src={PlusIC} color="white" />
+          )}
           {uploadPromise !== null && <Spinner size="small" />}
         </div>
       </button>
@@ -75,6 +83,7 @@ ImageUpload.defaultProps = {
   text: null,
   bgColor: 'transparent',
   imageSrc: null,
+  size: 'large',
 };
 
 ImageUpload.propTypes = {
@@ -83,6 +92,7 @@ ImageUpload.propTypes = {
   imageSrc: PropTypes.string,
   onUpload: PropTypes.func.isRequired,
   onRequestRemove: PropTypes.func.isRequired,
+  size: PropTypes.oneOf(['large', 'normal']),
 };
 
 export default ImageUpload;