Allow kicking of players #68
Conversation
Players can only be kicked from the room at the beginning of the first round, before any clues have been answered.
|
Someone is attempting to deploy a commit to a Personal Account owned by @cmnord on Vercel. @cmnord first needs to authorize it. |
| @@ -17,6 +17,7 @@ enableMapSet(); | |||
|
|
|||
| export enum ActionType { | |||
| Join = "join", | |||
| Kick = "kick", | |||
There was a problem hiding this comment.
I considered calling this "Leave", but since a kick can be initiated by another player, I went with kick. I'm open to "Leave" if folks think that is better.
There was a problem hiding this comment.
I think "kick" is better, since anyone can kick anyone else. You can also kick yourself
| @@ -74,6 +74,7 @@ function stateToGameEngine( | |||
| */ | |||
| answeredBy, | |||
| answers: state.answers.get(clueKey) ?? new Map<string, string>(), | |||
| numAnswered: state.numAnswered, | |||
There was a problem hiding this comment.
The game engine did not give us numAnswered (the number of answered clues in the round) from the State, so I added code to thread it through.
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
There was a problem hiding this comment.
This looks great! I'll look at the preview branch for UI later, but looks good overall. Can you allow self-kicking? I can imagine if a player accidentally joins on two devices, they might equally want to kick device A from device B or self-kick from device A.
| method="DELETE" | ||
| action={`/room/${roomId}/player`} |
| key={i} | ||
| roomId={roomId} | ||
| player={p} | ||
| winning={p.score === maxScore} |
There was a problem hiding this comment.
alphabetize these and the fields in PlayerScore? that would make it easier to compare their props
| state: initialState, | ||
| actions: [PLAYER1_JOIN_ACTION, PLAYER2_JOIN_ACTION, PLAYER1_KICK_ACTION], | ||
| expectedState: produce(initialState, (draft) => { | ||
| draft.boardControl = PLAYER2.userId; |
| @@ -17,6 +17,7 @@ enableMapSet(); | |||
|
|
|||
| export enum ActionType { | |||
| Join = "join", | |||
| Kick = "kick", | |||
There was a problem hiding this comment.
I think "kick" is better, since anyone can kick anyone else. You can also kick yourself
| return; | ||
| } | ||
| // Don't allow the only player to be kicked. | ||
| if (draft.players.size === 1) { |
There was a problem hiding this comment.
nice catch, can you prevent this on the client side as well (once players can kick themselves)?
| (type === GameState.ShowBoard || type === GameState.PreviewRound) && | ||
| numAnswered === 0 && | ||
| round === 0; | ||
|
|
||
| return ( | ||
| <div className="flex flex-col gap-2 sm:grid sm:grid-cols-3"> | ||
| {yourPlayer ? ( |
| } | ||
| // If this player has board control, give it to the next player. | ||
| if (draft.boardControl === action.payload.userId) { | ||
| const players = Array.from(draft.players.keys()); |
There was a problem hiding this comment.
can you call this playerIds to disambiguate it from Map<string, Player>?
| @@ -28,7 +32,11 @@ export async function action({ request, params }: ActionFunctionArgs) { | |||
| } | |||
|
|
|||
| const type = | |||
| request.method === "POST" ? ActionType.Join : ActionType.ChangeName; | |||
There was a problem hiding this comment.
can you change this to a switch (request.method) now instead of multiple ternary operators? the cute/annoying way to do this without reassignment is something like:
const type = () => {
switch (request.method) {
case "POST":
return ActionType.Join;
// ...
}();
| {player.name} | ||
| </p> | ||
| <div className="ml-auto flex items-center gap-2"> | ||
| <button |
There was a problem hiding this comment.
oh, can you also add alt text to this that shows up on hover like Kick player ${player.name}
|
Closes #15. |
Sure, self-kick is a good idea. I think the UI may be a bit tricky, since we also have the name editing UI for yourself. 
Where do you think the kick button (currently an 'x') should go overall? Wherever we choose, I'd like to make it consistent for your player and the other ones. Here are some options I've thought of:
The main issue with (1) is that the kick button (an 'x') may look like it might just 'clear' the name input. My current inclination is (3), perhaps with the kick button a little lower, and maybe a red accent on highlight (so that it's clear this is a significant action). If we wanted to be as clear as possible, we could also make this button actually say 'Kick', though this is uglier (the button does at least disappear after the first question). |
cmnord
force-pushed
the
main
branch
2 times, most recently
from
0326ae3 to
f16dc1b
Compare
Adds a button that allows kicking of a player.
The kick button disappears after the first clue is answered.