Update Dockerfile

* Use node hydrogen lts in dockerfile

* Use node v18.12.0

* Use node v18.12.0

* Use node v18.12.0

* use lts syntax

* Update Nodejs LTS to v18.12.1

* Update Dockerfile

* Update Dockerfile

* Update readme

.github/renovate.json

@@ -1,7 +1,8 @@
 {
   "$schema": "https://docs.renovatebot.com/renovate-schema.json",
   "extends": [
-    "config:base"
+    "config:base",
+    ":dependencyDashboardApproval"
   ],
   "labels": [ "Dependencies" ],
   "packageRules": [
@@ -10,6 +11,5 @@
     }
   ],
   "lockFileMaintenance": { "enabled": true },
-  "dependencyDashboard": true,
-  "dependencyDashboardApproval": true
+  "dependencyDashboard": true
 }

.github/workflows/build-pull-request.yml

@@ -12,18 +12,18 @@ jobs:
       PR_NUMBER: ${{github.event.number}}
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v3.0.2
+        uses: actions/checkout@v3.1.0
       - name: Setup node
-        uses: actions/setup-node@v3.4.1
+        uses: actions/setup-node@v3.5.1
         with:
-          node-version: 17.9.0
+          node-version: 18.12.1
           cache: 'npm'
       - name: Install dependencies
         run: npm ci
       - name: Build app
         run: npm run build
       - name: Upload artifact
-        uses: actions/upload-artifact@v3.1.0
+        uses: actions/upload-artifact@v3.1.1
         with:
           name: preview
           path: dist
@@ -31,8 +31,8 @@ jobs:
       - name: Save pr number
         run: echo ${PR_NUMBER} > ./pr.txt
       - name: Upload pr number
-        uses: actions/upload-artifact@v3.1.0
+        uses: actions/upload-artifact@v3.1.1
         with:
           name: pr
           path: ./pr.txt
-          retention-days: 1
+          retention-days: 1

.github/workflows/deploy-pull-request.yml

@@ -13,16 +13,16 @@ jobs:
     if: ${{ github.event.workflow_run.conclusion == 'success' }}
     steps:
       - name: Download pr number
-        uses: dawidd6/action-download-artifact@7847792dd435a50521b8e3bd3576dae7459d1fa8
+        uses: dawidd6/action-download-artifact@46b4ae883bf0726f5949d025d31cb62c7a5ac70c
         with:
           workflow: ${{ github.event.workflow.id }}
           run_id: ${{ github.event.workflow_run.id }}
           name: pr
       - name: Output pr number
         id: pr
-        run: echo "::set-output name=id::$(<pr.txt)"
+        run: echo "id=$(<pr.txt)" >> $GITHUB_OUTPUT
       - name: Download artifact
-        uses: dawidd6/action-download-artifact@7847792dd435a50521b8e3bd3576dae7459d1fa8
+        uses: dawidd6/action-download-artifact@46b4ae883bf0726f5949d025d31cb62c7a5ac70c
         with:
           workflow: ${{ github.event.workflow.id }}
           run_id: ${{ github.event.workflow_run.id }}
@@ -30,7 +30,7 @@ jobs:
           path: dist
       - name: Deploy to Netlify
         id: netlify
-        uses: nwtgck/actions-netlify@b7c1504e00c6b8a249d1848cc1b522a4865eed99
+        uses: nwtgck/actions-netlify@ac1cb16858bada08a9c71a81240a85cfc3f72913
         with:
           publish-dir: dist
           deploy-message: "Deploy PR ${{ steps.pr.outputs.id }}"

.github/workflows/docker-pr.yml

@@ -11,9 +11,9 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v3.0.2
+        uses: actions/checkout@v3.1.0
       - name: Build Docker image
-        uses: docker/build-push-action@v3.1.1
+        uses: docker/build-push-action@v3.2.0
         with:
           context: .
           push: false

.github/workflows/lockfile.yml

@@ -14,7 +14,7 @@ jobs:
       pull-requests: write
     steps:
       - name: Checkout
-        uses: actions/checkout@v3.0.2
+        uses: actions/checkout@v3.1.0
       - name: NPM Lockfile Changes
         uses: codepunkt/npm-lockfile-changes@b40543471c36394409466fdb277a73a0856d7891
         with:

.github/workflows/netlify-dev.yml

@@ -11,18 +11,18 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v3.0.2
+        uses: actions/checkout@v3.1.0
       - name: Setup node
-        uses: actions/setup-node@v3.4.1
+        uses: actions/setup-node@v3.5.1
         with:
-          node-version: 17.9.0
+          node-version: 18.12.1
           cache: 'npm'
       - name: Install dependencies
         run: npm ci
       - name: Build app
         run: npm run build
       - name: Deploy to Netlify
-        uses: nwtgck/actions-netlify@b7c1504e00c6b8a249d1848cc1b522a4865eed99
+        uses: nwtgck/actions-netlify@ac1cb16858bada08a9c71a81240a85cfc3f72913
         with:
           publish-dir: dist
           deploy-message: "Dev deploy ${{ github.sha }}"

.github/workflows/prod-deploy.yml

@@ -10,18 +10,18 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v3.0.2
+        uses: actions/checkout@v3.1.0
       - name: Setup node
-        uses: actions/setup-node@v3.4.1
+        uses: actions/setup-node@v3.5.1
         with:
-          node-version: 17.9.0
+          node-version: 18.12.1
           cache: 'npm'
       - name: Install dependencies
         run: npm ci
       - name: Build app
         run: npm run build
       - name: Deploy to Netlify
-        uses: nwtgck/actions-netlify@b7c1504e00c6b8a249d1848cc1b522a4865eed99
+        uses: nwtgck/actions-netlify@ac1cb16858bada08a9c71a81240a85cfc3f72913
         with:
           publish-dir: dist
           deploy-message: "Prod deploy ${{ github.ref_name }}"
@@ -64,31 +64,31 @@ jobs:
       packages: write
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v3.0.2
+        uses: actions/checkout@v3.1.0
       - name: Set up QEMU
-        uses: docker/setup-qemu-action@v2.0.0
+        uses: docker/setup-qemu-action@v2.1.0
       - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v2.0.0
+        uses: docker/setup-buildx-action@v2.2.1
       - name: Login to Docker Hub
-        uses: docker/login-action@v2.0.0
+        uses: docker/login-action@v2.1.0
         with:
           username: ${{ secrets.DOCKER_USERNAME }}
           password: ${{ secrets.DOCKER_PASSWORD }}
       - name: Login to the Container registry
-        uses: docker/login-action@v2.0.0
+        uses: docker/login-action@v2.1.0
         with:
           registry: ghcr.io
           username: ${{ github.actor }}
           password: ${{ secrets.GITHUB_TOKEN }}
       - name: Extract metadata (tags, labels) for Docker
         id: meta
-        uses: docker/metadata-action@v4.0.1
+        uses: docker/metadata-action@v4.1.1
         with:
           images: |
             ${{ secrets.DOCKER_USERNAME }}/cinny
             ghcr.io/${{ github.repository }}
       - name: Build and push Docker image
-        uses: docker/build-push-action@v3.1.1
+        uses: docker/build-push-action@v3.2.0
         with:
           context: .
           platforms: linux/amd64,linux/arm64

CONTRIBUTING.md

@@ -41,4 +41,4 @@ Also, we use [ESLint](https://eslint.org/) for clean and stylistically consisten
 ## Helpful links
 - [BEM methodology](http://getbem.com/introduction/)
 - [Atomic design](https://bradfrost.com/blog/post/atomic-web-design/)
-- [Matrix JavaScript SDK documentation](https://matrix-org.github.io/matrix-js-sdk/19.2.0/index.html)
+- [Matrix JavaScript SDK documentation](https://matrix-org.github.io/matrix-js-sdk/index.html)

Dockerfile

@@ -1,5 +1,5 @@
 ## Builder
-FROM node:17.9.0-alpine3.15 as builder
+FROM node:18.12.1-alpine3.15 as builder
 
 WORKDIR /src
 
@@ -10,7 +10,7 @@ RUN npm run build
 
 
 ## App
-FROM nginx:1.23.1-alpine
+FROM nginx:1.23.2-alpine
 
 COPY --from=builder /src/dist /app
 

README.md

@@ -84,7 +84,7 @@ UeGsouhyuITLwEhScounZDqop+Dx
 
 ## Local development
 > We recommend using a version manager as versions change very quickly. You will likely need to switch 
-between multiple Node.js versions based on the needs of different projects you're working on. [NVM on windows](https://github.com/coreybutler/nvm-windows#installation--upgrades) on Windows and [nvm](https://github.com/nvm-sh/nvm) on Linux/macOS are pretty good choices. Also recommended nodejs version is 16.15.0 LTS.
+between multiple Node.js versions based on the needs of different projects you're working on. [NVM on windows](https://github.com/coreybutler/nvm-windows#installation--upgrades) on Windows and [nvm](https://github.com/nvm-sh/nvm) on Linux/macOS are pretty good choices. Also recommended nodejs version Hydrogen LTS (v18).
 
 Execute the following commands to start a development server:
 ```sh

config.json

@@ -1,9 +1,9 @@
 {
   "defaultHomeserver": 3,
   "homeserverList": [
+    "converser.eu",
     "envs.net",
     "halogen.city",
-    "kde.org",
     "matrix.org",
     "mozilla.org"
   ],

package.json

@@ -1,11 +1,10 @@
 {
   "name": "cinny",
-  "version": "2.1.3",
+  "version": "2.2.2",
   "description": "Yet another matrix client",
   "main": "index.js",
   "engines": {
-    "npm": ">=6.14.8",
-    "node": ">=14.15.0"
+    "node": ">=16.0.0"
   },
   "scripts": {
     "start": "webpack serve --config ./webpack.dev.js --open",
@@ -15,13 +14,13 @@
   "author": "Ajay Bura",
   "license": "MIT",
   "dependencies": {
-    "@fontsource/inter": "4.5.12",
+    "@fontsource/inter": "4.5.14",
     "@fontsource/roboto": "4.5.8",
-    "@khanacademy/simple-markdown": "0.8.3",
-    "@matrix-org/olm": "3.2.12",
+    "@khanacademy/simple-markdown": "0.8.5",
+    "@matrix-org/olm": "3.2.13",
     "@tippyjs/react": "4.2.6",
     "babel-polyfill": "6.26.0",
-    "blurhash": "2.0.0",
+    "blurhash": "2.0.4",
     "browser-encrypt-attachment": "0.3.0",
     "dateformat": "5.0.3",
     "emojibase-data": "7.0.1",
@@ -29,55 +28,55 @@
     "flux": "4.0.3",
     "formik": "2.2.9",
     "html-react-parser": "3.0.4",
-    "katex": "0.16.2",
-    "linkify-html": "4.0.0-beta.5",
-    "linkifyjs": "4.0.0-beta.5",
-    "matrix-js-sdk": "19.5.0",
+    "katex": "0.16.3",
+    "linkify-html": "4.0.2",
+    "linkifyjs": "4.0.2",
+    "matrix-js-sdk": "21.0.1",
     "prop-types": "15.8.1",
     "react": "17.0.2",
     "react-autosize-textarea": "7.1.0",
-    "react-blurhash": "0.1.3",
+    "react-blurhash": "0.2.0",
     "react-dnd": "15.1.2",
     "react-dnd-html5-backend": "15.1.3",
     "react-dom": "17.0.2",
     "react-google-recaptcha": "2.1.0",
-    "react-modal": "3.15.1",
-    "sanitize-html": "2.7.1",
+    "react-modal": "3.16.1",
+    "sanitize-html": "2.7.3",
     "tippy.js": "6.3.7",
     "twemoji": "14.0.2"
   },
   "devDependencies": {
-    "@babel/core": "7.19.0",
-    "@babel/preset-env": "7.19.0",
+    "@babel/core": "7.20.2",
+    "@babel/preset-env": "7.20.2",
     "@babel/preset-react": "7.18.6",
     "assert": "2.0.0",
-    "babel-loader": "8.2.5",
+    "babel-loader": "9.1.0",
     "browserify-fs": "1.0.0",
     "buffer": "6.0.3",
     "clean-webpack-plugin": "4.0.0",
     "copy-webpack-plugin": "11.0.0",
     "crypto-browserify": "3.12.0",
     "css-loader": "6.7.1",
-    "css-minimizer-webpack-plugin": "4.1.0",
-    "eslint": "8.23.1",
+    "css-minimizer-webpack-plugin": "4.2.2",
+    "eslint": "8.27.0",
     "eslint-config-airbnb": "19.0.4",
     "eslint-plugin-import": "2.26.0",
     "eslint-plugin-jsx-a11y": "6.6.1",
-    "eslint-plugin-react": "7.31.8",
+    "eslint-plugin-react": "7.31.10",
     "eslint-plugin-react-hooks": "4.6.0",
-    "html-loader": "4.1.0",
+    "html-loader": "4.2.0",
     "html-webpack-plugin": "5.5.0",
     "mini-css-extract-plugin": "2.6.1",
     "path-browserify": "1.0.1",
-    "sass": "1.54.9",
-    "sass-loader": "13.0.2",
+    "sass": "1.56.0",
+    "sass-loader": "13.1.0",
     "stream-browserify": "3.0.0",
     "style-loader": "3.3.1",
     "url": "0.11.0",
-    "util": "0.12.4",
+    "util": "0.12.5",
     "webpack": "5.74.0",
     "webpack-cli": "4.10.0",
-    "webpack-dev-server": "4.11.0",
+    "webpack-dev-server": "4.11.1",
     "webpack-merge": "5.8.0"
   }
 }

src/app/molecules/image-pack/ImagePackUpload.jsx

@@ -27,9 +27,7 @@ function ImagePackUpload({ onUpload }) {
 
     setProgress(true);
     const image = await scaleDownImage(imgFile, 512, 512);
-    const url = await mx.uploadContent(image, {
-      onlyContentUri: true,
-    });
+    const { content_uri: url } = await mx.uploadContent(image);
 
     onUpload(shortcode, url);
     setProgress(false);

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

@@ -22,7 +22,7 @@ function ImageUpload({
     const file = e.target.files.item(0);
     if (file === null) return;
     try {
-      const uPromise = initMatrix.matrixClient.uploadContent(file, { onlyContentUri: false });
+      const uPromise = initMatrix.matrixClient.uploadContent(file);
       setUploadPromise(uPromise);
 
       const res = await uPromise;

src/app/molecules/message/Message.jsx

@@ -300,12 +300,12 @@ function MessageEdit({ body, onSave, onCancel }) {
 
     if (e.key === 'Enter' && e.shiftKey === false) {
       e.preventDefault();
-      onSave(editInputRef.current.value);
+      onSave(editInputRef.current.value, body);
     }
   };
 
   return (
-    <form className="message__edit" onSubmit={(e) => { e.preventDefault(); onSave(editInputRef.current.value); }}>
+    <form className="message__edit" onSubmit={(e) => { e.preventDefault(); onSave(editInputRef.current.value, body); }}>
       <Input
         forwardRef={editInputRef}
         onKeyDown={handleKeyDown}
@@ -806,8 +806,8 @@ function Message({
             body={(customHTML
               ? html(customHTML, { kind: 'edit', onlyPlain: true }).plain
               : plain(body, { kind: 'edit', onlyPlain: true }).plain)}
-            onSave={(newBody) => {
-              if (newBody !== body) {
+            onSave={(newBody, oldBody) => {
+              if (newBody !== oldBody) {
                 initMatrix.roomsInput.sendEditedMessage(roomId, mEvent, newBody);
               }
               cancelEdit();

src/app/organisms/navigation/Home.jsx

@@ -25,7 +25,7 @@ function Home({ spaceId }) {
   let directIds = [];
 
   if (spaceId) {
-    const spaceChildIds = roomList.getSpaceChildren(spaceId);
+    const spaceChildIds = roomList.getSpaceChildren(spaceId) ?? [];
     spaceIds = spaceChildIds.filter((roomId) => spaces.has(roomId));
     roomIds = spaceChildIds.filter((roomId) => rooms.has(roomId));
     directIds = spaceChildIds.filter((roomId) => directs.has(roomId));

src/app/organisms/settings/Settings.jsx

@@ -9,7 +9,6 @@ import {
   toggleSystemTheme, toggleMarkdown, toggleMembershipEvents, toggleNickAvatarEvents,
   toggleNotifications, toggleNotificationSounds,
 } from '../../../client/action/settings';
-import logout from '../../../client/action/logout';
 import { usePermission } from '../../hooks/usePermission';
 
 import Text from '../../atoms/text/Text';
@@ -239,7 +238,7 @@ function AboutSection() {
             <div className="settings-about__btns">
               <Button onClick={() => window.open('https://github.com/ajbura/cinny')}>Source code</Button>
               <Button onClick={() => window.open('https://cinny.in/#sponsor')}>Support</Button>
-              <Button onClick={() => settings.clearCacheAndReload()} variant="danger">Clear cache & reload</Button>
+              <Button onClick={() => initMatrix.clearCacheAndReload()} variant="danger">Clear cache & reload</Button>
             </div>
           </div>
         </div>
@@ -328,7 +327,7 @@ function Settings() {
   const handleTabChange = (tabItem) => setSelectedTab(tabItem);
   const handleLogout = async () => {
     if (await confirmDialog('Logout', 'Are you sure that you want to logout your session?', 'Logout', 'danger')) {
-      logout();
+      initMatrix.logout();
     }
   };
 

src/app/organisms/view-source/ViewSource.scss

@@ -5,6 +5,8 @@
 
   & pre {
     padding: var(--sp-extra-tight);
+    white-space: pre-wrap;
+    word-break: break-all;
   }
 
   &__card {

src/app/templates/client/Client.jsx

@@ -7,18 +7,21 @@ import { initRoomListListener } from '../../../client/event/roomList';
 import Text from '../../atoms/text/Text';
 import Spinner from '../../atoms/spinner/Spinner';
 import Navigation from '../../organisms/navigation/Navigation';
+import ContextMenu, { MenuItem } from '../../atoms/context-menu/ContextMenu';
+import IconButton from '../../atoms/button/IconButton';
 import ReusableContextMenu from '../../atoms/context-menu/ReusableContextMenu';
 import Room from '../../organisms/room/Room';
 import Windows from '../../organisms/pw/Windows';
 import Dialogs from '../../organisms/pw/Dialogs';
 import EmojiBoardOpener from '../../organisms/emoji-board/EmojiBoardOpener';
-import logout from '../../../client/action/logout';
 
 import initMatrix from '../../../client/initMatrix';
 import navigation from '../../../client/state/navigation';
 import cons from '../../../client/state/cons';
 import DragDrop from '../../organisms/drag-drop/DragDrop';
 
+import VerticalMenuIC from '../../../../public/res/ic/outlined/vertical-menu.svg';
+
 function Client() {
   const [isLoading, changeLoading] = useState(true);
   const [loadingMsg, setLoadingMsg] = useState('Heating up');
@@ -74,9 +77,20 @@ function Client() {
   if (isLoading) {
     return (
       <div className="loading-display">
-        <button className="loading__logout" onClick={logout} type="button">
-          <Text variant="b3">Logout</Text>
-        </button>
+        <div className="loading__menu">
+          <ContextMenu
+            placement="bottom"
+            content={(
+              <>
+                <MenuItem onClick={() => initMatrix.clearCacheAndReload()}>
+                  Clear cache & reload
+                </MenuItem>
+                <MenuItem onClick={() => initMatrix.logout()}>Logout</MenuItem>
+              </>
+            )}
+            render={(toggle) => <IconButton size="extra-small" onClick={toggle} src={VerticalMenuIC} />}
+          />
+        </div>
         <Spinner />
         <Text className="loading__message" variant="b2">{loadingMsg}</Text>
 

src/app/templates/client/Client.scss

@@ -45,12 +45,12 @@
   position: absolute;
   bottom: var(--sp-normal);
 }
-.loading__logout {
+.loading__menu {
   position: absolute;
-  bottom: var(--sp-extra-tight);
+  top: var(--sp-extra-tight);
   right: var(--sp-extra-tight);
   cursor: pointer;
-  .text {
-    color: var(--tc-link);
+  .context-menu__item .text {
+    margin: 0 !important;
   }
 }

src/client/action/logout.js

@@ -1,16 +0,0 @@
-import initMatrix from '../initMatrix';
-
-async function logout() {
-  const mx = initMatrix.matrixClient;
-  mx.stopClient();
-  try {
-    await mx.logout();
-  } catch {
-    // ignore if failed to logout
-  }
-  mx.clearStores();
-  window.localStorage.clear();
-  window.location.reload();
-}
-
-export default logout;

src/client/action/room.js

@@ -236,16 +236,12 @@ async function createRoom(opts) {
     });
   }
   if (parentId && joinRule === 'restricted') {
-    try {
-      const caps = await mx.getCapabilities();
-      options.room_version = caps
-        ?.['m.room_versions']
-        ?.['org.matrix.msc3244.room_capabilities']
-        ?.restricted
-        ?.preferred
-        || undefined;
-    } catch {
-      console.error('Can\'t find room version for restricted.');
+    const caps = await mx.getCapabilities();
+    if (caps['m.room_versions'].available?.['9'] !== 'stable') {
+      throw new Error("ERROR: The server doesn't support restricted rooms");
+    }
+    if (Number(caps['m.room_versions'].default) < 9) {
+      options.room_version = '9';
     }
     options.initial_state.push({
       type: 'm.room.join_rules',

src/client/initMatrix.js

@@ -98,13 +98,32 @@ class InitMatrix extends EventEmitter {
   }
 
   listenEvents() {
-    this.matrixClient.on('Session.logged_out', () => {
+    this.matrixClient.on('Session.logged_out', async () => {
       this.matrixClient.stopClient();
-      this.matrixClient.clearStores();
+      await this.matrixClient.clearStores();
       window.localStorage.clear();
       window.location.reload();
     });
   }
+
+  async logout() {
+    this.matrixClient.stopClient();
+    try {
+      await this.matrixClient.logout();
+    } catch {
+      // ignore if failed to logout
+    }
+    await this.matrixClient.clearStores();
+    window.localStorage.clear();
+    window.location.reload();
+  }
+
+  clearCacheAndReload() {
+    this.matrixClient.stopClient();
+    this.matrixClient.store.deleteAllData().then(() => {
+      window.location.reload();
+    });
+  }
 }
 
 const initMatrix = new InitMatrix();

src/client/state/RoomsInput.js

@@ -395,7 +395,7 @@ class RoomsInput extends EventEmitter {
     input.attachment.uploadingPromise = uploadingPromise;
     this.roomIdToInput.set(roomId, input);
 
-    const url = await uploadingPromise;
+    const { content_uri: url } = await uploadingPromise;
 
     delete input.attachment.uploadingPromise;
     this.roomIdToInput.set(roomId, input);

src/client/state/cons.js

@@ -1,5 +1,5 @@
 const cons = {
-  version: '2.1.3',
+  version: '2.2.2',
   secretKey: {
     ACCESS_TOKEN: 'cinny_access_token',
     DEVICE_ID: 'cinny_device_id',

src/client/state/settings.js

@@ -147,14 +147,6 @@ class Settings extends EventEmitter {
     return settings.isNotificationSounds;
   }
 
-  clearCacheAndReload() {
-    const mx = initMatrix.matrixClient;
-    mx.stopClient()
-    mx.store.deleteAllData().then(() => {
-        window.location.reload();
-    });
-}
-
   setter(action) {
     const actions = {
       [cons.actions.settings.TOGGLE_SYSTEM_THEME]: () => {

src/util/markdown.js

@@ -1,3 +1,4 @@
+/* eslint-disable no-param-reassign */
 /* eslint-disable no-use-before-define */
 import SimpleMarkdown from '@khanacademy/simple-markdown';
 import { idRegex, parseIdUri } from './common';
@@ -88,6 +89,10 @@ const plainRules = {
     plain: (node, output, state) => `${output(node.content, state)}\n\n`,
     html: (node, output, state) => htmlTag('p', output(node.content, state)),
   },
+  escape: {
+    ...defaultRules.escape,
+    plain: (node, output, state) => `\\${output(node.content, state)}`,
+  },
   br: {
     ...defaultRules.br,
     match: anyScopeRegex(/^ *\n/),
@@ -96,7 +101,9 @@ const plainRules = {
   text: {
     ...defaultRules.text,
     match: anyScopeRegex(/^[\s\S]+?(?=[^0-9A-Za-z\s\u00c0-\uffff]| *\n|\w+:\S|$)/),
-    plain: (node) => node.content.replace(/(\*|_|!\[|\[|\|\||\$\$?)/g, '\\$1'),
+    plain: (node, _, state) => (state.kind === 'edit'
+      ? node.content.replace(/(\*|_|!\[|\[|\|\||\$\$?)/g, '\\$1')
+      : node.content),
   },
 };
 
@@ -105,7 +112,7 @@ const markdownRules = {
   ...plainRules,
   heading: {
     ...defaultRules.heading,
-    match: blockRegex(/^ *(#{1,6})([^\n:]*?(?: [^\n]*?)?)#* *(?:\n *)+\n/),
+    match: blockRegex(/^ *(#{1,6})([^\n:]*?(?: [^\n]*?)?)#* *(?:\n *)*\n/),
     plain: (node, output, state) => {
       const out = output(node.content, state);
       if (state.kind === 'edit' || state.kind === 'notification' || node.level > 2) {
@@ -120,7 +127,7 @@ const markdownRules = {
   },
   codeBlock: {
     ...defaultRules.codeBlock,
-    plain: (node) => `\`\`\`${node.lang || ''}\n${node.content}\n\`\`\``,
+    plain: (node) => `\`\`\`${node.lang || ''}\n${node.content}\n\`\`\`\n`,
     html: (node) => htmlTag('pre', htmlTag('code', sanitizeText(node.content), {
       class: node.lang ? `language-${node.lang}` : undefined,
     })),
@@ -135,10 +142,22 @@ const markdownRules = {
   },
   list: {
     ...defaultRules.list,
-    plain: (node, output, state) => `${node.items.map((item, i) => {
-      const prefix = node.ordered ? `${node.start + i}. ` : '* ';
-      return prefix + output(item, state).replace(/\n/g, `\n${' '.repeat(prefix.length)}`);
-    }).join('\n')}\n`,
+    plain: (node, output, state) => {
+      const oldList = state._list;
+      state._list = true;
+
+      let items = node.items.map((item, i) => {
+        const prefix = node.ordered ? `${node.start + i}. ` : '* ';
+        return prefix + output(item, state).replace(/\n/g, `\n${' '.repeat(prefix.length)}`);
+      }).join('\n');
+
+      state._list = oldList;
+
+      if (!state._list) {
+        items += '\n\n';
+      }
+      return items;
+    },
   },
   def: undefined,
   table: {
@@ -217,10 +236,6 @@ const markdownRules = {
     match: inlineRegex(/^¯\\_\(ツ\)_\/¯/),
     parse: (capture) => ({ type: 'text', content: capture[0] }),
   },
-  escape: {
-    ...defaultRules.escape,
-    plain: (node, output, state) => `\\${output(node.content, state)}`,
-  },
   tableSeparator: {
     ...defaultRules.tableSeparator,
     plain: () => ' | ',
@@ -276,6 +291,7 @@ const markdownRules = {
   },
   inlineCode: {
     ...defaultRules.inlineCode,
+    match: inlineRegex(/^(`+)([^\n]*?[^`\n])\1(?!`)/),
     plain: (node) => `\`${node.content}\``,
   },
   spoiler: {
@@ -347,13 +363,13 @@ function mapElement(el) {
     case 'BLOCKQUOTE':
       return [{ type: 'blockQuote', content: mapChildren(el) }];
     case 'UL':
-      return [{ type: 'list', items: mapChildren(el) }];
+      return [{ type: 'list', items: Array.from(el.childNodes).map(mapNode) }];
     case 'OL':
       return [{
         type: 'list',
         ordered: true,
         start: Number(el.getAttribute('start')),
-        items: mapChildren(el),
+        items: Array.from(el.childNodes).map(mapNode),
       }];
     case 'TABLE': {
       const headerEl = Array.from(el.querySelector('thead > tr').childNodes);