Merge membrane-webrtc-js into ts-client-sdk (#38)

This PR is merging logic from https://github.com/jellyfish-dev/membrane-webrtc-js into this repository. So we can keep only one SDK for web (apart from React SDK - that can still be separate).

Next phase would be to generate new documentation for joined library and update/release new version of ts-client-sdk

Note

Commit history from previous repo is preserved using trick from https://gfscott.com/blog/merge-git-repos-and-keep-commit-history/

.eslintrc

@@ -10,6 +10,7 @@
   ],
   "rules": {
     "@typescript-eslint/ban-ts-comment": "off",
+    "@typescript-eslint/no-explicit-any": "warn",
     "@typescript-eslint/no-unused-vars": [
       "warn",
       {

.github/workflows/node.yaml

@@ -24,19 +24,19 @@ jobs:
           cache: "npm"
 
       - name: Install dependencies ⬇️
-        run: npm ci
+        run: yarn
 
       - name: Check formatting 🎨
-        run: npm run format:check
+        run: yarn format:check
 
       - name: Run linter
-        run: npm run lint:check
+        run: yarn lint:check
 
       - name: Build 📦
-        run: npm run build --if-present
+        run: yarn build
 
       - name: Test 🚀
-        run: npm test --if-present
+        run: yarn test
 
   build_and_test_examples:
     name: Build and test examples
@@ -54,20 +54,16 @@ jobs:
     steps:
       - uses: actions/checkout@v4
       - name: Use Node.js ${{ matrix.node-version }} 🛎️
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
-          cache: "npm"
 
       - name: Install dependencies lib ⬇️
-        run: npm ci
+        run: yarn
         working-directory: .
 
       - name: Install dependencies ⬇️
-        run: npm ci
+        run: yarn
 
       - name: Build 📦
-        run: npm run build --if-present
-
-      - name: Test 🚀
-        run: npm test --if-present
+        run: yarn build

.github/workflows/playwright.yaml

@@ -10,20 +10,23 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
         with:
           node-version: 18
       - name: Install dependencies
-        run: npm ci
+        run: yarn
       - name: Build SDK
-        run: npm run build
+        run: yarn build
       - name: Install example dependencies
-        run: npm ci
+        run: yarn
         working-directory: examples/simple-app
+      - name: Install e2e dependencies
+        run: yarn
+        working-directory: e2e/app
       - name: Install Playwright Browsers
         run: npx playwright install --with-deps
       - name: Run Playwright tests
-        run: npm run e2e
+        run: yarn e2e
       - uses: actions/upload-artifact@v3
         if: always()
         with:

.gitignore

@@ -30,3 +30,5 @@ docs
 /playwright-report/
 /blob-report/
 /playwright/.cache/
+
+/coverage/

e2e/app/.gitignore

@@ -0,0 +1,28 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+/test-results/
+/playwright-report/
+/blob-report/
+/playwright/.cache/

e2e/app/README.md

@@ -0,0 +1,27 @@
+# React + TypeScript + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
+
+- Configure the top-level `parserOptions` property like this:
+
+```js
+   parserOptions: {
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+    project: ['./tsconfig.json', './tsconfig.node.json'],
+    tsconfigRootDir: __dirname,
+   },
+```
+
+- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked`
+- Optionally add `plugin:@typescript-eslint/stylistic-type-checked`
+- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list

e2e/app/compile_proto.sh

@@ -0,0 +1,20 @@
+#!/bin/bash
+
+# Terminate on errors
+set -e
+
+
+printf "Synchronising submodules... "
+git submodule sync --recursive >> /dev/null
+git submodule update --recursive --remote --init >> /dev/null
+printf "DONE\n\n"
+
+file="./protos/jellyfish/peer_notifications.proto"
+
+printf "Compiling: file %s\n" "$file"
+protoc --plugin=./node_modules/.bin/protoc-gen-ts_proto --ts_proto_out=./src/ $file
+printf "DONE\n"
+
+cd ../..
+npm run format:fix
+npm run lint:fix

e2e/app/index.html

@@ -0,0 +1,20 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + React + TS</title>
+    <style>
+      html,
+      body {
+        margin: 0;
+        width: 100%;
+      }
+    </style>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

e2e/app/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "example",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@jellyfish-dev/ts-client-sdk": "file:../..",
+    "protobufjs": "^7.2.6",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "ts-proto": "^1.167.3"
+  },
+  "devDependencies": {
+    "@playwright/test": "^1.41.2",
+    "@types/node": "^20.11.18",
+    "@types/react": "^18.2.55",
+    "@types/react-dom": "^18.2.19",
+    "@typescript-eslint/eslint-plugin": "^7.0.1",
+    "@typescript-eslint/parser": "^7.0.1",
+    "@vitejs/plugin-react": "^4.2.1",
+    "eslint": "^8.56.0",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-react-refresh": "^0.4.5",
+    "typescript": "5.3.3",
+    "vite": "^5.1.2"
+  }
+}