Skip to content

Conversation

@ysmoradi
Copy link
Member

@ysmoradi ysmoradi commented Jul 2, 2025

closes #11038

Summary by CodeRabbit

  • New Features

    • Added Facebook as a supported social login provider, including a Facebook login button and icon.
    • Facebook authentication configuration options are now available in settings files.
    • Facebook sign-in button text is now localized in both English and Persian.
  • Style

    • The sign-in form now maintains a fixed width on all screen sizes.

@ysmoradi ysmoradi requested a review from Copilot July 2, 2025 11:12
@coderabbitai
Copy link

coderabbitai bot commented Jul 2, 2025

Walkthrough

The changes introduce Facebook social sign-in support to the Bit Boilerplate. This includes UI components for a Facebook login button and icon, backend configuration for Facebook authentication, necessary package references, and updated localization and configuration files to support the new provider.

Changes

Files / Group Change Summary
.../Components/Pages/Identity/Components/FacebookIcon.razor Added new FacebookIcon Razor component rendering the Facebook SVG logo.
.../Components/Pages/Identity/Components/SocialRow.razor
.../SocialRow.razor.cs
Added Facebook social login button with handler to SocialRow component.
.../SignIn/SignInModal.razor.scss Removed media query for form width, making width fixed at 304px for all screen sizes.
.../Directory.Packages.props
.../Boilerplate.Server.Api.csproj
Added Microsoft.AspNetCore.Authentication.Facebook package reference/version.
.../Boilerplate.Server.Api/Program.Services.cs Added Facebook authentication configuration in AddIdentity method.
.../Boilerplate.Server.Api/appsettings.json
.../Server.Web/appsettings.json
Added Facebook authentication configuration section (AppId, AppSecret) to appsettings.json files.
.../Resources/AppStrings.resx
.../Resources/AppStrings.fa.resx
Added FacebookSignInButtonText resource string in English and Persian.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant ClientApp
    participant ServerApi
    participant Facebook

    User->>ClientApp: Clicks "Sign in with Facebook"
    ClientApp->>ServerApi: Initiates Facebook OAuth flow
    ServerApi->>Facebook: Redirects for authentication
    Facebook->>User: Prompts for login/consent
    Facebook->>ServerApi: Returns authentication response
    ServerApi->>ClientApp: Issues authentication token/session
    ClientApp->>User: User is signed in
Loading

Assessment against linked issues

Objective Addressed Explanation
Add Facebook social sign-in support in Bit Boilerplate (#11038)
Update UI to include Facebook login button and icon (#11038)
Add backend configuration and package references for Facebook authentication (#11038)
Add localization and configuration entries for Facebook sign-in (#11038)

Poem

A new blue button joins the row,
With Facebook’s “f” it’s sure to show.
Now users sign in, swift and neat,
With OAuth magic, can’t be beat!
From backend code to frontend flair,
Social logins—rabbits everywhere!
🐇✨


📜 Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
Knowledge Base: Disabled due to Reviews > Disable Knowledge Base setting

📥 Commits

Reviewing files that changed from the base of the PR and between df61828 and f1cb7d8.

📒 Files selected for processing (11)
  • src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/Components/FacebookIcon.razor (1 hunks)
  • src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/Components/SocialRow.razor (1 hunks)
  • src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/Components/SocialRow.razor.cs (1 hunks)
  • src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInModal.razor.scss (0 hunks)
  • src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props (1 hunks)
  • src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Boilerplate.Server.Api.csproj (1 hunks)
  • src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs (1 hunks)
  • src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/appsettings.json (2 hunks)
  • src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json (1 hunks)
  • src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Resources/AppStrings.fa.resx (1 hunks)
  • src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Resources/AppStrings.resx (1 hunks)
💤 Files with no reviewable changes (1)
  • src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/SignIn/SignInModal.razor.scss
🧰 Additional context used
🪛 Biome (1.9.4)
src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/appsettings.json

[error] 5-5: End of file expected

Use an array for a sequence of values: [1, 2]

(parse)


[error] 5-5: End of file expected

Use an array for a sequence of values: [1, 2]

(parse)


[error] 5-5: End of file expected

Use an array for a sequence of values: [1, 2]

(parse)


[error] 5-5: End of file expected

Use an array for a sequence of values: [1, 2]

(parse)

⏰ Context from checks skipped due to timeout of 90000ms (1)
  • GitHub Check: build and test
🔇 Additional comments (11)
src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props (1)

110-110: LGTM! Package addition follows established patterns.

The Facebook authentication package is correctly added with consistent versioning (9.0.6) and logical positioning among other social authentication providers.

src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/Components/SocialRow.razor.cs (1)

35-35: LGTM! Facebook handler implementation is consistent.

The method follows the exact pattern established by other social provider handlers and correctly invokes the callback with the "Facebook" identifier.

src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json (1)

111-114: LGTM! Facebook configuration follows established patterns.

The configuration structure is consistent with other social authentication providers and correctly uses null values as secure defaults for the template.

src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Boilerplate.Server.Api.csproj (1)

56-56: LGTM! Package reference correctly added.

The Facebook authentication package reference is properly positioned and follows the central package management pattern by omitting the version attribute.

src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Resources/AppStrings.resx (1)

621-623: LGTM! Resource string follows established localization patterns.

The Facebook sign-in button text is correctly added with consistent naming convention and appropriate positioning among other social provider strings. The AI summary indicates corresponding localization was also added, ensuring proper internationalization support.

src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Resources/AppStrings.fa.resx (1)

615-616: LGTM! Persian localization for Facebook sign-in added correctly.

The Persian translation "ورود با فیسبوک" correctly translates to "Sign in with Facebook" and follows the established pattern of other social provider localizations.

src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/Components/FacebookIcon.razor (1)

1-5: LGTM! Facebook icon component follows established patterns.

The component correctly inherits from StaticComponent, uses proper SVG dimensions (34x34), and utilizes CSS custom properties for theming consistency. The implementation aligns with other social provider icon components in the codebase.

For security assurance, consider verifying that the SVG path data represents the legitimate Facebook logo.

src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/Components/SocialRow.razor (1)

50-55: LGTM! Facebook social login integration follows established patterns.

The conditional block for Facebook authentication is implemented consistently with other social providers:

  • Proper conditional check using supportedProviders.Contains("Facebook")
  • Correct use of SocialButton component with required properties
  • Integration of the new FacebookIcon component
  • Proper localization using AppStrings.FacebookSignInButtonText
  • Consistent event handling with WrapHandled(HandleFacebook)

The implementation maintains consistency with the existing codebase architecture.

src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/appsettings.json (2)

5-5: LGTM! Helpful comment addition for dev tunnels scenario.

The updated comment provides useful context about Visual Studio dev tunnels, making the configuration documentation more comprehensive.


166-170: LGTM! Facebook authentication configuration follows established patterns.

The Facebook authentication configuration is properly structured with:

  • Reference to official Microsoft documentation
  • Proper null placeholders for AppId and AppSecret
  • Consistent naming and structure with other social providers

The configuration provides a clear template for developers to enable Facebook authentication.

src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs (1)

611-618: LGTM! Facebook authentication configuration implemented correctly.

The Facebook authentication setup follows the established pattern used by other social providers:

  • Proper conditional check using string.IsNullOrEmpty(configuration["Authentication:Facebook:AppId"]) is false
  • Correct configuration of SignInScheme as IdentityConstants.ExternalScheme
  • Appropriate configuration binding from the "Authentication:Facebook" section

The implementation maintains consistency with the existing authentication provider architecture and integrates seamlessly with the identity system.

✨ Finishing Touches
  • 📝 Generate Docstrings
🧪 Generate Unit Tests
  • Create PR with Unit Tests
  • Post Copyable Unit Tests in a Comment

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.

❤️ Share
🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Explain this complex logic.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai explain this code block.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read src/utils.ts and explain its main purpose.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    • @coderabbitai help me debug CodeRabbit configuration file.

Support

Need 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)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai generate docstrings to generate docstrings for this PR.
  • @coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
  • @coderabbitai auto-generate unit tests to generate unit tests for this PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR adds support for Facebook social sign-in to the Bit Boilerplate by introducing resource strings, configuration sections, package references, backend auth setup, and UI components.

  • Added new resource entries and translations for Facebook sign-in button text
  • Updated appsettings.json files and authentication setup to include Facebook
  • Introduced UI click handler, button markup, and an SVG icon for Facebook

Reviewed Changes

Copilot reviewed 10 out of 10 changed files in this pull request and generated no comments.

Show a summary per file
File Description
src/.../AppStrings.resx Add FacebookSignInButtonText resource
src/.../AppStrings.fa.resx Add Farsi translation for Facebook sign-in button
src/Server/Boilerplate.Server.Web/appsettings.json Add Facebook config section without comment
src/Server/Boilerplate.Server.Api/appsettings.json Add Facebook config section with docs comment
src/Server/Boilerplate.Server.Api/Program.Services.cs Register Facebook authentication when AppId is set
src/Server/Boilerplate.Server.Api/Boilerplate.Server.Api.csproj Add Microsoft.AspNetCore.Authentication.Facebook
src/Directory.Packages.props Pin Facebook auth package version 9.0.6
src/Client/.../SocialRow.razor.cs Add HandleFacebook() click handler
src/Client/.../SocialRow.razor Render Facebook button when supported
src/Client/.../FacebookIcon.razor New FacebookIcon SVG component
Comments suppressed due to low confidence (1)

src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/Components/SocialRow.razor:50

  • No tests were added to verify that Facebook appears in supportedProviders and renders the button; consider adding a UI or integration test for the Facebook flow.
            @if (supportedProviders.Contains("Facebook"))

@ysmoradi ysmoradi marked this pull request as ready for review July 2, 2025 13:52
@ysmoradi ysmoradi merged commit 7d464ba into bitfoundation:develop Jul 2, 2025
3 checks passed
@ysmoradi ysmoradi deleted the 11038 branch July 2, 2025 14:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Facebook social sign-in is missing in bit Boilerplate

1 participant