chore: upgrade to trystero 0.11.3

package-lock.json

@@ -32,7 +32,7 @@
         "react-syntax-highlighter": "^15.5.0",
         "remark-gfm": "^3.0.1",
         "sass": "^1.54.3",
-        "trystero": "^0.11.2",
+        "trystero": "^0.11.3",
         "typeface-public-sans": "^1.1.13",
         "typeface-roboto": "^1.1.13",
         "typescript": "^4.7.4",
@@ -61,7 +61,7 @@
         "tailwindcss": "^3.1.8"
       },
       "engines": {
-        "node": "18.x",
+        "node": "16.x",
         "npm": "8.x"
       }
     },
@@ -22917,9 +22917,9 @@
       "integrity": "sha512-c3zayb8/kWWpycWYg87P71E1S1ZL6b6IJxfb5fvsUgsf0S2MVGaDhDXXjDMpdCpfWXqptc+4mXwmiy1ypXqRAA=="
     },
     "node_modules/trystero": {
-      "version": "0.11.2",
+      "version": "0.11.3",
-      "resolved": "https://registry.npmjs.org/trystero/-/trystero-0.11.2.tgz",
+      "resolved": "https://registry.npmjs.org/trystero/-/trystero-0.11.3.tgz",
-      "integrity": "sha512-bC7OnC1EgqatilDnkQXzcYS38gnmuX3wMUPxOpa3qDgxQU8/RuxGuvnB/080BpTKCz/fPYrACgfS8hZDjuQUYg==",
+      "integrity": "sha512-UOHbONL7AE3ie5lQBJ6gflfETEuB7LCscmmq2LQcR21UTJAomtT5Xk8EpJFcHn/O4mQTlSCC6cF7pynydFygNQ==",
       "dependencies": {
         "firebase": "^9.6.5",
         "ipfs-core": "0.9.0",
@@ -41158,9 +41158,9 @@
       "integrity": "sha512-c3zayb8/kWWpycWYg87P71E1S1ZL6b6IJxfb5fvsUgsf0S2MVGaDhDXXjDMpdCpfWXqptc+4mXwmiy1ypXqRAA=="
     },
     "trystero": {
-      "version": "0.11.2",
+      "version": "0.11.3",
-      "resolved": "https://registry.npmjs.org/trystero/-/trystero-0.11.2.tgz",
+      "resolved": "https://registry.npmjs.org/trystero/-/trystero-0.11.3.tgz",
-      "integrity": "sha512-bC7OnC1EgqatilDnkQXzcYS38gnmuX3wMUPxOpa3qDgxQU8/RuxGuvnB/080BpTKCz/fPYrACgfS8hZDjuQUYg==",
+      "integrity": "sha512-UOHbONL7AE3ie5lQBJ6gflfETEuB7LCscmmq2LQcR21UTJAomtT5Xk8EpJFcHn/O4mQTlSCC6cF7pynydFygNQ==",
       "requires": {
         "firebase": "^9.6.5",
         "ipfs-core": "0.9.0",

package.json

@@ -28,7 +28,7 @@
     "react-syntax-highlighter": "^15.5.0",
     "remark-gfm": "^3.0.1",
     "sass": "^1.54.3",
-    "trystero": "^0.11.2",
+    "trystero": "^0.11.3",
     "typeface-public-sans": "^1.1.13",
     "typeface-roboto": "^1.1.13",
     "typescript": "^4.7.4",

src/components/Message/Message.tsx

@@ -2,10 +2,21 @@ import { HTMLAttributes } from 'react'
 import Box from '@mui/material/Box'
 import Typography, { TypographyProps } from '@mui/material/Typography'
 import Link, { LinkProps } from '@mui/material/Link'
-import Markdown from 'react-markdown'
-import { CodeProps } from 'react-markdown/lib/ast-to-react'
 import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter'
 import { materialDark } from 'react-syntax-highlighter/dist/esm/styles/prism'
+
+// These imports need to be ts-ignored to prevent spurious errors that look
+// like this:
+//
+//   Module 'react-markdown' cannot be imported using this construct. The
+//   specifier only resolves to an ES module, which cannot be imported
+//   synchronously. Use dynamic import instead. (tsserver 1471)
+//
+// @ts-ignore
+import Markdown from 'react-markdown'
+// @ts-ignore
+import { CodeProps } from 'react-markdown/lib/ast-to-react'
+// @ts-ignore
 import remarkGfm from 'remark-gfm'
 
 import { Message as IMessage, isMessageReceived } from 'models/chat'

src/hooks/usePeerRoom/usePeerRoom.ts

@@ -1,9 +1,13 @@
 import { useEffect, useState } from 'react'
-import { RoomConfig } from 'trystero'
+import { BaseRoomConfig } from 'trystero'
+import { TorrentRoomConfig } from 'trystero/torrent'
 
 import { PeerRoom } from 'services/PeerRoom'
 
-export function usePeerRoom(roomConfig: RoomConfig, roomId: string) {
+export function usePeerRoom(
+  roomConfig: BaseRoomConfig & TorrentRoomConfig,
+  roomId: string
+) {
   const [peerRoom] = useState(() => new PeerRoom(roomConfig, roomId))
 
   useEffect(() => {

src/react-app-env.d.ts

@@ -2,101 +2,6 @@
 
 // TODO: Contribute this to Trystero
 declare module 'trystero' {
-  interface BitTorrentRoomConfig {
-    trackerUrls?: string[]
-    trackerRedundancy?: number
-  }
-
-  interface FirebaseRoomConfig {
-    firebaseApp?: string
-    rootPath?: string
-  }
-
-  interface IpfsRoomConfig {
-    swarmAddresses?: string
-  }
-
-  export interface BaseRoomConfig {
-    appId: string
-    password?: string
-    rtcConfig?: RTCConfiguration
-  }
-
   export type RoomConfig = BaseRoomConfig &
     (BitTorrentRoomConfig | FirebaseRoomConfig | IpfsRoomConfig)
-
-  export interface ActionSender<T> extends Promise {
-    (
-      data: T,
-      targetPeers?: string[],
-      metadata?: Record,
-      progress?: (percent: number, peerId: string) => void
-    ): Promise<Array<undefined>>
-  }
-
-  export interface ActionReceiver<T> {
-    (receiver: (data: T, peerId?: string, metadata?: Record) => void): void
-  }
-
-  export interface ActionProgress {
-    (
-      progressHandler: (
-        percent: number,
-        peerId: string,
-        metadata?: Record
-      ) => void
-    ): void
-  }
-
-  export interface Room {
-    makeAction: <T>(
-      namespace: string
-    ) => [ActionSender<T>, ActionReceiver<T>, ActionProgress]
-
-    ping: (id: string) => Promise<number>
-
-    leave: () => void
-
-    getPeers: () => string[]
-
-    addStream: (
-      stream: MediaStream,
-      peerId?: string,
-      metadata?: Record
-    ) => Promise<void>[]
-
-    removeStream: (stream: MediaStream, peerId?: string) => void
-
-    addTrack: (
-      track: MediaStreamTrack,
-      stream: MediaStream,
-      peerId?: string,
-      metadata?: Record
-    ) => Promise<void>[]
-
-    removeTrack: (
-      track: MediaStreamTrack,
-      stream: MediaStream,
-      peerId?: string
-    ) => void
-
-    replaceTrack: (
-      oldTrack: MediaStreamTrack,
-      newTrack: MediaStreamTrack,
-      stream: MediaStream,
-      peerId?: string
-    ) => Promise<void>[]
-
-    onPeerJoin: (fn: (peerId: string) => void) => void
-
-    onPeerLeave: (fn: (peerId: string) => void) => void
-
-    onPeerStream: (fn: (stream: MediaStream, peerId: string) => void) => void
-
-    onPeerTrack: (
-      fn: (track: MediaStreamTrack, stream: MediaStream, peerId: string) => void
-    ) => void
-  }
-
-  export function joinRoom(config: RoomConfig, roomId: string): Room
 }

src/services/PeerRoom/PeerRoom.ts

@@ -1,11 +1,12 @@
-import { joinRoom, Room, RoomConfig } from 'trystero'
+import { joinRoom, Room, BaseRoomConfig } from 'trystero'
+import { TorrentRoomConfig } from 'trystero/torrent'
 
 export class PeerRoom {
   private room: Room
 
-  private roomConfig: RoomConfig
+  private roomConfig: TorrentRoomConfig & BaseRoomConfig
 
-  constructor(config: RoomConfig, roomId: string) {
+  constructor(config: TorrentRoomConfig & BaseRoomConfig, roomId: string) {
     this.roomConfig = config
     this.room = joinRoom(this.roomConfig, roomId)
   }

tsconfig.json

@@ -10,7 +10,7 @@
     "forceConsistentCasingInFileNames": true,
     "noFallthroughCasesInSwitch": true,
     "module": "esnext",
-    "moduleResolution": "node",
+    "moduleResolution": "NodeNext",
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,