frontend_max_speakers

#15
by mduppes - opened
streaming-react-app/src/StreamingInterface.tsx CHANGED
@@ -152,6 +152,7 @@ export default function StreamingInterface() {
152
  useState<StreamingStatus>('stopped');
153
 
154
  const isStreamConfiguredRef = useRef<boolean>(false);
 
155
 
156
  const [outputMode, setOutputMode] = useState<SupportedOutputMode>('s2s&t');
157
  const [inputSource, setInputSource] =
@@ -308,6 +309,7 @@ export default function StreamingInterface() {
308
  console.log('[configureStreamAsync] sending config', config);
309
 
310
  socket.emit('configure_stream', config, (statusObject) => {
 
311
  if (statusObject.status === 'ok') {
312
  isStreamConfiguredRef.current = true;
313
  console.debug(
@@ -755,16 +757,16 @@ export default function StreamingInterface() {
755
  <div className="header-container-sra">
756
  <div>
757
  <Typography variant="body2" sx={{color: '#65676B'}}>
758
- Welcome! This space is locked, please duplicate the space <a target="_blank" rel="noopener noreferrer" href="https://huggingface.co/spaces/facebook/seamless-streaming?duplicate=true">here</a>. Unset the environment variable `LOCK_SERVER_COMPLETELY`.
759
  <br/>
760
- In your duplicated space, join a room as speaker or listener (or both), and share the
761
  room code to invite listeners.
762
  <br/>
763
  Check out the seamless_communication <a target="_blank" rel="noopener noreferrer" href="https://github.com/facebookresearch/seamless_communication/tree/main">README</a> for more information.
764
  <br/>
765
  SeamlessStreaming model is a research model and is not released
766
- for production deployment. The streaming quality is closely
767
- related to proper VAD segmentation. It works best if you pause
768
  every couple of sentences, or you may wish adjust the VAD threshold
769
  in the model config. The real-time performance will degrade
770
  if you try streaming multiple speakers at the same time.
@@ -1114,7 +1116,13 @@ export default function StreamingInterface() {
1114
  </Alert>
1115
  </div>
1116
  )}
1117
-
 
 
 
 
 
 
1118
  {serverState != null &&
1119
  serverState.totalActiveTranscoders >=
1120
  TOTAL_ACTIVE_TRANSCODER_WARNING_THRESHOLD && (
 
152
  useState<StreamingStatus>('stopped');
153
 
154
  const isStreamConfiguredRef = useRef<boolean>(false);
155
+ const [hasMaxSpeakers, setHasMaxSpeakers] = useState<boolean>(false);
156
 
157
  const [outputMode, setOutputMode] = useState<SupportedOutputMode>('s2s&t');
158
  const [inputSource, setInputSource] =
 
309
  console.log('[configureStreamAsync] sending config', config);
310
 
311
  socket.emit('configure_stream', config, (statusObject) => {
312
+ setHasMaxSpeakers(statusObject.message === 'max_speakers')
313
  if (statusObject.status === 'ok') {
314
  isStreamConfiguredRef.current = true;
315
  console.debug(
 
757
  <div className="header-container-sra">
758
  <div>
759
  <Typography variant="body2" sx={{color: '#65676B'}}>
760
+ Welcome! This space is locked to one speaker at a time, please duplicate the space <a target="_blank" rel="noopener noreferrer" href="https://huggingface.co/spaces/facebook/seamless-streaming?duplicate=true">here</a>. Unset the environment variable `LOCK_SERVER_COMPLETELY`.
761
  <br/>
762
+ In your duplicated space, join a room as speaker or listener (or both), and share the
763
  room code to invite listeners.
764
  <br/>
765
  Check out the seamless_communication <a target="_blank" rel="noopener noreferrer" href="https://github.com/facebookresearch/seamless_communication/tree/main">README</a> for more information.
766
  <br/>
767
  SeamlessStreaming model is a research model and is not released
768
+ for production deployment. The streaming quality is closely
769
+ related to proper VAD segmentation. It works best if you pause
770
  every couple of sentences, or you may wish adjust the VAD threshold
771
  in the model config. The real-time performance will degrade
772
  if you try streaming multiple speakers at the same time.
 
1116
  </Alert>
1117
  </div>
1118
  )}
1119
+ {serverState != null && hasMaxSpeakers && (
1120
+ <div>
1121
+ <Alert severity="error">
1122
+ {`Maximum number of speakers reached. Please try again at a later time.`}
1123
+ </Alert>
1124
+ </div>
1125
+ )}
1126
  {serverState != null &&
1127
  serverState.totalActiveTranscoders >=
1128
  TOTAL_ACTIVE_TRANSCODER_WARNING_THRESHOLD && (