-
-
Notifications
You must be signed in to change notification settings - Fork 254
Improve sign-in panel and modal in Boilerplate (#10969) #10973
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Improve sign-in panel and modal in Boilerplate (#10969) #10973
Conversation
WalkthroughThe changes update the SignIn modal and panel in the Boilerplate template. The modal layout is restructured for improved styling and a draggable header is added. Enum values in the sign-in logic are renamed, and new localized messages about automatic signup are introduced. Associated CSS and resource files are updated accordingly. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant SignInModal
participant SignInPanel
participant SignInModalService
participant Resources
User->>SignInModalService: Initiate SignIn()
SignInModalService->>SignInModal: Show modal (Draggable, header-stack)
SignInModal->>SignInPanel: Render panel (Password/Otp)
SignInPanel->>Resources: Fetch SignInPasswordMessage1/2
SignInPanel-->>SignInModal: Display messages and controls
User->>SignInPanel: Interact (enter credentials, switch type)
SignInPanel->>SignInPanel: Clean model fields as needed
Assessment against linked issues
Poem
✨ Finishing Touches
🧪 Generate Unit Tests
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 1
🧹 Nitpick comments (3)
src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInPanelType.cs (1)
3-6: Finish XML doc sentence + consider acronym casing.
- The
<summary>sentence lacks a terminating period – minor, yet consistent documentation style helps tooling and human readers.Otp/OTP: elsewhere in the codebase (e.g., resource strings) the acronym is written in upper-case. Renaming the member toOTPwould align with common .NET casing rules for acronyms ≥ 3 chars and improve discoverability.-/// The layout type of the SignIn panel UI. Check out <see cref="SignInModalService"/> for more details +/// The layout type of the Sign-in panel UI. See <see cref="SignInModalService"/> for more details.src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInModal.razor.scss (1)
24-32: Minor SCSS improvement – rely on CSS logical padding for RTL.When supporting RTL languages,
padding-inline-endis great, but the.stackblock still uses physicalpadding: 3remwhich applies left/right equally. Consider logical shorthand:-.stack { - padding: 3rem; - padding-top: 0; +.stack { + padding-block-start: 0; + padding-block: 0 3rem; + padding-inline: 3rem; }Not critical, but keeps the stylesheet consistently logical-direction aware.
src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInPanel.razor (1)
100-114: Minor layout nit – consider explicit vertical padding instead of empty<br />Using a
<br />for spacing inside aBitStackis brittle and conflicts with responsive typography.
Leverage the stack’sGapor a CSS class instead.-<br /> -<BitText Typography="BitTypography.Body2" Align="BitTextAlign.Center"> +<BitStack Gap="0.5rem" Align="BitAlignment.Center"> + <BitText Typography="BitTypography.Body2" Align="BitTextAlign.Center"> <b>@Localizer[nameof(AppStrings.SignInPasswordMessage1)]</b> - <br /> - @Localizer[nameof(AppStrings.SignInPasswordMessage2)] -</BitText> + </BitText> + <BitText Typography="BitTypography.Body2" Align="BitTextAlign.Center"> + @Localizer[nameof(AppStrings.SignInPasswordMessage2)] + </BitText> +</BitStack>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
Knowledge Base: Disabled due to Reviews > Disable Knowledge Base setting
📒 Files selected for processing (8)
src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInModal.razor(1 hunks)src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInModal.razor.scss(1 hunks)src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInPanel.razor(2 hunks)src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInPanel.razor.cs(1 hunks)src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInPanelType.cs(1 hunks)src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Services/SignInModalService.cs(1 hunks)src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Resources/AppStrings.fa.resx(5 hunks)src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Resources/AppStrings.resx(6 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: build and test
🔇 Additional comments (9)
src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInPanelType.cs (1)
13-21:✅ Verification successful
Ensure no lingering references to old enum names.
The rename from
PasswordOnly→PasswordandOtpOnly→Otpcompiles here, but stale usages will lead to build errors in less-obvious places (e.g., string-based serialization, tests, docs).
🏁 Script executed:
#!/bin/bash # Fail the build early if any old enum names still exist. rg -n --no-heading -e 'PasswordOnly' -e 'OtpOnly'Length of output: 47
No lingering
PasswordOnlyorOtpOnlyreferences found
A repository-wide ripgrep search (rg -n -e 'PasswordOnly' -e 'OtpOnly') returned no matches. The enum rename is safe to merge.src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Services/SignInModalService.cs (1)
40-43: 👍 Modal is now draggable – check handle availability on all breakpoints.
Draggable = truewithDragElementSelector = ".header-stack"is clean and avoids accidental drags. Confirm that.header-stackremains rendered (and visible) on very small viewports; otherwise users might lose the ability to move the dialog off-screen.src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInModal.razor (1)
13-16: Default panel changed to OTP mode – is that intentional?
SignInPanelType="SignInPanelType.Otp"removes the password path from the modal. Double-check UX requirements; if the intent was to keep parity with the old “OtpOnly” behaviour this is fine, but if users should still default to full/password mode this line needs updating.src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInPanel.razor.cs (1)
377-386: Enum rename integrated correctly – logic untouched.Switching to
OtpandPasswordkeeps behaviour identical and compiles. No further action.src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Resources/AppStrings.fa.resx (1)
1340-1345: New Persian strings added – looks goodKeys
SignInPasswordMessage1&SignInPasswordMessage2are present and the wording is clear.
No further issues spotted.src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Resources/AppStrings.resx (1)
1346-1351: English resources correctly updatedThe two new keys match those referenced in
SignInPanel.razor.
Everything is in sync with the Persian file.src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInPanel.razor (3)
102-107: Property name ambiguity – confirmAlignmentis intentionalOther stacks in this component use
HorizontalAlign.
Double-check thatAlignmentis a valid parameter onBitStack; otherwise this will fail at compile-time.
117-135: Toggle links updated – UX flows retainedSwitching between
Password↔Otpnow works with the new enum names.
No issues found.
61-80:✅ Verification successful
Guard covers both
FullandPasswordpanel types – compile-time safety checkThe updated
ispattern correctly replaces the oldPasswordOnly.
Please run a solution-wide search to ensure no lingering references to the removed enum members remain.
🏁 Script executed:
#!/bin/bash # Verify nothing still references the old enum values. rg -n "PasswordOnly|OtpOnly"Length of output: 30
Guard covers both
FullandPasswordpanel types – compile-time safety checkThe updated
ispattern correctly replaces the removedPasswordOnly. A solution-wide grep (rg -n 'PasswordOnly|OtpOnly') returned no matches, confirming there are no lingering references to the old enum members. Safe to merge.
closes #10969
Summary by CodeRabbit
New Features
Improvements
Documentation
Style
Chores