diff --git a/web/package.json b/web/package.json
index ff4b6417c..f14b61466 100644
--- a/web/package.json
+++ b/web/package.json
@@ -1,107 +1,108 @@
 {
   "name": "web",
   "version": "0.0.1",
   "type": "module",
   "private": true,
   "license": "BSD-3-Clause",
   "scripts": {
     "clean": "rm -rf dist/ && rm -rf node_modules/",
     "dev": "yarn concurrently --names=\"NODESSR,BROWSER\" -c \"bgBlue.bold,bgMagenta.bold\" \"yarn webpack --config webpack.config.cjs --config-name=server --watch\" \"yarn webpack-dev-server --config webpack.config.cjs --config-name=browser\"",
     "prod": "yarn webpack --config webpack.config.cjs --env prod --progress",
     "test": "jest"
   },
   "devDependencies": {
     "@babel/core": "^7.13.14",
     "@babel/plugin-proposal-class-properties": "^7.13.0",
     "@babel/plugin-proposal-nullish-coalescing-operator": "^7.13.8",
     "@babel/plugin-proposal-object-rest-spread": "^7.13.8",
     "@babel/plugin-proposal-optional-chaining": "^7.13.12",
     "@babel/plugin-transform-react-constant-elements": "^7.13.13",
     "@babel/plugin-transform-runtime": "^7.13.10",
     "@babel/preset-env": "^7.13.12",
     "@babel/preset-flow": "^7.13.13",
     "@babel/preset-react": "^7.13.13",
     "assets-webpack-plugin": "^3.9.7",
     "babel-jest": "^26.6.3",
     "babel-loader": "^8.1.0",
     "babel-plugin-transform-remove-console": "^6.9.4",
     "clean-webpack-plugin": "^3.0.0",
     "concurrently": "^5.3.0",
     "copy-webpack-plugin": "^6.4.1",
     "css-loader": "^4.3.0",
     "flow-bin": "^0.182.0",
     "flow-typed": "^3.2.1",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^26.6.3",
     "mini-css-extract-plugin": "^0.11.2",
     "optimize-css-assets-webpack-plugin": "^5.0.3",
     "style-loader": "^1.2.1",
     "terser-webpack-plugin": "^2.1.2",
     "url-loader": "^2.2.0",
     "webpack": "^4.46.0",
     "webpack-cli": "^3.3.9",
     "webpack-dev-server": "^3.11.0"
   },
   "dependencies": {
     "@babel/runtime": "^7.13.10",
     "@emoji-mart/data": "^1.1.2",
     "@emoji-mart/react": "^1.1.1",
     "@fortawesome/fontawesome-svg-core": "1.2.25",
     "@fortawesome/free-regular-svg-icons": "5.11.2",
     "@fortawesome/free-solid-svg-icons": "5.11.2",
     "@fortawesome/react-fontawesome": "0.1.5",
     "@rainbow-me/rainbowkit": "^0.5.0",
     "basscss": "8.0.2",
     "classnames": "^2.2.5",
     "core-js": "^3.6.5",
     "dateformat": "^3.0.3",
     "detect-browser": "^4.0.4",
     "emoji-mart": "^5.5.2",
     "exif-js": "^2.3.0",
     "history": "^4.6.3",
     "ethers": "^5.7.2",
     "invariant": "^2.2.4",
     "is-svg": "^4.3.0",
     "isomorphic-fetch": "^3.0.0",
     "lib": "0.0.1",
     "lodash": "^4.17.21",
+    "@matrix-org/olm": "3.2.4",
     "react": "18.1.0",
     "react-circular-progressbar": "^2.0.2",
     "react-color": "^2.13.0",
     "react-dnd": "^11.1.3",
     "react-dnd-html5-backend": "^11.1.3",
     "react-dom": "18.1.0",
     "react-feather": "^2.0.3",
     "react-icomoon": "^2.4.1",
     "react-icons": "^4.4.0",
     "react-redux": "^7.1.1",
     "react-router": "^5.2.0",
     "react-router-dom": "^5.2.0",
     "react-switch": "^5.0.1",
     "react-timeago": "^5.2.0",
     "redux": "^4.0.4",
     "redux-devtools-extension": "^2.13.2",
     "redux-persist": "^6.0.0",
     "redux-thunk": "^2.2.0",
     "reselect": "^4.0.0",
     "simple-markdown": "^0.7.2",
     "siwe": "^1.1.6",
     "tinycolor2": "^1.4.1",
     "visibilityjs": "^2.0.2",
     "wagmi": "^0.6.0"
   },
   "jest": {
     "roots": [
       "<rootDir>/utils"
     ],
     "transform": {
       "\\.js$": "babel-jest"
     },
     "transformIgnorePatterns": [
       "/node_modules/(?!@babel/runtime)"
     ],
     "moduleNameMapper": {
       "\\.(css)$": "identity-obj-proxy"
     }
   }
 }
diff --git a/web/webpack.config.cjs b/web/webpack.config.cjs
index 21164aab7..147e35a70 100644
--- a/web/webpack.config.cjs
+++ b/web/webpack.config.cjs
@@ -1,82 +1,97 @@
 const AssetsPlugin = require('assets-webpack-plugin');
+const CopyPlugin = require('copy-webpack-plugin');
 const path = require('path');
 
 const {
   createProdBrowserConfig,
   createDevBrowserConfig,
   createNodeServerRenderingConfig,
 } = require('lib/webpack/shared.cjs');
 
 const babelConfig = require('./babel.config.cjs');
 
 const baseBrowserConfig = {
+  plugins: [
+    new CopyPlugin({
+      patterns: [
+        {
+          from: 'node_modules/@matrix-org/olm/olm.wasm',
+          to: path.join(__dirname, 'dist'),
+        },
+      ],
+    }),
+  ],
   entry: {
     browser: ['./script.js'],
   },
   output: {
     filename: 'prod.[hash:12].build.js',
     path: path.join(__dirname, 'dist'),
   },
   resolve: {
     alias: {
       '../images': path.resolve('../keyserver/images'),
     },
   },
+  node: {
+    fs: 'empty',
+  },
 };
 
 const baseDevBrowserConfig = {
   ...baseBrowserConfig,
   output: {
     ...baseBrowserConfig.output,
     filename: 'dev.build.js',
     pathinfo: true,
     publicPath: 'http://localhost:8080/',
   },
   devServer: {
     hot: true,
     port: 8080,
     contentBase: path.join(__dirname, 'dist'),
     headers: { 'Access-Control-Allow-Origin': '*' },
     allowedHosts: ['all'],
     host: '0.0.0.0',
   },
 };
 
 const baseProdBrowserConfig = {
   ...baseBrowserConfig,
   plugins: [
+    ...baseBrowserConfig.plugins,
     new AssetsPlugin({
       filename: 'assets.json',
       path: path.join(__dirname, 'dist'),
     }),
   ],
 };
 
 const baseNodeServerRenderingConfig = {
   externals: ['react', 'react-dom', 'react-redux'],
   entry: {
     keyserver: ['./loading.react.js'],
   },
   output: {
     filename: 'app.build.cjs',
     library: 'app',
     libraryTarget: 'commonjs2',
     path: path.join(__dirname, 'dist'),
   },
 };
 
 module.exports = function (env) {
   const browserConfig =
     env === 'prod'
       ? createProdBrowserConfig(baseProdBrowserConfig, babelConfig)
       : createDevBrowserConfig(baseDevBrowserConfig, babelConfig);
   const nodeConfig = createNodeServerRenderingConfig(
     baseNodeServerRenderingConfig,
     babelConfig,
   );
   const nodeServerRenderingConfig = {
     ...nodeConfig,
     mode: env === 'prod' ? 'production' : 'development',
   };
   return [browserConfig, nodeServerRenderingConfig];
 };