---
# System prepended metadata

title: 흐름 구성요소

---

# 흐름 구성요소

## StreamingManager -> dispatch
```javascript=
// stream 상태 변경 
// null을 넘기면 close
// 출제자 변경시 새로운 출제자의 stream을 넘김
dispatch({type: 'setStream', payload: { stream }});
```

## GameManager -> dispatch
```javascript=
/**
 * 
 * 유저가 join/leave할 경우 view 업데이트
 * 유저가 Ready/ReleaseReady할 경우 view 업데이트
 * 특정 유저가 Streamer로 선정될 경우 view 업데이트
 * 
 * player = {
     * socketId
     * nickname,
     * score,
     * isReady,
     * type,
     * isLocalPlayer,
 * }
 **/
dispatch({type: 'setPlayerList', payload: { playerList }});

/**
 * quizCandidates = [
     * quizCandidate,
     * quizCandidate,
     * quizCandidate,
 * ]
 * 미니버스에 이벤트 등록 필요(단어 클릭 이벤트)
 * 빈 배열로 전달하면 후보 단어를 화면에서 삭제한다.
 * */
// 게임이 시작되면 후보 단어를 선택하고 view 업데이트 
dispatch({type: 'setQuizCandidates', payload: { quizCandidates }});

/**
 * quiz = string
 * */
// 출제자가 문제를 선택 하면 view 업데이트
dispatch({type: '
', payload: { quiz }});

// 1초마다 view의 카운트다운을 변경
// 혹은 120으로 reset
// 시간은 궁극적으로 서버로부터 받는다.
dispatch({type: 'setTimer', payload: { time }});

/**
 * matching - 게임에 들어가기 전 방의 매칭을 기다리는 상태
 * waiting - 게임전 모든 유저의 레디를 기다리는 상태
 * selecting - 출제자가 단어를 선택하는 시간
 * playing - 게임 중
 * result - 세트가 끝나고 누적 점수를 보여주는 상태
 * gameEnd - 방으로 돌아가기 버튼 가운데에 보여주기
 * 
 * waiting(unlimited) -> (ready) -> selecting(10s) -> playing(120s) -> result(5s) -> gameEnd
 * **/
 dispatch({type: 'setGameStatus', payload: { gameStatus }});
````


## ChatManager -> dispatch
```javascript=
/**
 * newChat = { socketId, nickname, chatContent, time }
 * 
**/
dispatch({type: 'addChat', payload: { newChat }});

dispatch({type: 'resetChatList'});

dispatch({type: 'speechBubble', payload: { newChat }});

```

---

```javascript=
# Tempalate
dispatch({type: '', payload: {}})
```


