diff --git a/package-lock.json b/package-lock.json index 6548c74..f42e4be 100644 --- a/package-lock.json +++ b/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", - "resolved": "https://registry.npmjs.org/trystero/-/trystero-0.11.2.tgz", - "integrity": "sha512-bC7OnC1EgqatilDnkQXzcYS38gnmuX3wMUPxOpa3qDgxQU8/RuxGuvnB/080BpTKCz/fPYrACgfS8hZDjuQUYg==", + "version": "0.11.3", + "resolved": "https://registry.npmjs.org/trystero/-/trystero-0.11.3.tgz", + "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", - "resolved": "https://registry.npmjs.org/trystero/-/trystero-0.11.2.tgz", - "integrity": "sha512-bC7OnC1EgqatilDnkQXzcYS38gnmuX3wMUPxOpa3qDgxQU8/RuxGuvnB/080BpTKCz/fPYrACgfS8hZDjuQUYg==", + "version": "0.11.3", + "resolved": "https://registry.npmjs.org/trystero/-/trystero-0.11.3.tgz", + "integrity": "sha512-UOHbONL7AE3ie5lQBJ6gflfETEuB7LCscmmq2LQcR21UTJAomtT5Xk8EpJFcHn/O4mQTlSCC6cF7pynydFygNQ==", "requires": { "firebase": "^9.6.5", "ipfs-core": "0.9.0", diff --git a/package.json b/package.json index 0835943..4557065 100644 --- a/package.json +++ b/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", diff --git a/src/components/Message/Message.tsx b/src/components/Message/Message.tsx index 28819e1..f4dc513 100644 --- a/src/components/Message/Message.tsx +++ b/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' diff --git a/src/hooks/usePeerRoom/usePeerRoom.ts b/src/hooks/usePeerRoom/usePeerRoom.ts index 2e9b91b..2793e27 100644 --- a/src/hooks/usePeerRoom/usePeerRoom.ts +++ b/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(() => { diff --git a/src/react-app-env.d.ts b/src/react-app-env.d.ts index 3467e6a..96aa41b 100644 --- a/src/react-app-env.d.ts +++ b/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 extends Promise { - ( - data: T, - targetPeers?: string[], - metadata?: Record, - progress?: (percent: number, peerId: string) => void - ): Promise> - } - - export interface ActionReceiver { - (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: ( - namespace: string - ) => [ActionSender, ActionReceiver, ActionProgress] - - ping: (id: string) => Promise - - leave: () => void - - getPeers: () => string[] - - addStream: ( - stream: MediaStream, - peerId?: string, - metadata?: Record - ) => Promise[] - - removeStream: (stream: MediaStream, peerId?: string) => void - - addTrack: ( - track: MediaStreamTrack, - stream: MediaStream, - peerId?: string, - metadata?: Record - ) => Promise[] - - removeTrack: ( - track: MediaStreamTrack, - stream: MediaStream, - peerId?: string - ) => void - - replaceTrack: ( - oldTrack: MediaStreamTrack, - newTrack: MediaStreamTrack, - stream: MediaStream, - peerId?: string - ) => Promise[] - - 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 } diff --git a/src/services/PeerRoom/PeerRoom.ts b/src/services/PeerRoom/PeerRoom.ts index ba800fb..affbfd1 100644 --- a/src/services/PeerRoom/PeerRoom.ts +++ b/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) } diff --git a/tsconfig.json b/tsconfig.json index 5452a6d..a3ebcf3 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -10,7 +10,7 @@ "forceConsistentCasingInFileNames": true, "noFallthroughCasesInSwitch": true, "module": "esnext", - "moduleResolution": "node", + "moduleResolution": "NodeNext", "resolveJsonModule": true, "isolatedModules": true, "noEmit": true,