Merge 'upstream/dev'

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

@@ -12,7 +12,7 @@ jobs:
       PR_NUMBER: ${{github.event.number}}
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v4.1.4
+        uses: actions/checkout@v4.1.5
       - name: Setup node
         uses: actions/setup-node@v4.0.2
         with:

.github/workflows/cla.yml

@@ -12,7 +12,7 @@ jobs:
       - name: 'CLA Assistant'
         if: (github.event.comment.body == 'recheck' || github.event.comment.body == 'I have read the CLA Document and I hereby sign the CLA') || github.event_name == 'pull_request_target'
         # Beta Release
-        uses: cla-assistant/github-action@v2.3.2
+        uses: cla-assistant/github-action@v2.4.0
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           # the below token should have repo scope and must be manually added by you in the repository's secret

.github/workflows/docker-pr.yml

@@ -11,7 +11,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v4.1.4
+        uses: actions/checkout@v4.1.5
       - name: Build Docker image
         uses: docker/build-push-action@v5.3.0
         with:

.github/workflows/lockfile.yml

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

.github/workflows/netlify-dev.yml

@@ -11,7 +11,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v4.1.4
+        uses: actions/checkout@v4.1.5
       - name: Setup node
         uses: actions/setup-node@v4.0.2
         with:

.github/workflows/prod-deploy.yml

@@ -10,7 +10,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v4.1.4
+        uses: actions/checkout@v4.1.5
       - name: Setup node
         uses: actions/setup-node@v4.0.2
         with:
@@ -52,7 +52,7 @@ jobs:
           gpg --export | xxd -p
           echo '${{ secrets.GNUPG_PASSPHRASE }}' | gpg --batch --yes --pinentry-mode loopback --passphrase-fd 0 --armor --detach-sign cinny-${{ steps.vars.outputs.tag }}.tar.gz
       - name: Upload tagged release
-        uses: softprops/action-gh-release@9d7c94cfd0a1f3ed45544c887983e9fa900f0564
+        uses: softprops/action-gh-release@69320dbe05506a9a39fc8ae11030b214ec2d1f87
         with:
           files: |
             cinny-${{ steps.vars.outputs.tag }}.tar.gz
@@ -66,7 +66,7 @@ jobs:
       packages: write
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v4.1.4
+        uses: actions/checkout@v4.1.5
       - name: Set up QEMU
         uses: docker/setup-qemu-action@v3.0.0
       - name: Set up Docker Buildx

Dockerfile

@@ -11,7 +11,7 @@ RUN npm run build
 
 
 ## App
-FROM nginx:1.25.5-alpine
+FROM nginx:1.26.0-alpine
 
 COPY --from=builder /src/dist /app
 

package.json

@@ -3,6 +3,7 @@
   "version": "3.2.0",
   "description": "Yet another matrix client",
   "main": "index.js",
+  "type": "module",
   "engines": {
     "node": ">=16.0.0"
   },
@@ -52,7 +53,7 @@
     "linkifyjs": "4.0.2",
     "matrix-js-sdk": "29.1.0",
     "millify": "6.1.0",
-    "pdfjs-dist": "3.10.111",
+    "pdfjs-dist": "4.2.67",
     "prismjs": "1.29.0",
     "prop-types": "15.8.1",
     "react": "18.2.0",
@@ -67,7 +68,7 @@
     "react-modal": "3.16.1",
     "react-range": "1.8.14",
     "react-router-dom": "6.20.0",
-    "sanitize-html": "2.8.0",
+    "sanitize-html": "2.12.1",
     "slate": "0.94.1",
     "slate-history": "0.93.0",
     "slate-react": "0.98.4",
@@ -93,15 +94,15 @@
     "eslint": "8.29.0",
     "eslint-config-airbnb": "19.0.4",
     "eslint-config-prettier": "8.5.0",
-    "eslint-plugin-import": "2.26.0",
+    "eslint-plugin-import": "2.29.1",
     "eslint-plugin-jsx-a11y": "6.6.1",
     "eslint-plugin-react": "7.31.11",
     "eslint-plugin-react-hooks": "4.6.0",
-    "mini-svg-data-uri": "1.4.4",
     "prettier": "2.8.1",
     "sass": "1.56.2",
     "typescript": "4.9.4",
     "vite": "5.0.13",
-    "vite-plugin-static-copy": "0.13.0"
+    "vite-plugin-static-copy": "1.0.4",
+    "vite-plugin-top-level-await": "1.4.1"
   }
 }

src/app/atoms/tabs/Tabs.jsx

@@ -41,8 +41,9 @@ TabItem.propTypes = {
 function Tabs({ items, defaultSelected, onSelect }) {
   const [selectedItem, setSelectedItem] = useState(items[defaultSelected]);
 
-  const handleTabSelection = (item, index) => {
+  const handleTabSelection = (item, index, target) => {
     if (selectedItem === item) return;
+    target.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'center' });
     setSelectedItem(item);
     onSelect(item, index);
   };
@@ -57,7 +58,7 @@ function Tabs({ items, defaultSelected, onSelect }) {
               selected={selectedItem.text === item.text}
               iconSrc={item.iconSrc}
               disabled={item.disabled}
-              onClick={() => handleTabSelection(item, index)}
+              onClick={(e) => handleTabSelection(item, index, e.currentTarget)}
             >
               {item.text}
             </TabItem>

src/app/utils/sanitize.ts

@@ -107,7 +107,7 @@ const transformATag: Transformer = (tagName, attribs) => ({
 
 const transformImgTag: Transformer = (tagName, attribs) => {
   const { src } = attribs;
-  if (src.startsWith('mxc://') === false) {
+  if (typeof src === 'string' && src.startsWith('mxc://') === false) {
     return {
       tagName: 'a',
       attribs: {

vite.config.js

@@ -2,11 +2,11 @@ import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
 import { wasm } from '@rollup/plugin-wasm';
 import { viteStaticCopy } from 'vite-plugin-static-copy';
-import { vanillaExtractPlugin } from "@vanilla-extract/vite-plugin";
+import { vanillaExtractPlugin } from '@vanilla-extract/vite-plugin';
 import { NodeGlobalsPolyfillPlugin } from '@esbuild-plugins/node-globals-polyfill';
 import inject from '@rollup/plugin-inject';
-import { svgLoader } from './viteSvgLoader'
+import topLevelAwait from 'vite-plugin-top-level-await';
-import buildConfig from "./build.config"
+import buildConfig from './build.config';
 
 const copyFiles = {
   targets: [
@@ -15,8 +15,9 @@ const copyFiles = {
       dest: '',
     },
     {
-      src: 'node_modules/pdfjs-dist/build/pdf.worker.min.js',
+      src: 'node_modules/pdfjs-dist/build/pdf.worker.min.mjs',
       dest: '',
+      rename: 'pdf.worker.min.js',
     },
     {
       src: 'netlify.toml',
@@ -39,7 +40,7 @@ const copyFiles = {
       dest: 'twemoji/',
     },
   ],
-}
+};
 
 export default defineConfig({
   appType: 'spa',
@@ -50,16 +51,21 @@ export default defineConfig({
     host: true,
   },
   plugins: [
+    topLevelAwait({
+      // The export name of top-level await promise for each chunk module
+      promiseExportName: '__tla',
+      // The function to generate import names of top-level await promise in each chunk module
+      promiseImportName: (i) => `__tla_${i}`,
+    }),
     viteStaticCopy(copyFiles),
     vanillaExtractPlugin(),
-    svgLoader(),
     wasm(),
     react(),
   ],
   optimizeDeps: {
     esbuildOptions: {
       define: {
-          global: 'globalThis'
+        global: 'globalThis',
       },
       plugins: [
         // Enable esbuild polyfill plugins
@@ -67,17 +73,15 @@ export default defineConfig({
           process: false,
           buffer: true,
         }),
-        ]
+      ],
-    }
+    },
   },
   build: {
     outDir: 'dist',
     sourcemap: true,
     copyPublicDir: false,
     rollupOptions: {
-      plugins: [
+      plugins: [inject({ Buffer: ['buffer', 'Buffer'] })],
-        inject({ Buffer: ['buffer', 'Buffer'] })
+    },
-      ]
-    }
   },
 });

viteSvgLoader.ts

@@ -1,16 +0,0 @@
-import svgToMiniDataURI from 'mini-svg-data-uri';
-import type { Plugin } from 'rollup';
-import fs from 'fs';
-
-// TODO: remove this once https://github.com/vitejs/vite/pull/2909 gets merged
-export const svgLoader = (): Plugin => ({
-  name: 'vite-svg-patch-plugin',
-  transform: (code, id) => {
-    if (id.endsWith('.svg')) {
-      const extractedSvg = fs.readFileSync(id, 'utf8');
-      const datauri = svgToMiniDataURI.toSrcset(extractedSvg);
-      return `export default "${datauri}"`;
-    }
-    return code;
-  },
-});