127 | {controlVisible && (
128 |
129 |
130 |
135 | {state.id}
136 |
137 |
138 |
139 | )}
140 |
141 | {stream ? (
142 |
143 | ) : (
144 |
154 | no stream available
155 |
156 | )}
157 |
158 | {controlVisible && (
159 |
160 | {state.hostStream ? (
161 |
162 |
163 |
164 |
165 |
166 | ) : (
167 |
168 |
169 |
170 |
171 |
172 | )}
173 |
174 |
178 | Member List
179 | {state.users.map((user) => (
180 |
181 | {user.name} {flags(user)}
182 |
183 | ))}
184 |
185 | }
186 | arrow>
187 |
221 | {state.clientStreams
222 | .filter(({id}) => id !== selectedStream)
223 | .map((client) => {
224 | return (
225 |
setSelectedStream(client.id)}>
229 |
234 |
239 | {state.users.find(({id}) => client.peer_id === id)?.name ??
240 | 'unknown'}
241 |
242 |
243 | );
244 | })}
245 | {state.hostStream && selectedStream !== HostStream && (
246 |
setSelectedStream(HostStream)}>
250 |
251 |
256 | You
257 |
258 |
259 | )}
260 |
261 |
262 |