Add requeue button to Ranked victory/defeat modal #3121
Merged
+168
−1
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Contributor
WalkthroughWin modal gains a ranked "Play Again" (requeue) button for 1v1 ranked games; clicking it navigates to "/?requeue". App startup detects Changes
Sequence DiagramsequenceDiagram
participant Player
participant WinModal
participant Main
participant Matchmaking
Player->>WinModal: Win game (1v1 ranked)
WinModal->>WinModal: detect RankedType.OneVOne\nset isRankedGame = true
WinModal->>Player: render "Play Again" button
Player->>WinModal: click "Play Again"
WinModal->>WinModal: navigate browser to "/?requeue" and hide modal
Main->>Main: on load detect "?requeue"\nstrip param from URL
Main->>Matchmaking: wait for `matchmaking-button` defined\ncall its `open()`
Matchmaking->>Player: open matchmaking UI
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~22 minutes Poem
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Contributor
There was a problem hiding this comment.
Pull request overview
This pull request adds a "Play Again" requeue button to the victory/defeat modal for Ranked 1v1 games, allowing players to quickly queue for another ranked match after their game ends.
Changes:
- Added requeue button to WinModal that navigates to homepage with a
?requeueparameter - Implemented URL parameter handler in Main.ts to automatically open matchmaking modal on page load
- Added translation key for the button text
- Added basic tests for the requeue functionality
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 4 comments.
| File | Description |
|---|---|
| src/client/graphics/layers/WinModal.ts | Adds isRankedGame state to detect ranked 1v1 games, renders purple "Play Again" button when applicable, and implements _handleRequeue method to navigate with requeue parameter |
| src/client/Main.ts | Adds URL parameter handler to detect ?requeue parameter and automatically open matchmaking modal with 500ms delay and fallback to button click |
| resources/lang/en.json | Adds "requeue": "Play Again" translation string to win_modal section |
| tests/client/graphics/layers/WinModal.test.ts | Adds tests for ranked game detection, navigation behavior, and URL parameter parsing (though tests don't actually test the WinModal component itself) |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Fix all issues with AI agents
In `@tests/client/graphics/layers/WinModal.test.ts`:
- Around line 1-3: Prettier formatting in the test file
tests/client/graphics/layers/WinModal.test.ts is failing CI; run the formatter
to fix whitespace and import ordering issues by executing npx prettier --write
tests/client/graphics/layers/WinModal.test.ts, then review the imports (e.g.,
the top-level imports of describe/expect/it/vi/beforeEach/afterEach and
RankedType) for any remaining style problems, stage the formatted file, and
commit the changes.
- Around line 29-34: The mock for crazyGamesSDK used in the test is missing the
gameplayStop function which WinModal.show() invokes; update the vi.mock export
for crazyGamesSDK to include gameplayStop: vi.fn() (matching the same shape as
happytime and requestAd) so tests calling WinModal.show() won't fail due to a
missing function.
🧹 Nitpick comments (2)
src/client/Main.ts (1)
758-777: Consider making the timeout delay configurable or adding a comment explaining the choice.The 500ms delay is a magic number. A brief comment explaining why this value was chosen (e.g., waiting for DOM/components to be ready) would help future maintainers.
Also, the fallback selector
"matchmaking-button button"assumes the internal DOM structure of the matchmaking button component. If that component changes, this fallback could silently fail.💡 Suggested improvements
// Handle requeue parameter for ranked matchmaking const searchParams = new URLSearchParams(window.location.search); if (searchParams.has("requeue")) { // Remove the requeue parameter from URL history.replaceState(null, "", "/"); - // Open matchmaking modal after a short delay to ensure page is ready + // Open matchmaking modal after a short delay to ensure components are rendered. + // 500ms chosen empirically to allow Lit components to complete their update cycle. setTimeout(() => { // Try to open the matchmaking modal directly first if (this.matchmakingModal) { this.matchmakingModal.open(); } else { - // Fallback: simulate a click on the matchmaking button - const matchmakingButton = document.querySelector( - "matchmaking-button button", - ) as HTMLButtonElement; - matchmakingButton?.click(); + // Fallback: find and click the matchmaking button element + const matchmakingButtonEl = document.querySelector( + "matchmaking-button", + ) as HTMLElement & { click?: () => void }; + if (matchmakingButtonEl) { + const innerButton = matchmakingButtonEl.querySelector("button") as HTMLButtonElement; + innerButton?.click(); + } } }, 500); }tests/client/graphics/layers/WinModal.test.ts (1)
61-103: Tests verify logic patterns but don't test actual component behavior.These tests re-implement the handler logic instead of invoking the actual WinModal methods. While they document the expected behavior, they won't catch bugs if the component implementation changes.
Consider adding tests that:
- Instantiate WinModal
- Set
gamemock with differentrankedTypevalues- Call
show()and verifyisRankedGamestate- Verify button visibility based on state
💡 Example of a more integrated test approach
describe("WinModal component", () => { it("should set isRankedGame to true for ranked 1v1", async () => { const modal = new WinModal(); modal.game = { config: () => ({ gameConfig: () => ({ rankedType: RankedType.OneVOne }), }), // ... other required mocks } as any; await modal.show(); expect(modal["isRankedGame"]).toBe(true); }); });
github-project-automation
bot
moved this from Triage
to Development
in OpenFront Release Management
- Replace 500ms setTimeout with customElements.whenDefined() - Add console.warn when matchmaking button not found - Remove dead matchmakingModal code path (always null) - Add gameplayStop to CrazyGamesSDK mock - Fix Prettier formatting in test file
Contributor
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Fix all issues with AI agents
In `@src/client/Main.ts`:
- Around line 759-776: The requeue path bypasses the button's username
validation and clobbers other URL params/hash; instead of calling
MatchmakingButton.open() directly and history.replaceState(null, "", "/"),
remove only the "requeue" key from the URLSearchParams and reconstruct the URL
as location.pathname + (params.toString() ? "?" + params.toString() : "") +
location.hash then call history.replaceState(null, "", newUrl); and, to reuse
the button's validation, trigger the existing button handler (e.g., dispatch a
click or call the same validation method on the MatchmakingButton) rather than
invoking open() directly so invalid usernames are blocked the same way as the
normal button.
- Changed open() from private to public in MatchmakingButton - Requeue triggers button click to go through username validation - Only removes 'requeue' param, preserves other URL params and hash - Addresses PR review about fragile selector and validation bypass
Skigim
force-pushed
the
feature/ranked-requeue-button
branch
from
7775b1a to
60c34f1
Compare
evanpelle
approved these changes
Feb 7, 2026
github-project-automation
bot
moved this from Triage
to Final Review
in OpenFront Release Management
github-project-automation
bot
moved this from Final Review
to Complete
in OpenFront Release Management
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description:
Adds a "Play Again" requeue button to the victory/defeat modal for Ranked 1v1 games. When clicked, it navigates the player back to the homepage and automatically opens the matchmaking modal to queue for another ranked match.
Changes:
Note: temporarily set isRanked flag to true to get the modal to pop in a solo match on dev server and confirmed that ?requeue URL parameter called _handleRequeue() correctly, which opened the sign in process since actually signing in and queuing for a ranked match isn't possible on dev server.
Please complete the following:
Please put your Discord username so you can be contacted if a bug or regression is found:
skigim