From 37fd22b58b86521a96da6a0ab984c0f8a51f99fc Mon Sep 17 00:00:00 2001 From: Roland Osborne Date: Thu, 23 Jan 2025 16:58:20 -0800 Subject: [PATCH] adding webrtc calls --- app/client/mobile/src/calling/Calling.tsx | 32 ++++++++++++++++--- .../mobile/src/calling/useCalling.hook.ts | 23 +++++++++++-- app/sdk/src/contact.ts | 1 + app/sdk/src/link.ts | 10 +++++- app/sdk/src/net/addContactRing.ts | 6 ++-- app/sdk/src/ring.ts | 1 + 6 files changed, 63 insertions(+), 10 deletions(-) diff --git a/app/client/mobile/src/calling/Calling.tsx b/app/client/mobile/src/calling/Calling.tsx index 39417e3a..732d04dd 100644 --- a/app/client/mobile/src/calling/Calling.tsx +++ b/app/client/mobile/src/calling/Calling.tsx @@ -1,22 +1,46 @@ -import React, { useEffect } from 'react'; +import React, { useEffect, useState } from 'react'; import { SafeAreaView, Modal, ScrollView, View } from 'react-native'; import { Surface, Icon, Divider, Button, IconButton, Text, TextInput} from 'react-native-paper'; import {styles} from './Calling.styled'; import {useCalling} from './useCalling.hook'; import {BlurView} from '@react-native-community/blur'; +import { Confirm } from '../confirm/Confirm'; export function Calling({ callCard }: { callCard: string }) { const { state, actions } = useCalling(); + const [alert, setAlert] = useState(false); + + const call = async (cardId: string) => { + try { + await actions.call(cardId); + } catch (err) { + console.log(err); + setAlert(true); + } + } + + const alertParams = { + title: state.strings.operationFailed, + prompt: state.strings.tryAgain, + cancel: { + label: state.strings.close, + action: () => { + setAlert(false); + }, + }, + }; useEffect(() => { - if (callCard.cardId) { - actions.call(callCard.cardId); + const { cardId } = callCard; + if (cardId) { + call(cardId); } }, [callCard]); return ( - 0) ? styles.active : styles.inactive}> + 0 || alert) ? styles.active : styles.inactive}> + ); } diff --git a/app/client/mobile/src/calling/useCalling.hook.ts b/app/client/mobile/src/calling/useCalling.hook.ts index cda63ebe..2fc2919e 100644 --- a/app/client/mobile/src/calling/useCalling.hook.ts +++ b/app/client/mobile/src/calling/useCalling.hook.ts @@ -1,11 +1,15 @@ import { useState, useContext, useEffect } from 'react' +import { DisplayContext } from '../context/DisplayContext'; import { AppContext } from '../context/AppContext' import { ContextType } from '../context/ContextType' export function useCalling() { - const app = useContext(AppContext) as ContextType + const app = useContext(AppContext) as ContextType; + const display = useContext(DisplayContext) as ContextType; const [state, setState] = useState({ + strings: {}, ringing: [], + cards: [], }) // eslint-disable-next-line @typescript-eslint/no-explicit-any @@ -13,22 +17,35 @@ export function useCalling() { setState((s) => ({ ...s, ...value })) } + useEffect(() => { + const { strings } = display.state; + updateState({ strings }); + }, [display.state]); + useEffect(() => { if (app.state.session) { const setRinging = (ringing: { cardId: string, callId: string }[]) => { updateState({ ringing }); } + const setContacts = (cards: Card[]) => { + updateState({ cards }); + } const ring = app.state.session.getRing(); ring.addRingingListener(setRinging); + const contact = app.state.session.getContact(); + contact.addCardListener(setContacts); return () => { ring.removeRingingListener(setRinging); + contact.removeCardListener(setContacts); } } }, [app.state.session]); const actions = { - call: (cardId: string) => { - console.log('calling: ', cardId); + call: async (cardId: string) => { + const contact = app.state.session.getContact(); + const link = await contact.callCard(cardId); + console.log(link); }, } diff --git a/app/sdk/src/contact.ts b/app/sdk/src/contact.ts index 7c7ed92a..c1c6873f 100644 --- a/app/sdk/src/contact.ts +++ b/app/sdk/src/contact.ts @@ -854,6 +854,7 @@ export class ContactModule implements Contact { } const { profile, detail } = entry.item; const link = new LinkModule(this.log); +console.log("LINK CALL"); await link.call(node, secure, token, cardId, profile.node, detail.token); return link; } diff --git a/app/sdk/src/link.ts b/app/sdk/src/link.ts index 100fe855..ac38c6e8 100644 --- a/app/sdk/src/link.ts +++ b/app/sdk/src/link.ts @@ -1,4 +1,9 @@ import type { Link, Logging } from './api'; +import { addCall } from './net/addCall'; +import { removeCall } from './net/removeCall'; +import { removeContactCall } from './net/removeContactCall'; +import { addContactRing } from './net/addContactRing'; +import { keepCall } from './net/keepCall'; const RETRY_INTERVAL = 1000; const PING_INTERVAL = 5000; @@ -45,14 +50,17 @@ export class LinkModule implements Link { } public async call(node: string, secure: boolean, token: string, cardId: string, contactNode: string, contactToken: string) { +console.log('add call'); const call = await addCall(node, secure, token, cardId); - this.cleanup = () => { removeCall(node, secure, token, call.id }; + this.cleanup = () => { removeCall(node, secure, token, call.id) }; +console.log('add ring', contactNode); const { id, keepAlive, calleeToken, callerToken, ice } = call; const insecure = /^(?!0)(?!.*\.$)((1?\d?\d|25[0-5]|2[0-4]\d)(\.|:\d+$|$)){4}$/.test(contactNode); const ring = { index: 0, callId: id, calleeToken, ice }; await addContactRing(contactNode, !insecure, contactToken, ring); +console.log('go'); this.aliveInterval = setInterval(async () => { try { await keepCall(node, secure, token, id); diff --git a/app/sdk/src/net/addContactRing.ts b/app/sdk/src/net/addContactRing.ts index bf5eef60..91d4b9b6 100644 --- a/app/sdk/src/net/addContactRing.ts +++ b/app/sdk/src/net/addContactRing.ts @@ -1,8 +1,10 @@ import { checkResponse, fetchWithTimeout } from './fetchUtil'; import { Ringing } from '../entities'; -export async function addContactRing(server: string, secure: boolean, token: string, ringing: Ringing): { - const endpoint = `http${secure ? 's' : '' }://${server}/talk/rings/?contact=${token}'; +export async function addContactRing(server: string, secure: boolean, token: string, ringing: Ringing) { + const endpoint = `http${secure ? 's' : '' }://${server}/talk/rings/?contact=${token}`; +console.log(endpoint); + const { status } = await fetchWithTimeout(endpoint, { method: 'POST', body: JSON.stringify(ringing) }); checkResponse(status); } diff --git a/app/sdk/src/ring.ts b/app/sdk/src/ring.ts index f543eeb1..3de39ae2 100644 --- a/app/sdk/src/ring.ts +++ b/app/sdk/src/ring.ts @@ -2,6 +2,7 @@ import { EventEmitter } from 'eventemitter3'; import { LinkModule } from './link'; import type { Ring, Link, Logging } from './api'; import type { Call } from './types'; +import { removeContactCall } from './net/removeContactCall'; const EXPIRES = 6000;