@@ -2,23 +2,37 @@ import * as React from 'react';
22import { useState , useEffect } from 'react' ;
33import type { NativeStackScreenProps } from '@react-navigation/native-stack' ;
44
5- import { StyleSheet , View , TextInput , Text , Button } from 'react-native' ;
5+ import {
6+ StyleSheet ,
7+ View ,
8+ TextInput ,
9+ Text ,
10+ Button ,
11+ Switch ,
12+ } from 'react-native' ;
613import type { RootStackParamList } from './App' ;
714import { useTheme } from '@react-navigation/native' ;
815import AsyncStorage from '@react-native-async-storage/async-storage' ;
916
10- const DEFAULT_URL = 'wss://www.example.com' ;
11- const DEFAULT_TOKEN = '' ;
17+ const DEFAULT_URL = 'ws://192.168.11.3:7880' ;
18+ const DEFAULT_TOKEN =
19+ 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE3MzU3ODc4OTYsImlzcyI6IkFQSVRMV3JLOHRid3I0NyIsIm5iZiI6MTczMzE5NTg5Niwic3ViIjoicGhvbmUiLCJ2aWRlbyI6eyJyb29tIjoibXlyb29tIiwicm9vbUpvaW4iOnRydWV9fQ.2ucoFK_t1rX8cnUVdx_7nS-TOGv_2Io6uNEw11kPs3M' ;
20+ const DEFAULT_E2EE = false ;
21+ const DEFAULT_E2EE_KEY = '' ;
1222
1323const URL_KEY = 'url' ;
1424const TOKEN_KEY = 'token' ;
25+ const E2EE_KEY = 'e2eeEnabled' ;
26+ const E2EE_SHARED_KEY_KEY = 'e2eeSharedKey' ;
1527
1628export const PreJoinPage = ( {
1729 navigation,
1830} : NativeStackScreenProps < RootStackParamList , 'PreJoinPage' > ) => {
1931 const [ url , setUrl ] = useState ( DEFAULT_URL ) ;
2032 const [ token , setToken ] = useState ( DEFAULT_TOKEN ) ;
21-
33+ const [ e2eeEnabled , setE2EE ] = useState ( DEFAULT_E2EE ) ;
34+ const [ e2eeKey , setE2EEKey ] = useState ( DEFAULT_E2EE_KEY ) ;
35+ const toggleE2EE = ( ) => setE2EE ( ( previousState ) => ! previousState ) ;
2236 useEffect ( ( ) => {
2337 AsyncStorage . getItem ( URL_KEY ) . then ( ( value ) => {
2438 if ( value ) {
@@ -31,14 +45,44 @@ export const PreJoinPage = ({
3145 setToken ( value ) ;
3246 }
3347 } ) ;
48+ AsyncStorage . getItem ( E2EE_KEY ) . then ( ( value ) => {
49+ if ( value ) {
50+ setE2EE ( value === 'true' ) ;
51+ }
52+ } ) ;
53+ AsyncStorage . getItem ( E2EE_SHARED_KEY_KEY ) . then ( ( value ) => {
54+ if ( value ) {
55+ setE2EEKey ( value ) ;
56+ }
57+ } ) ;
3458 } , [ ] ) ;
3559
3660 const { colors } = useTheme ( ) ;
3761
38- let saveValues = ( saveUrl : string , saveToken : string ) => {
62+ let e2eeKeyInputTitle = < Text style = { { color : colors . text } } > E2EE Key</ Text > ;
63+ let e2eeKeyInput = (
64+ < TextInput
65+ style = { {
66+ color : colors . text ,
67+ borderColor : colors . border ,
68+ ...styles . input ,
69+ } }
70+ onChangeText = { setE2EEKey }
71+ value = { e2eeKey }
72+ />
73+ ) ;
74+ let saveValues = (
75+ saveUrl : string ,
76+ saveToken : string ,
77+ saveE2EE : boolean ,
78+ saveE2EEKey : string
79+ ) => {
3980 AsyncStorage . setItem ( URL_KEY , saveUrl ) ;
4081 AsyncStorage . setItem ( TOKEN_KEY , saveToken ) ;
82+ AsyncStorage . setItem ( E2EE_KEY , saveE2EE . toString ( ) ) ;
83+ AsyncStorage . setItem ( E2EE_SHARED_KEY_KEY , saveE2EEKey ) ;
4184 } ;
85+
4286 return (
4387 < View style = { styles . container } >
4488 < Text style = { { color : colors . text } } > URL</ Text >
@@ -63,10 +107,25 @@ export const PreJoinPage = ({
63107 value = { token }
64108 />
65109
110+ < Text style = { { color : colors . text } } > Enable E2EE</ Text >
111+ < Switch onValueChange = { toggleE2EE } value = { e2eeEnabled } />
112+
113+ < View style = { styles . spacer } />
114+
115+ { e2eeEnabled ? e2eeKeyInputTitle : null }
116+ { e2eeEnabled ? e2eeKeyInput : null }
117+
118+ < View style = { styles . spacer } />
119+
66120 < Button
67121 title = "Connect"
68122 onPress = { ( ) => {
69- navigation . push ( 'RoomPage' , { url : url , token : token } ) ;
123+ navigation . push ( 'RoomPage' , {
124+ url,
125+ token,
126+ e2ee : e2eeEnabled ,
127+ e2eeKey,
128+ } ) ;
70129 } }
71130 />
72131
@@ -75,7 +134,7 @@ export const PreJoinPage = ({
75134 < Button
76135 title = "Save Values"
77136 onPress = { ( ) => {
78- saveValues ( url , token ) ;
137+ saveValues ( url , token , e2eeEnabled , e2eeKey ) ;
79138 } }
80139 />
81140
@@ -84,9 +143,16 @@ export const PreJoinPage = ({
84143 < Button
85144 title = "Reset Values"
86145 onPress = { ( ) => {
87- saveValues ( DEFAULT_URL , DEFAULT_TOKEN ) ;
146+ saveValues (
147+ DEFAULT_URL ,
148+ DEFAULT_TOKEN ,
149+ DEFAULT_E2EE ,
150+ DEFAULT_E2EE_KEY
151+ ) ;
88152 setUrl ( DEFAULT_URL ) ;
89153 setToken ( DEFAULT_TOKEN ) ;
154+ setE2EE ( DEFAULT_E2EE ) ;
155+ setE2EEKey ( DEFAULT_E2EE_KEY ) ;
90156 } }
91157 />
92158 </ View >
@@ -105,7 +171,7 @@ const styles = StyleSheet.create({
105171 marginVertical : 20 ,
106172 } ,
107173 input : {
108- width : '100 %' ,
174+ width : '90 %' ,
109175 height : 40 ,
110176 margin : 12 ,
111177 borderWidth : 1 ,
0 commit comments