monorepo part 2

client/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "client",
+  "version": "1.0.0",
+  "description": "",
+  "main": "src/index.ts",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "bare-client-custom": "file:../bare-client-custom",
+    "firebase": "^10.1.0",
+    "protocol": "workspace:*"
+  }
+}

client/src/AdriftClient.ts

@@ -7,7 +7,7 @@ import {
   ReadyStateCallback,
   WebSocketImpl,
 } from "bare-client-custom";
-import Connection from "./Connection";
+import { Connection } from "./Connection";
 
 // export class Adrift {
 //   bareclient:AdriftBareClient,
@@ -45,7 +45,7 @@ export class AdriftBareClient extends Client {
     });
     const headers = new Headers();
     for (const [header, values] of Object.entries(payload.headers)) {
-      for (const value of values) {
+      for (const value of <string[]>values) {
         headers.append(header, value);
       }
     }

client/src/Connection.ts

@@ -5,10 +5,10 @@ import {
   HTTPResponsePayload,
   S2CRequestType,
   S2CRequestTypes,
-} from "../protocol";
-import Transport from "../protocol/Transport";
+  Transport,
+} from "protocol";
 
-export default class Connection {
+export class Connection {
   callbacks: Record<number, Function> = {};
 
   counter: number = 0;

client/src/DevWsTransport.ts

@@ -1,9 +1,9 @@
-import Transport from "../protocol/Transport";
+import { Transport } from "protocol";
 
 export class DevWsTransport extends Transport {
   ws: WebSocket;
 
-  constructor(onopen, onclose) {
+  constructor(onopen: () => void, onclose: () => void) {
     super(onopen, onclose);
 
     this.ws = new WebSocket("ws://localhost:3000/dev-ws");

client/src/RTCTransport.ts

@@ -1,39 +1,38 @@
-import Transport from "../protocol/Transport";
-import Connection from "./Connection";
+import { Transport } from "protocol";
 
 const rtcConf = {
   iceServers: [
     {
-      urls: "stun:stun.l.google.com:19302"
-    }
-  ]
-}
+      urls: "stun:stun.l.google.com:19302",
+    },
+  ],
+};
 
 enum RequestType {
   HttpRequest,
 }
 
-
-type Offer = { offer: any, localCandidates: any };
+type Offer = { offer: any; localCandidates: any };
 interface RTCOptions {
-
-  onconnectionstatechange?,
-  onsignalingstatechange?,
-  oniceconnectionstatechange?,
-  onicegatheringstatechange?,
-  onopen?,
-  onclose?,
-  onmessage?
+  onconnectionstatechange?: any;
+  onsignalingstatechange?: any;
+  oniceconnectionstatechange?: any;
+  onicegatheringstatechange?: any;
+  onopen?: any;
+  onclose?: any;
+  onmessage?: any;
 }
 
 export class RTCTransport extends Transport {
   peer: RTCPeerConnection;
 
   dataChannel: RTCDataChannel;
-  constructor(onopen, onclose,
+  constructor(
+    public onopen: () => void,
+    public onclose: () => void,
     public onconnectionstatechange: () => void,
     public onsignalingstatechange: () => void,
-    public onicegatheringstatechange: () => void,
+    public onicegatheringstatechange: () => void
   ) {
     super(onopen, onclose);
     this.peer = new RTCPeerConnection(rtcConf);
@@ -41,22 +40,24 @@ export class RTCTransport extends Transport {
 
     this.peer.onsignalingstatechange = onsignalingstatechange;
 
-    this.peer.oniceconnectionstatechange =
-      (event) => {
-        console.log('ICE connection state:', this.peer.iceConnectionState);
-        if (this.peer.iceConnectionState == "disconnected" || this.peer.iceConnectionState == "failed") {
-          console.log("disconnected");
-          onclose();
-        }
-      };
+    this.peer.oniceconnectionstatechange = (event) => {
+      console.log("ICE connection state:", this.peer.iceConnectionState);
+      if (
+        this.peer.iceConnectionState == "disconnected" ||
+        this.peer.iceConnectionState == "failed"
+      ) {
+        console.log("disconnected");
+        onclose();
+      }
+    };
     this.peer.onicegatheringstatechange = onicegatheringstatechange;
-    this.dataChannel = this.peer.createDataChannel('host-server');
+    this.dataChannel = this.peer.createDataChannel("host-server");
     this.dataChannel.onopen = onopen;
 
     this.dataChannel.onclose = onclose;
     this.dataChannel.onmessage = async (event) => {
       let buf = await event.data.arrayBuffer();
-      this.ondata(buf)
+      this.ondata(buf);
     };
   }
 
@@ -64,15 +65,10 @@ export class RTCTransport extends Transport {
     this.dataChannel.send(data);
   }
 
-
-
   async createOffer(): Promise<Promise<Offer>> {
-
     const localCandidates: RTCIceCandidate[] = [];
 
-
     let readyPromise: Promise<Offer> = new Promise((resolve, reject) => {
-
       this.peer.onicecandidate = async (event) => {
         if (event.candidate) {
           localCandidates.push(event.candidate);
@@ -83,8 +79,6 @@ export class RTCTransport extends Transport {
       };
     });
 
-
-
     const offer = await this.peer.createOffer();
     await this.peer.setLocalDescription(offer);
     return readyPromise;

client/src/firebase.ts

@@ -1,6 +1,5 @@
+import { getDatabase, onValue, ref, set } from "firebase/database";
 import "../firebase-config";
-import { getDatabase, ref, onValue, set } from "firebase/database";
-
 
 const db = getDatabase();
 console.log(db);
@@ -11,16 +10,15 @@ let reff = ref(db, "/peers/demo");
 //   console.log(data);
 // });
 
+var callback: (answer: any, candidates: any[]) => void;
 
-var callback;
-export function setCallback(call) {
+export function setCallback(call: typeof callback) {
   callback = call;
 }
 export function setOffer(offer: string) {
   set(reff, offer);
 }
 
-
 onValue(reff, (snapshot) => {
   const data = snapshot.val();
   console.log(data);
@@ -31,4 +29,3 @@ onValue(reff, (snapshot) => {
     callback(answer, candidates);
   }
 });
-

client/src/index.ts

@@ -0,0 +1,4 @@
+export { AdriftBareClient } from "./AdriftClient";
+export { Connection } from "./Connection";
+export { DevWsTransport } from "./DevWsTransport";
+export { RTCTransport } from "./RTCTransport";

client/tsconfig.json

@@ -16,7 +16,6 @@
     "noImplicitThis": true,
     "noImplicitAny": true,
     "strictNullChecks": true,
-    "suppressImplicitAnyIndexErrors": true,
     "noUnusedLocals": true,
     "skipLibCheck": true,
     "allowSyntheticDefaultImports": true,

frontend/package.json

@@ -20,7 +20,11 @@
     "typescript": "^5.1.6",
     "vite": "^4.4.9",
     "vite-plugin-singlefile": "^0.13.5",
-    "vite-plugin-svelte": "^3.0.1"
+    "vite-plugin-svelte": "^3.0.1",
+    "bare-client-custom": "file:../bare-client-custom",
+    "firebase-config": "workspace:*",
+    "client": "workspace:*",
+    "protocol": "workspace:*"
   },
   "devDependencies": {}
 }

frontend/src/App.svelte

@@ -1,13 +1,14 @@
 <script lang="ts">
-  import { AdriftBareClient } from "../client/AdriftClient";
-  import Connection from "../client/Connection";
-  import { DevWsTransport } from "../client/DevWsTransport";
-  import { RTCTransport } from "../client/RTCTransport";
-  // note: even though we import firebase, due to the tree shaking, it will only run if we use "auth" so if ADRIFT_DEV is set it won't import
-  import { auth } from "../firebase-config";
-  import type Transport from "../protocol/Transport";
   import {
-    BareClient,
+    AdriftBareClient,
+    Connection,
+    DevWsTransport,
+    RTCTransport,
+  } from "client";
+  // note: even though we import firebase, due to the tree shaking, it will only run if we use "auth" so if ADRIFT_DEV is set it won't import
+  import { auth } from "firebase-config";
+  import type { Transport } from "protocol";
+  import {
     registerRemoteListener,
     setBareClientImplementation,
   } from "bare-client-custom";
@@ -16,14 +17,13 @@
 
   let transport: Transport;
 
-  let wstransport: DevWsTransport | undefined;
   let rtctransport: RTCTransport | undefined;
   if (import.meta.env.VITE_ADRIFT_DEV) {
     console.log(
       "%cADRIFT RUNNING IN DEVELOPMENT MODE",
       "background: blue; color: white; font-size: x-large"
     );
-    wstransport = transport = new DevWsTransport(
+    transport = new DevWsTransport(
       () => console.log("onopen"),
       () => console.log("onclose")
     );
@@ -101,13 +101,12 @@
     const { answer, candidates } = await r.json();
     await rtctransport?.answer(answer, candidates);
   }
-  // connectDevHttp();
 </script>
 
 <h1>
   {#if !import.meta.env.VITE_ADRIFT_DEV}
     <button on:click={connectFirebase}>Connect with firebase </button>
   {:else}
-    connected to dev server
+    <button on:click={connectDevHttp}>Connect with dev HTTP</button>
   {/if}
 </h1>

frontend/src/entry.ts

@@ -1,7 +1,7 @@
-
 import App from "./App.svelte";
+
 const app = new App({
-  target: document.getElementById("app")
+  target: document.getElementById("app")!,
 });
 
 if (!import.meta.env.VITE_ADRIFT_SINGLEFILE) {

frontend/src/env.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="vite/client" />
+
+interface ImportMetaEnv {
+  readonly VITE_ADRIFT_DEV: string;
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv;
+}

frontend/svelte.config.cjs

@@ -10,4 +10,4 @@ const config = {
   ],
 };
 
-module.exports = config;
+module.exports = config;

frontend/tsconfig.json

@@ -0,0 +1,33 @@
+{
+  "compilerOptions": {
+    "experimentalDecorators": true,
+    "baseUrl": ".",
+    "outDir": "build/dist",
+    "module": "esnext",
+    "target": "es2017",
+    "lib": ["es6", "dom", "esnext.asynciterable", "es2017"],
+    "sourceMap": true,
+    "allowJs": true,
+    "jsx": "react",
+    "moduleResolution": "node",
+    "rootDir": "..",
+    "forceConsistentCasingInFileNames": true,
+    "noImplicitReturns": true,
+    "noImplicitThis": true,
+    "noImplicitAny": true,
+    "strictNullChecks": true,
+    "noUnusedLocals": true,
+    "skipLibCheck": true,
+    "allowSyntheticDefaultImports": true,
+    "removeComments": true
+  },
+  "exclude": [
+    "node_modules",
+    "build",
+    "scripts",
+    "acceptance-tests",
+    "webpack",
+    "jest",
+    "src/setupTests.ts"
+  ]
+}

pnpm-lock.yaml

@@ -8,6 +8,18 @@ importers:
 
   .: {}
 
+  client:
+    dependencies:
+      bare-client-custom:
+        specifier: file:../bare-client-custom
+        version: file:bare-client-custom
+      firebase:
+        specifier: ^10.1.0
+        version: 10.1.0(react-native@0.72.3)
+      protocol:
+        specifier: workspace:*
+        version: link:../protocol
+
   firebase-config:
     dependencies:
       firebase:
@@ -19,9 +31,21 @@ importers:
       '@sveltejs/vite-plugin-svelte':
         specifier: ^2.4.5
         version: 2.4.5(svelte@4.2.0)(vite@4.4.9)
+      bare-client-custom:
+        specifier: file:../bare-client-custom
+        version: file:bare-client-custom
+      client:
+        specifier: workspace:*
+        version: link:../client
       firebase:
         specifier: ^10.1.0
         version: 10.1.0(react-native@0.72.3)
+      firebase-config:
+        specifier: workspace:*
+        version: link:../firebase-config
+      protocol:
+        specifier: workspace:*
+        version: link:../protocol
       svelte:
         specifier: ^4.2.0
         version: 4.2.0
@@ -2798,6 +2822,10 @@ packages:
     resolution: {integrity: sha512-Hl219/BT5fLAaz6NDkSuhzasy49dwQS/DSdu4MdggFB8zcXv7vflBI3xp7FEmkmdDkBUI2bPUNeMttp2knYdxw==}
     dev: false
 
+  /@types/uuid@9.0.2:
+    resolution: {integrity: sha512-kNnC1GFBLuhImSnV7w4njQkUiJi0ZXUycu1rUaouPqiKlXkh77JKgdRnTAp1x5eBwcIwbtI+3otwzuIDEuDoxQ==}
+    dev: false
+
   /@types/webrtc@0.0.36:
     resolution: {integrity: sha512-tYFarc92EluXU7XyRmWbkQXSbZIOHTdDOudFPal9u/TNTQuouWpIHV/2o9bNAdqvTJFjLJh/zflCOLWbL30tEQ==}
     dev: true
@@ -6407,6 +6435,11 @@ packages:
     engines: {node: '>= 0.4.0'}
     dev: false
 
+  /uuid@9.0.0:
+    resolution: {integrity: sha512-MXcSTerfPa4uqyzStbRoTgt5XIe3x5+42+q1sDuy3R5MDk66URdLMOZe5aPX/SQd+kuYAh0FdP/pO28IkQyTeg==}
+    hasBin: true
+    dev: false
+
   /v8-compile-cache-lib@3.0.1:
     resolution: {integrity: sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==}
     dev: false
@@ -6725,3 +6758,11 @@ packages:
     resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}
     engines: {node: '>=10'}
     dev: false
+
+  file:bare-client-custom:
+    resolution: {directory: bare-client-custom, type: directory}
+    name: '@tomphttp/bare-client'
+    dependencies:
+      '@types/uuid': 9.0.2
+      uuid: 9.0.0
+    dev: false

protocol/src/Transport.ts

@@ -1,4 +1,4 @@
-export default abstract class Transport {
+export abstract class Transport {
   public ondata: (data: ArrayBuffer) => void = () => {};
   constructor(public onopen: () => void, public onclose: () => void) {}
 

protocol/src/index.ts

@@ -30,3 +30,5 @@ export type HTTPResponsePayload = {
   statusText: string;
   headers: ProtoBareHeaders;
 };
+
+export { Transport } from "./Transport";