imporve oauth provider UI/UX

[seefs001]

Summary by CodeRabbit

Release Notes

• New Features

  • Added OAuth provider icon support throughout authentication UI
  • Introduced access policies to restrict custom OAuth provider access based on conditions
  • Added OpenID Connect discovery workflow to auto-fill OAuth endpoints from issuer URLs
  • Enabled custom access denial messages for OAuth providers

• Enhancements

  • Improved OAuth configuration UI with advanced settings section and policy templates
  • Enhanced user OAuth bindings display with provider icons

[coderabbitai]

Caution

Review failed

The pull request is closed.

Walkthrough

This PR adds OAuth provider icons, per-provider access control policies, and OpenID Connect discovery capabilities. Backend changes introduce access policy validation/evaluation logic, a discovery fetch endpoint, and new model fields. Frontend updates enable provider icon display, OAuth configuration UI with discovery workflow, and access policy templating.

Changes

Cohort / File(s)	Summary
Model Layer – Icon & Policy Fields model/custom_oauth_provider.go	Adds Icon, AccessPolicy, and AccessDeniedMessage fields to CustomOAuthProvider; introduces accessPolicyPayload and accessConditionItem types with recursive validation supporting operators (eq, ne, gt, gte, lt, lte, in, not_in, contains, not_contains, exists, not_exists); validateCustomOAuthProvider extended to validate policy structure and content.
OAuth Generic Provider – Policy Evaluation oauth/generic.go	Implements comprehensive access policy parsing, validation, and evaluation logic; integrates policy checks into GetUserInfo to deny access with rendered custom message; adds helper utilities for type coercion, comparison, and message rendering; extends token exchange and user info results.
OAuth Error Handling oauth/types.go	Introduces AccessDeniedError type with Message field and Error() method for direct user-facing access denial distinct from existing OAuthError handling.
Controller & Routing controller/custom_oauth.go, router/api-router.go	Adds FetchCustomOAuthDiscovery endpoint for OpenID discovery document retrieval; extends CreateCustomOAuthProviderRequest and UpdateCustomOAuthProviderRequest with Icon, AccessPolicy, AccessDeniedMessage fields; updates CustomOAuthProviderResponse and toCustomOAuthProviderResponse to include new fields; creates and updates now handle Icon and policy fields.
Controller – Misc & OAuth controller/misc.go, controller/oauth.go	GetStatus custom OAuth response augmented with Id and Icon fields; centralized OAuth error handler now catches AccessDeniedError and returns plain message via ApiErrorMsg.
Frontend – OAuth Icon Helper web/src/helpers/render.jsx	Introduces getOAuthProviderIcon function supporting react-icons lookup, prefixed keys, full URLs, and emoji fallbacks; includes oauthProviderIconMap for common OAuth providers and internal normalization helpers.
Frontend – Login & Register Forms web/src/components/auth/LoginForm.jsx, web/src/components/auth/RegisterForm.jsx	Adds hasCustomOAuthProviders and hasOAuthLoginOptions computed properties; renders custom OAuth provider buttons with dynamic icons via getOAuthProviderIcon; consolidates OAuth option conditional logic; RegisterForm adds per-provider loading state and discovery handling.
Frontend – OAuth Settings UI web/src/components/settings/CustomOAuthSetting.jsx	Comprehensive enhancement: adds discovery workflow with auto-fill of endpoints/scopes/claims; introduces Issuer URL handling and base URL inference; adds collapsible advanced section for auth style and access policy/denied message templates with preset templates (level_active, org_or_role); new Discovery banner, icon preview, enabled switch in modal footer; extended error handling and form value sync helpers.
Frontend – Account Management web/src/components/settings/personal/cards/AccountManagement.jsx	Normalizes provider_id to Number for consistent comparisons; replaces static lock icon with dynamic provider icon via getOAuthProviderIcon using provider.icon or binding provider_icon.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant Client as Web Client
    participant Controller as CustomOAuth Controller
    participant HTTP as HTTP Fetch
    participant DB as Database

    User->>Client: Click "Fetch Discovery"
    Client->>Controller: POST /custom-oauth-provider/discovery<br/>(issuerURL or wellKnownURL)
    Controller->>HTTP: Fetch OpenID Config<br/>from .well-known/openid-config
    HTTP-->>Controller: Discovery Doc<br/>(endpoints, scopes, claims)
    Controller->>Client: Return parsed endpoints<br/>& metadata
    Client->>Client: Auto-fill form fields<br/>(authorization_endpoint,<br/>token_endpoint, etc.)
    Client->>User: Show Discovery banner<br/>with populated fields

Loading

sequenceDiagram
    participant User as OAuth User
    participant Client as Web Client
    participant Provider as Generic OAuth<br/>Provider
    participant PolicyEval as Policy<br/>Evaluator
    participant Controller as OAuth<br/>Controller

    User->>Client: Click Custom OAuth Login
    Client->>Provider: GetUserInfo + Token
    Provider->>PolicyEval: Evaluate AccessPolicy<br/>against user claims
    alt Policy Passes
        PolicyEval-->>Provider: Allow
        Provider-->>Controller: User Info
        Controller-->>Client: Login Success
    else Policy Fails
        PolicyEval-->>Provider: Deny
        Provider->>Provider: Render AccessDeniedMessage
        Provider-->>Controller: AccessDeniedError
        Controller-->>Client: Error + Custom Message
    end
    Client-->>User: Show access denied or redirect

Loading

sequenceDiagram
    participant User
    participant Settings as Settings UI
    participant Controller as Custom OAuth<br/>Controller
    participant DB as Database

    User->>Settings: Configure Custom OAuth
    User->>Settings: Set Icon, Policies, etc.
    Settings->>Settings: Validate AccessPolicy<br/>(recursive structure)
    User->>Settings: Click Save
    Settings->>Controller: POST/PUT with Icon,<br/>AccessPolicy,<br/>AccessDeniedMessage
    Controller->>DB: Create/Update CustomOAuthProvider
    DB-->>Controller: Saved
    Controller-->>Settings: Response with new fields
    Settings-->>User: Success confirmation

Loading

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~60 minutes

Possibly related PRs

• feat(oauth): implement custom OAuth provider #2857: Modifies the same custom OAuth provider codepaths across model, controller, oauth generic logic, and UI components; directly related refactoring or feature enhancement to CustomOAuthProvider.

Suggested reviewers

• Calcium-Ion
• creamlike1024

Poem

🐰 A rabbit hops through OAuth's door,
With icons bright and policies galore,
Discovery magic fills the form,
Access rules keep login warm,
Icons shine, denial messages kind—
A safer auth we're here to find! 🔐✨

✨ Finishing Touches

• 📝 Generate docstrings (stacked PR)
• 📝 Generate docstrings (commit on current branch)

🧪 Generate unit tests (beta)

• 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

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}