Skip to content

Commit e14ec25

Browse files
behei-vonagebehei-vonage
committed
oh lord
2 parents 2c96e14 + a2e9b41 commit e14ec25

File tree

85 files changed

+1907
-416
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

85 files changed

+1907
-416
lines changed

‎.husky/pre-commit‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
11
#!/usr/bin/env sh
22
. "$(dirname "$0")/_/husky.sh"
33

4-
yarn lint-staged
4+
# Exit on error and unset variables
5+
set -eu
6+
7+
yarn --silent quality-check

‎.lintstagedrc‎

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎README.md‎

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -65,15 +65,26 @@ This application provides features for common conferencing use cases, such as:
6565
<img src="docs/assets/NoiseSupression.png" alt="Screenshot of noise supression toggle">
6666
</details>
6767
- <details>
68-
<summary>Background effects in meeting and waiting room. You can set predefined images, custom image or slight/strong background blur. Images can be uploaded from local device or URL in these formats: JPG, PNG, GIF or BMP. Background effects are not supported in non-Chromium-based browsers or on iOS. </summary>
68+
<summary>
69+
Background effects in meeting and waiting room. You can set predefined images, custom image or slight/strong background blur. Images can be uploaded from local device or URL in these formats: JPG, PNG, GIF or BMP. Background effects are not supported in non-Chromium-based browsers or on iOS.
70+
71+
Please see [OT.hasMediaProcessorSupport](https://vonage.github.io/video-docs/video-js-reference/latest/OT.html#hasMediaProcessorSupport) for more information.
72+
</summary>
73+
6974
<img src="docs/assets/BGEffects.png" alt="Screenshot of background effects">
7075
</details>
76+
- <details>
77+
<summary>
78+
Configurable features: adapt the app to your specific use cases and roles.
79+
Configuration is handled through a <em>config.json</em> file that can be moved to the <em>frontend/public</em> folder; there's an example in the base directory, <em>config.example.json</em>. Changes to the config file will be reflected immediately in most cases, but some rooms will need to be re-joined to take effect (For example: "setting the default layout" or "audio on join").
80+
</summary>
81+
<img src="docs/assets/configFile.png" alt="Screenshot of a config.json">
7182
- <details>
7283
<summary>Composed archiving capabilities to record your meetings.</summary>
7384
<img src="docs/assets/Archiving.png" alt="Screenshot of archiving dialog box">
7485
</details>
7586
- <details>
76-
<summary>In-call tools such as screen sharing, group chat function, and emoji reactions.</summary>
87+
<summary>In-call tools such as screen sharing (subscriber can zoom in/out if hasMediaProcessorSupport), group chat function, and emoji reactions.</summary>
7788
<img src="docs/assets/Emojis.png" alt="Screenshot of emojis">
7889
</details>
7990
- Active speaker detection.
@@ -106,6 +117,8 @@ The Vonage Video API Reference App for React is currently supported on the lates
106117
- ![Safari icon](/docs/assets/safari.svg) Safari
107118
- ![Electron icon](/docs/assets/electron.svg) Electron
108119

120+
*Note:* Some browsers such as Firefox or Safari do not support media processors like video and audio filters (e.g background effects): Please see [OT.hasMediaProcessorSupport](https://vonage.github.io/video-docs/video-js-reference/latest/OT.html#hasMediaProcessorSupport) for more information.
121+
109122
*Note:* Mobile web views have limited supported at the moment. The minimum supported device width is `360px`.
110123

111124
## Requirements

‎backend/package.json‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,12 @@
55
"main": "index.js",
66
"type": "module",
77
"scripts": {
8-
"dev": "tsx watch index.ts",
9-
"start": "node --import tsx index.ts",
10-
"debug": "node --inspect --watch --import tsx index.ts",
8+
"dev": "nodemon --watch . --ext ts,tsx,json --ignore dist --exec \"sh -c 'yarn ts-check && node --import tsx index.ts'\"",
9+
"start": "yarn ts-check && node --import tsx index.ts",
10+
"debug": "nodemon --watch . --ext ts,tsx,json --ignore dist --exec \"sh -c 'yarn ts-check && node --inspect --import tsx index.ts'\"",
1111
"test": "NODE_OPTIONS=\"--experimental-vm-modules\" jest --maxWorkers=1 --coverage",
1212
"test:watch": "yarn test --watch",
13-
"ts-check": "tsc -p tsconfig.json"
13+
"ts-check": "tsc --noEmit -p tsconfig.json --pretty true"
1414
},
1515
"author": "",
1616
"license": "MIT",
@@ -41,6 +41,7 @@
4141
"@types/supertest": "^6.0.2",
4242
"@types/validator": "^13.15.2",
4343
"jest": "^29.7.0",
44+
"nodemon": "^3.1.10",
4445
"supertest": "^7.0.0",
4546
"ts-jest": "^29.1.2"
4647
}

‎docs/assets/configFile.png‎

200 KB
Loading

‎frontend/.env.example‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,4 +17,4 @@ VITE_TUNNEL_DOMAIN=''
1717
# Default language for i18next
1818
VITE_I18N_FALLBACK_LANGUAGE='en'
1919
# List all supported language, separated by | (example: VITE_I18N_SUPPORTED_LANGUAGES='en|es')
20-
VITE_I18N_SUPPORTED_LANGUAGES='en|es|es-MX'
20+
VITE_I18N_SUPPORTED_LANGUAGES='en|en-US|es|es-MX|it'

‎frontend/.eslintrc.cjs‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,5 +19,22 @@ module.exports = {
1919
'jsx-a11y/no-static-element-interactions': 'off',
2020
'jsx-a11y/click-events-have-key-events': 'off',
2121
'react/require-default-props': 'off',
22+
23+
'jsdoc/require-jsdoc': 'off', // to keep code base consistency since const functions are not required to have jsdoc,
24+
25+
/*
26+
* Functions and classes are hoisted, so they can be used before their declaration.
27+
*/
28+
'@typescript-eslint/no-use-before-define': ['error', {
29+
functions: false,
30+
classes: false,
31+
variables: true,
32+
}],
33+
34+
'no-redeclare': 'off', // duplicate rule, typescript already checks for this
35+
'@typescript-eslint/no-shadow': 'off', // duplicate rule, typescript already checks for this
36+
'consistent-return': 'off', // this rule goes against standard useEffect patterns,
37+
'tailwindcss/classnames-order': 'off', // this rule forces the changes to be more disruptive than beneficial and prevent grouping classes logically
38+
'no-dupe-class-members': 'off', // duplicate rule, typescript already checks for this
2239
},
2340
};

‎frontend/package.json‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,16 +5,17 @@
55
"version": "1.2.3",
66
"type": "module",
77
"scripts": {
8-
"build": "vite build && yarn cp-build",
8+
"build": "yarn --silent ts-check && vite build && yarn cp-build",
99
"cp-build": "mkdir -p ../backend/dist && cp -r dist ../backend",
10-
"dev": "vite --host",
10+
"dev": "concurrently 'yarn --silent ts-check:watch' 'vite --host'",
1111
"docs": "typedoc",
1212
"docs:watch": "typedoc --watch",
1313
"lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
1414
"preview": "vite preview",
1515
"test": "vitest run --coverage",
1616
"test:watch": "vitest",
17-
"ts-check": "tsc -p tsconfig.json"
17+
"ts-check": "tsc -p tsconfig.json --pretty true",
18+
"ts-check:watch": "yarn --silent ts-check --noEmit --watch --preserveWatchOutput"
1819
},
1920
"dependencies": {
2021
"@emotion/css": "^11.11.2",
@@ -32,6 +33,7 @@
3233
"@vitejs/plugin-react": "^4.4.1",
3334
"@vonage/client-sdk-video": "^2.31.0",
3435
"@vonage/vcr-sdk": "^1.3.0",
36+
"@vonage/vivid": "^5.3.0",
3537
"autolinker": "^4.0.0",
3638
"autoprefixer": "^10.4.19",
3739
"axios": "^1.12.0",
@@ -64,6 +66,7 @@
6466
"@types/uuid": "^9.0.8",
6567
"@vitest/coverage-v8": "^1.3.0",
6668
"@vitest/ui": "^1.3",
67-
"jsdom": "^22.1.0"
69+
"jsdom": "^22.1.0",
70+
"vite-plugin-checker": "^0.11.0"
6871
}
6972
}

‎frontend/src/App.tsx‎

Lines changed: 34 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
22
import './css/App.css';
33
import './css/index.css';
4+
import { CssBaseline, ThemeProvider } from '@mui/material';
45
import Room from './pages/MeetingRoom/index';
56
import GoodBye from './pages/GoodBye/index';
67
import WaitingRoom from './pages/WaitingRoom';
@@ -11,38 +12,42 @@ import { PublisherProvider } from './Context/PublisherProvider';
1112
import RedirectToWaitingRoom from './components/RedirectToWaitingRoom';
1213
import UnsupportedBrowserPage from './pages/UnsupportedBrowserPage';
1314
import RoomContext from './Context/RoomContext';
15+
import customTheme from './utils/customTheme/customTheme';
1416

1517
const App = () => {
1618
return (
17-
<Router>
18-
<Routes>
19-
<Route element={<RoomContext />}>
20-
<Route
21-
path="/waiting-room/:roomName"
22-
element={
23-
<PreviewPublisherProvider>
24-
<WaitingRoom />
25-
</PreviewPublisherProvider>
26-
}
27-
/>
28-
<Route
29-
path="/room/:roomName"
30-
element={
31-
<SessionProvider>
32-
<RedirectToWaitingRoom>
33-
<PublisherProvider>
34-
<Room />
35-
</PublisherProvider>
36-
</RedirectToWaitingRoom>
37-
</SessionProvider>
38-
}
39-
/>
40-
</Route>
41-
<Route path="/goodbye" element={<GoodBye />} />
42-
<Route path="*" element={<LandingPage />} />
43-
<Route path="/unsupported-browser" element={<UnsupportedBrowserPage />} />
44-
</Routes>
45-
</Router>
19+
<ThemeProvider theme={customTheme}>
20+
<CssBaseline />
21+
<Router>
22+
<Routes>
23+
<Route element={<RoomContext />}>
24+
<Route
25+
path="/waiting-room/:roomName"
26+
element={
27+
<PreviewPublisherProvider>
28+
<WaitingRoom />
29+
</PreviewPublisherProvider>
30+
}
31+
/>
32+
<Route
33+
path="/room/:roomName"
34+
element={
35+
<SessionProvider>
36+
<RedirectToWaitingRoom>
37+
<PublisherProvider>
38+
<Room />
39+
</PublisherProvider>
40+
</RedirectToWaitingRoom>
41+
</SessionProvider>
42+
}
43+
/>
44+
</Route>
45+
<Route path="/goodbye" element={<GoodBye />} />
46+
<Route path="*" element={<LandingPage />} />
47+
<Route path="/unsupported-browser" element={<UnsupportedBrowserPage />} />
48+
</Routes>
49+
</Router>
50+
</ThemeProvider>
4651
);
4752
};
4853

‎frontend/src/Context/PublisherProvider/usePublisher/usePublisher.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ type DeviceAccessStatus = {
2626
camera: boolean | undefined;
2727
};
2828

29-
type PublishingErrorType = {
29+
export type PublishingErrorType = {
3030
header: string;
3131
caption: string;
3232
} | null;
@@ -268,11 +268,11 @@ const usePublisher = (): PublisherContextType => {
268268
return;
269269
}
270270

271-
sessionPublish(publisherRef.current);
272-
setIsPublishingToSession(true);
271+
setIsPublishingToSession(true); // Avoid multiple simultaneous publish attempts
272+
await sessionPublish(publisherRef.current);
273273
} catch (err: unknown) {
274274
if (err instanceof Error) {
275-
console.warn(err.stack);
275+
console.warn(err);
276276
setIsPublishingToSession(false);
277277
publish();
278278
}

0 commit comments

Comments
 (0)