fix: more ice servers

ido-pluto · Nov 3, 2023 · eb7029f · eb7029f
1 parent c82e858
commit eb7029f
Show file tree

Hide file tree

Showing 3 changed files with 59 additions and 6 deletions.
diff --git a/src/config/const.ts b/src/config/const.ts
@@ -1,5 +1,44 @@
 export const WEB_SERVER = import.meta.env.VITE_WEB_SERVER || 'localhost:8080';
 export const SERVER_SECURE = import.meta.env.VITE_SERVER_SECURE;
-export const ICE_SERVERS: string[] =
+export const ICE_SERVERS: RTCIceServer[] =
     import.meta.env.VITE_ICE_SERVERS && JSON.parse(import.meta.env.VITE_ICE_SERVERS) ||
-    ['stun:stun.l.google.com:19302'];
+    [
+        {
+            urls: 'turn:numb.viagenie.ca',
+            credential: 'muazkh',
+            username: 'webrtc@live.com'
+        },
+        {
+            urls: 'turn:192.158.29.39:3478?transport=udp',
+            credential: 'JZEOEt2V3Qb0y27GRntt2u2PAYA=',
+            username: '28224511:1379330808'
+        },
+        {
+            urls: 'turn:192.158.29.39:3478?transport=tcp',
+            credential: 'JZEOEt2V3Qb0y27GRntt2u2PAYA=',
+            username: '28224511:1379330808'
+        },
+        {
+            urls: 'turn:turn.bistri.com:80',
+            credential: 'homeo',
+            username: 'homeo'
+        },
+        {
+            urls: 'turn:turn.anyfirewall.com:443?transport=tcp',
+            credential: 'webrtc',
+            username: 'webrtc'
+        },
+        {
+            urls: 'stun:stun.l.google.com:19302',
+        },
+        {
+            urls: 'turn:192.158.29.39:3478?transport=udp',
+            credential: 'JZEOEt2V3Qb0y27GRntt2u2PAYA=',
+            username: '28224511:1379330808',
+        },
+        {
+            urls: 'turn:192.158.29.39:3478?transport=tcp',
+            credential: 'JZEOEt2V3Qb0y27GRntt2u2PAYA=',
+            username: '28224511:1379330808',
+        },
+    ];
diff --git a/src/core/app-store/server-settings.ts b/src/core/app-store/server-settings.ts
@@ -14,6 +14,6 @@ export default class ServerSettings {
     }
 
     static get iceServers() {
-        return settings.iceServers.map(url => ({urls: url}));
+        return settings.iceServers;
     }
 }
diff --git a/src/layouts/website/Settings/ICEServer.tsx b/src/layouts/website/Settings/ICEServer.tsx
@@ -4,9 +4,10 @@ import {settings} from '../../../core/app-store/localstorage.ts';
 import {ICE_SERVERS} from '../../../config/const.ts';
 import useArrayState from 'use-array-state';
 import {BiTrash} from 'react-icons/bi';
+import {ChangeEvent} from 'react';
 
 export default function ICEServer() {
-    const [servers, setServers] = useArrayState<string>(settings.iceServers);
+    const [servers, setServers] = useArrayState<RTCIceServer>(settings.iceServers);
 
     useAsyncEffect(async () => {
         settings.iceServers = servers;
@@ -16,17 +17,30 @@ export default function ICEServer() {
         setServers.set(ICE_SERVERS);
     };
 
+    const updateServer = (index: number, key: keyof RTCIceServer) => {
+        return (event: ChangeEvent<HTMLInputElement>) => {
+            setServers.update(index, {
+                ...servers[index],
+                [key]: event.target.value
+            });
+        };
+    };
+
     return <FormControl mt={8}>
         <Box display="flex" justifyContent="space-between">
             <FormLabel>ICE servers</FormLabel>
             <Box display="flex" gap={2}>
-                <Button onClick={() => setServers.push('')} colorScheme="green" size="xs">Add</Button>
+                <Button onClick={() => setServers.push({urls: ''})} colorScheme="green" size="xs">Add</Button>
                 <Button onClick={restoreDefault} size="xs">Restore default</Button>
             </Box>
         </Box>
         {servers.map((server, i) =>
             <Box display="flex" justifyContent="space-between" alignItems="center" key={i} gap={2} mt={3}>
-                <Input value={server} onChange={e => setServers.update(i, e.target.value)}/>
+                <Box display="flex" gap={2}>
+                    <Input value={server.urls} onChange={updateServer(i, 'urls')} placeholder="url"/>
+                    <Input value={server.username} onChange={updateServer(i, 'username')} placeholder="username"/>
+                    <Input value={server.credential} onChange={updateServer(i, 'credential')} placeholder="credential"/>
+                </Box>
                 <Button onClick={() => setServers.remove(i)} colorScheme="red" fontSize={20}>
                     <BiTrash/>
                 </Button>