diff --git a/package.json b/package.json
index 67ae834d..6ee629bb 100644
--- a/package.json
+++ b/package.json
@@ -73,7 +73,7 @@
         "@hcaptcha/react-hcaptcha": "^0.3.6",
         "@insertish/vite-plugin-babel-macros": "^1.0.5",
         "@preact/preset-vite": "^2.0.0",
-        "@revoltchat/ui": "1.0.50",
+        "@revoltchat/ui": "1.0.54",
         "@rollup/plugin-replace": "^2.4.2",
         "@styled-icons/boxicons-logos": "^10.38.0",
         "@styled-icons/boxicons-regular": "^10.38.0",
@@ -83,6 +83,7 @@
         "@traptitech/markdown-it-katex": "^3.4.3",
         "@traptitech/markdown-it-spoiler": "^1.1.6",
         "@trivago/prettier-plugin-sort-imports": "^2.0.2",
+        "@types/lodash": "^4",
         "@types/lodash.defaultsdeep": "^4.6.6",
         "@types/lodash.isequal": "^4.5.5",
         "@types/markdown-it": "^12.0.2",
@@ -111,6 +112,7 @@
         "history": "4",
         "json-stringify-deterministic": "^1.0.2",
         "localforage": "^1.9.0",
+        "lodash": "^4.17.21",
         "lodash.defaultsdeep": "^4.6.1",
         "lodash.isequal": "^4.5.0",
         "long": "^5.2.0",
@@ -138,6 +140,9 @@
         "sass": "^1.35.1",
         "semver": "^7.3.7",
         "shade-blend-color": "^1.0.0",
+        "slate": "^0.81.1",
+        "slate-history": "^0.66.0",
+        "slate-react": "^0.81.0",
         "stacktrace-js": "^2.0.2",
         "styled-components": "^5.3.0",
         "typescript": "^4.4.2",
diff --git a/src/components/common/messaging/MessageBox.tsx b/src/components/common/messaging/MessageBox.tsx
index 81ed3e75..d97be03a 100644
--- a/src/components/common/messaging/MessageBox.tsx
+++ b/src/components/common/messaging/MessageBox.tsx
@@ -475,10 +475,17 @@ export default observer(({ channel }: Props) => {
         () =>
             memo(({ emoji }: { emoji: string }) => (
                 <a
-                    onClick={() =>
-                        setMessage(`${state.draft.get(channel._id)}\n${emoji}`)
-                    }>
-                    <Emoji emoji={emoji} />
+                    onClick={() => {
+                        const v = state.draft.get(channel._id);
+                        setMessage(`${v ? `${v} ` : ""}:${emoji}:`);
+                    }}>
+                    <Emoji
+                        emoji={
+                            emojiDictionary[
+                                emoji as keyof typeof emojiDictionary
+                            ]
+                        }
+                    />
                 </a>
             )),
         [],
@@ -528,7 +535,7 @@ export default observer(({ channel }: Props) => {
             <FloatingLayer>
                 {picker && (
                     <Picker
-                        emojis={emojiDictionary}
+                        emojis={Object.keys(emojiDictionary)}
                         renderEmoji={renderEmoji}
                     />
                 )}
diff --git a/src/components/markdown/prism.ts b/src/components/markdown/prism.ts
index 1ae510c6..b76a9c54 100644
--- a/src/components/markdown/prism.ts
+++ b/src/components/markdown/prism.ts
@@ -34,7 +34,6 @@ import "prismjs/components/prism-r";
 import "prismjs/components/prism-sql";
 import "prismjs/components/prism-graphql";
 import "prismjs/components/prism-shell-session";
-import "prismjs/components/prism-java";
 import "prismjs/components/prism-powershell";
 import "prismjs/components/prism-swift";
 import "prismjs/components/prism-yaml";
@@ -87,7 +86,6 @@ import "prismjs/components/prism-moonscript";
 import "prismjs/components/prism-qml";
 import "prismjs/components/prism-vim";
 import "prismjs/components/prism-nim";
-import "prismjs/components/prism-swift";
 import "prismjs/components/prism-haml";
 import "prismjs/components/prism-ada";
 import "prismjs/components/prism-arduino";
diff --git a/yarn.lock b/yarn.lock
index b3b969d8..4f43ba05 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2231,22 +2231,23 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@revoltchat/ui@npm:1.0.50":
-  version: 1.0.50
-  resolution: "@revoltchat/ui@npm:1.0.50"
+"@revoltchat/ui@npm:1.0.54":
+  version: 1.0.54
+  resolution: "@revoltchat/ui@npm:1.0.54"
   dependencies:
     "@styled-icons/boxicons-logos": ^10.38.0
     "@styled-icons/boxicons-regular": ^10.38.0
     "@styled-icons/boxicons-solid": ^10.38.0
+    "@tippyjs/react": ^4.2.6
+    mobx: ^6.6.0
+    mobx-react-lite: ^3.4.0
+    prismjs: ^1.28.0
+    react-beautiful-dnd: ^13.1.0
+    react-device-detect: ^2.2.2
+    react-virtuoso: ^2.12.0
   peerDependencies:
-    "@tippyjs/react": "*"
-    mobx: "*"
-    mobx-react-lite: "*"
-    react-beautiful-dnd: "*"
-    react-device-detect: "*"
-    react-virtuoso: "*"
     revolt.js: "*"
-  checksum: 735df2bbdb2b1c56c7c62ba6889d7c75d17f8fbc1cb9ec41b06050470314b04ae6477dabf6dece1bf9b680d451d9cf4d6ecff629025419507fb0410661edb9ff
+  checksum: 57014aa30f36272825b34e2dfa327b17f3e2b4efeba78f48e1805b5b30027f7dad4431f1c852816762e10643a9ef53b51a211d48ffc3bd14d07966fd5b3b183f
   languageName: node
   linkType: hard
 
@@ -2395,7 +2396,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@tippyjs/react@npm:4.2.6":
+"@tippyjs/react@npm:4.2.6, @tippyjs/react@npm:^4.2.6":
   version: 4.2.6
   resolution: "@tippyjs/react@npm:4.2.6"
   dependencies:
@@ -2529,6 +2530,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/is-hotkey@npm:^0.1.1":
+  version: 0.1.7
+  resolution: "@types/is-hotkey@npm:0.1.7"
+  checksum: bce7c8874b30f346f20cf6cfcf4a10372962924f0e1b1a925a279004faeb276242ebfbfee47bd48df57e1021f2e3078c34e25837e226960c418d5f78f83dacea
+  languageName: node
+  linkType: hard
+
 "@types/json-schema@npm:^7.0.3, @types/json-schema@npm:^7.0.7":
   version: 7.0.9
   resolution: "@types/json-schema@npm:7.0.9"
@@ -2575,6 +2583,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/lodash@npm:^4, @types/lodash@npm:^4.14.149":
+  version: 4.14.182
+  resolution: "@types/lodash@npm:4.14.182"
+  checksum: 7dd137aa9dbabd632408bd37009d984655164fa1ecc3f2b6eb94afe35bf0a5852cbab6183148d883e9c73a958b7fec9a9bcf7c8e45d41195add6a18c34958209
+  languageName: node
+  linkType: hard
+
 "@types/markdown-it@npm:^12.0.2":
   version: 12.2.1
   resolution: "@types/markdown-it@npm:12.2.1"
@@ -3539,7 +3554,7 @@ __metadata:
     "@hcaptcha/react-hcaptcha": ^0.3.6
     "@insertish/vite-plugin-babel-macros": ^1.0.5
     "@preact/preset-vite": ^2.0.0
-    "@revoltchat/ui": 1.0.50
+    "@revoltchat/ui": 1.0.54
     "@rollup/plugin-replace": ^2.4.2
     "@styled-icons/boxicons-logos": ^10.38.0
     "@styled-icons/boxicons-regular": ^10.38.0
@@ -3549,6 +3564,7 @@ __metadata:
     "@traptitech/markdown-it-katex": ^3.4.3
     "@traptitech/markdown-it-spoiler": ^1.1.6
     "@trivago/prettier-plugin-sort-imports": ^2.0.2
+    "@types/lodash": ^4
     "@types/lodash.defaultsdeep": ^4.6.6
     "@types/lodash.isequal": ^4.5.5
     "@types/markdown-it": ^12.0.2
@@ -3579,6 +3595,7 @@ __metadata:
     json-stringify-deterministic: ^1.0.2
     klaw: ^3.0.0
     localforage: ^1.9.0
+    lodash: ^4.17.21
     lodash.defaultsdeep: ^4.6.1
     lodash.isequal: ^4.5.0
     long: ^5.2.0
@@ -3607,6 +3624,9 @@ __metadata:
     semver: ^7.3.7
     shade-blend-color: ^1.0.0
     sirv-cli: ^1.0.14
+    slate: ^0.81.1
+    slate-history: ^0.66.0
+    slate-react: ^0.81.0
     stacktrace-js: ^2.0.2
     styled-components: ^5.3.0
     typescript: ^4.4.2
@@ -3720,6 +3740,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"compute-scroll-into-view@npm:^1.0.17":
+  version: 1.0.17
+  resolution: "compute-scroll-into-view@npm:1.0.17"
+  checksum: b20c05a10c37813c5a6e4bf053c00f65c88d23afed7a6bd7a2a69e05e2ffc2df3483ecfe407d36bf16b8cec8be21ae1966c9c523093a03117e567156cd79a51e
+  languageName: node
+  linkType: hard
+
 "concat-map@npm:0.0.1":
   version: 0.0.1
   resolution: "concat-map@npm:0.0.1"
@@ -3935,6 +3962,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"direction@npm:^1.0.3":
+  version: 1.0.4
+  resolution: "direction@npm:1.0.4"
+  bin:
+    direction: cli.js
+  checksum: 572ac399093d7c9f2181c96828d252922e2a962b8f31a7fc118e3f7619592c566cc2ed313baf7703f17b2be00cd3c1402550140d0c3f4f70362976376a08b095
+  languageName: node
+  linkType: hard
+
 "dlv@npm:^1.1.3":
   version: 1.1.3
   resolution: "dlv@npm:1.1.3"
@@ -5151,6 +5187,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"immer@npm:^9.0.6":
+  version: 9.0.15
+  resolution: "immer@npm:9.0.15"
+  checksum: 92e3d63e810e3c3c2bb61b70c45443e37ef983ad12924e3edaf03725ae5979618f5b473439bb3bb4a8c4769f25132f18dec10ea15c40f0b20da5691ff96ff611
+  languageName: node
+  linkType: hard
+
 "import-fresh@npm:^3.0.0, import-fresh@npm:^3.2.1":
   version: 3.3.0
   resolution: "import-fresh@npm:3.3.0"
@@ -5300,6 +5343,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"is-hotkey@npm:^0.1.6":
+  version: 0.1.8
+  resolution: "is-hotkey@npm:0.1.8"
+  checksum: 793d0cccaf804583d8f4b835e040d4b6a74cb3f8d4094cb8188ed7cc86e6edf8f650fc80fabd4309e6c29938f5b0e9a17b45504b29dbf92735ef8d780d613aa0
+  languageName: node
+  linkType: hard
+
 "is-lambda@npm:^1.0.1":
   version: 1.0.1
   resolution: "is-lambda@npm:1.0.1"
@@ -5344,6 +5394,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"is-plain-object@npm:^5.0.0":
+  version: 5.0.0
+  resolution: "is-plain-object@npm:5.0.0"
+  checksum: e32d27061eef62c0847d303125440a38660517e586f2f3db7c9d179ae5b6674ab0f469d519b2e25c147a1a3bc87156d0d5f4d8821e0ce4a9ee7fe1fcf11ce45c
+  languageName: node
+  linkType: hard
+
 "is-regex@npm:^1.1.3, is-regex@npm:^1.1.4":
   version: 1.1.4
   resolution: "is-regex@npm:1.1.4"
@@ -5766,7 +5823,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"lodash@npm:4.17.21, lodash@npm:^4.17.11, lodash@npm:^4.17.15, lodash@npm:^4.17.19, lodash@npm:^4.17.20":
+"lodash@npm:4.17.21, lodash@npm:^4.17.11, lodash@npm:^4.17.15, lodash@npm:^4.17.19, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.4":
   version: 4.17.21
   resolution: "lodash@npm:4.17.21"
   checksum: eb835a2e51d381e561e508ce932ea50a8e5a68f4ebdd771ea240d3048244a8d13658acbd502cd4829768c56f2e16bdd4340b9ea141297d472517b83868e677f7
@@ -6053,7 +6110,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"mobx-react-lite@npm:3.4.0":
+"mobx-react-lite@npm:3.4.0, mobx-react-lite@npm:^3.4.0":
   version: 3.4.0
   resolution: "mobx-react-lite@npm:3.4.0"
   peerDependencies:
@@ -6496,6 +6553,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"prismjs@npm:^1.28.0":
+  version: 1.28.0
+  resolution: "prismjs@npm:1.28.0"
+  checksum: bde93fb2beb45b7243219fc53855f59ee54b3fa179f315e8f9d66244d756ef984462e10561bbdc6713d3d7e051852472d7c284f5794a8791eeaefea2fb910b16
+  languageName: node
+  linkType: hard
+
 "progress@npm:^2.0.0":
   version: 2.0.3
   resolution: "progress@npm:2.0.3"
@@ -6588,7 +6652,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-device-detect@npm:2.2.2":
+"react-device-detect@npm:2.2.2, react-device-detect@npm:^2.2.2":
   version: 2.2.2
   resolution: "react-device-detect@npm:2.2.2"
   dependencies:
@@ -7079,6 +7143,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"scroll-into-view-if-needed@npm:^2.2.20":
+  version: 2.2.29
+  resolution: "scroll-into-view-if-needed@npm:2.2.29"
+  dependencies:
+    compute-scroll-into-view: ^1.0.17
+  checksum: 6b888404ccf68fe2f2f1da8977e1a8a0a64a7139352e02e98621a0e8be3b3db393519ee3dcfb7c32aff3c4790a36829f1be1cccc0cfb2b90a60a61caa669eee2
+  languageName: node
+  linkType: hard
+
 "sdp-transform@npm:^2.14.1":
   version: 2.14.1
   resolution: "sdp-transform@npm:2.14.1"
@@ -7235,6 +7308,48 @@ __metadata:
   languageName: node
   linkType: hard
 
+"slate-history@npm:^0.66.0":
+  version: 0.66.0
+  resolution: "slate-history@npm:0.66.0"
+  dependencies:
+    is-plain-object: ^5.0.0
+  peerDependencies:
+    slate: ">=0.65.3"
+  checksum: e83d4fbf5d4097a5b434df4846420e593598a9a3f90d3e0638f16915b1014bc8a7dc5cd87e3bc0a31a8ad5eae582a18f96bdc04f4b0b0a5a82cf05bd0377601e
+  languageName: node
+  linkType: hard
+
+"slate-react@npm:^0.81.0":
+  version: 0.81.0
+  resolution: "slate-react@npm:0.81.0"
+  dependencies:
+    "@types/is-hotkey": ^0.1.1
+    "@types/lodash": ^4.14.149
+    direction: ^1.0.3
+    is-hotkey: ^0.1.6
+    is-plain-object: ^5.0.0
+    lodash: ^4.17.4
+    scroll-into-view-if-needed: ^2.2.20
+    tiny-invariant: 1.0.6
+  peerDependencies:
+    react: ">=16.8.0"
+    react-dom: ">=16.8.0"
+    slate: ">=0.65.3"
+  checksum: 157272106da0e2af7c370e61f85156b3d3b81baf4bf65f16799ed682ee6c01c49950380b76ac274b2c0c31854e23456043ff18cb42eb3db2f781a3b1ae7be4eb
+  languageName: node
+  linkType: hard
+
+"slate@npm:^0.81.1":
+  version: 0.81.1
+  resolution: "slate@npm:0.81.1"
+  dependencies:
+    immer: ^9.0.6
+    is-plain-object: ^5.0.0
+    tiny-warning: ^1.0.3
+  checksum: 550541fa6e95a81a3dfa81d863a67141659f8ac150808b6fd2c71ee5f758390a1d32e227ee6eb67f945cd79b9e6fffbcdc8db6e42b5737ea6427ee379e0afb62
+  languageName: node
+  linkType: hard
+
 "slice-ansi@npm:^4.0.0":
   version: 4.0.0
   resolution: "slice-ansi@npm:4.0.0"
@@ -7678,6 +7793,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"tiny-invariant@npm:1.0.6":
+  version: 1.0.6
+  resolution: "tiny-invariant@npm:1.0.6"
+  checksum: c90b34beea3cb10c49531e754afb0999033a2d7edffef6602922de27678d8a96dcbc0e8f0a959bc272859281b0cd1305b711e25d5edfb1da5fc7135e2a992961
+  languageName: node
+  linkType: hard
+
 "tiny-invariant@npm:^1.0.2":
   version: 1.1.0
   resolution: "tiny-invariant@npm:1.1.0"