[WEB-5798] refactor: web and admin auth related components and update admin designs

[prateekshourya29]

Description

This PR includes refactoring of auth-related components for both the admin and web applications, as well as some updates to the new design system.

Type of Change

• [x] Code refactoring

---

[!NOTE] Modernizes admin and web auth/settings with shared building blocks and cleaner structure.

• Introduces PageWrapper and revamped AdminHeader/breadcrumbs; migrates AI, Email, Authentication (incl. GitHub/GitLab/Gitea/Google), Image, General, and Workspace pages to new layout
• Adds AuthenticationMethodCard, useAuthenticationModes, and per-provider config UIs; standardizes toggle/toast copy (e.g., "Saving Configuration")
• Extracts OAuth config into hooks (useOAuthConfig) for Web and Space with core/extended split; removes legacy CE/EE exports; updates providers and store hooks paths
• Reworks sidebar (menu, help, dropdown) and workspace list item styles; updates various UI tokens/classes and button labels ("Saving")
• Adds route merge helper (routes/helper.ts) and new auth types (TInstanceAuthenticationModeKeys, TOAuthConfigs, etc.) in packages/types

^{Written by Cursor Bugbot for commit bb00007471dd27884b179fcba6730ffe6f4a2a15. This will update automatically on new commits. Configure here.}

Summary by CodeRabbit

• New Features

  • Added PageWrapper component for consistent page layouts across admin dashboard
  • Introduced dynamic sidebar navigation menu system
  • Added OAuth configuration hook system for simplified provider management
  • Added page metadata exports for browser titles

• Bug Fixes

  • Fixed searchParams access with safer optional chaining in form initialization

• Style

  • Updated button labels (removed ellipsis: "Saving..." → "Saving")
  • Refined container spacing, padding, and border styling across forms and cards
  • Adjusted icon sizing and color opacity for visual consistency

• Refactoring

  • Reorganized page layouts using PageWrapper component
  • Consolidated authentication configuration into centralized hook system
  • Simplified OAuth provider handling with hook-based configuration

• Chores

  • Removed upgrade button component and related exports
  • Cleaned up unused barrel file re-exports

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai[bot]]

📝 Walkthrough

Walkthrough

Introduces a PageWrapper layout across many admin pages, replaces inline OAuth/OAuth-config construction with hook-driven config (core + extended), reorganizes providers and sidebar/menu hooks, adds header label mappings and PageWrapper component, and applies numerous presentational class and minor API surface adjustments (type additions, removed barrel exports).

Changes

Cohort / File(s)	Summary
PageWrapper Layout & Page Restructuring apps/admin/core/components/common/page-wrapper.tsx, apps/admin/app/(all)/(dashboard)/*/page.tsx, apps/admin/app/(all)/(dashboard)/workspace/create/page.tsx, apps/admin/app/(all)/(dashboard)/workspace/page.tsx	New PageWrapper component; many pages converted to use PageWrapper (header → header/customHeader). Several pages add meta/default exports; conditional loader/form rendering preserved.
Form UI & Button Text Updates apps/admin/app/(all)/(dashboard)/**/form.tsx, apps/admin/app/(all)/(dashboard)/email/test-email-modal.tsx	Removed ellipses from submitting button labels (e.g., "Saving..." → "Saving"); small spacing/background/token class tweaks across multiple forms.
OAuth: Admin — Map + Hook apps/admin/core/hooks/oauth/core.tsx, apps/admin/core/hooks/oauth/index.ts, apps/admin/core/hooks/oauth/types.ts	Replaced array-based getAuthenticationModes with a keyed map getCoreAuthenticationModesMap and introduced useAuthenticationModes hook; removed AuthenticationModes component and added typed props.
OAuth: Web — Hooks & config merge apps/web/core/hooks/oauth/{core,extended,index}.ts, apps/web/ce/helpers/oauth-config.tsx (deleted)	Added useCoreOAuthConfig and useExtendedOAuthConfig; new useOAuthConfig merges them; removed old OAUTH_CONFIG helper (deleted).
Auth UI Refactors (banner/header/root) apps/web/core/components/account/auth-forms/{auth-root,auth-banner,auth-header}.tsx, apps/web/core/components/auth-screens/header.tsx, apps/space/core/components/account/auth-forms/auth-root.tsx	Auth components now use useOAuthConfig; AuthBanner API changed to message prop; AuthHeaderBase extracted for shared header rendering.
Sidebar menu: hook-driven apps/admin/core/hooks/use-sidebar-menu/{core,index,types}.ts, apps/admin/app/(all)/(dashboard)/sidebar-menu.tsx	New coreSidebarMenuLinks and useSidebarMenu hook; replaces static INSTANCE_ADMIN_LINKS with hook-derived sidebarMenu; updates active-state and typography.
Header labels & header component changes apps/admin/core/components/common/header/{core,extended,index}.tsx	Added CORE_HEADER_SEGMENT_LABELS and EXTENDED_HEADER_SEGMENT_LABELS; HEADER_SEGMENT_LABELS mapping used for breadcrumbs; replaced getHeaderTitle switch.
Providers reorg & AppProviders apps/admin/core/providers/{core,extended,index}.tsx, apps/admin/app/root.tsx, apps/admin/core/providers/core.tsx	Renamed AppProviders → CoreProviders, added ExtendedProviders, and new AppProviders composing both; updated import paths.
Route merge utility apps/web/app/routes.ts, apps/web/app/routes/helper.ts	Extracted mergeRoutes implementation into new helper that deduplicates/merges routes (deep-merge children), and imported it from routes.ts.
Type additions packages/types/src/instance/{auth,auth-ee}.ts	Added TCoreInstanceAuthenticationModeKeys, TInstanceAuthenticationModeKeys, TOAuthOption, TOAuthConfigs; added TExtendedInstanceAuthenticationModeKeys; tightened TInstanceAuthenticationModes.key type.
Barrel exports & removed components apps/admin/ce/components/common/upgrade-button.tsx (deleted), apps/admin/ce/components/{authentication,index}.ts, apps/admin/ee/components/**, apps/web/ce/helpers/oauth-config.tsx (deleted)	Removed UpgradeButton component and several wildcard re-exports (narrowed barrel surfaces); deleted CE/EE re-exports and old OAuth helper.
Various presentational tweaks multiple files: apps/admin/app/(all)/(dashboard)/**, apps/admin/core/components/**, apps/admin/app/(all)/(home)/**, apps/admin/core/components/workspace/list-item.tsx, etc.	Numerous className/token adjustments (sizes, spacing, color opacity removals), minor import path updates, small promise-handling changes (void prefix), and component root style tweaks (rounded-xs → rounded-lg).
Store hook import path updates apps/admin/core/hooks/store/{use-instance,use-theme,use-user,use-workspace}.tsx	Updated StoreContext import path to "@/providers/store.provider" (module resolution only).
Instance setup + workspace adjustments apps/admin/core/components/instance/setup-form.tsx, apps/admin/core/components/workspace/list-item.tsx	Safer searchParams access (optional chaining), minor placeholder text change, visual layout updates.

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~50 minutes

Possibly related PRs

• makeplane/plane#7922: Overlaps on admin layout and routing refactors (PageWrapper/providers/layout changes).

Suggested reviewers

• pushya22

Poem

"I hopped through components, tidy and bright,
Moved wrappers to headers, and made icons right.
Hooks stitched the OAuth thread, neat as a bun,
Barrels trimmed and routes merged — work nicely done! 🐰✨"

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run @coderabbitai generate docstrings to improve docstring coverage.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The PR title clearly summarizes the main changes: refactoring of auth-related components and design updates for both web and admin applications.
Description check	✅ Passed	The PR description includes the required 'Description' and 'Type of Change' sections. The description is detailed with a comprehensive summary note explaining layout/UX changes, navigation updates, auth config refactoring, OAuth improvements, type additions, and cleanup work, providing sufficient context for reviewers.

✨ Finishing touches

• [ ] 📝 Generate docstrings

🧪 Generate unit tests (beta)

• [ ] Create PR with unit tests
• [ ] Post copyable unit tests in a comment
• [ ] Commit unit tests in branch refactor-components

---

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.}

[makeplane[bot]]

Linked to Plane Work Item(s)

• [WEB-5798] Refactor web and admin auth related components and update admin designs.

This comment was auto-generated by Plane