fix: Apply organization brand colors and theme to member personal events#24456
fix: Apply organization brand colors and theme to member personal events#24456
Conversation
- Fetch organization brand colors and theme in getEventTypesFromDB - Override user brand colors/theme with org values for personal events - Apply to booking confirmation pages, user booking pages, and routing forms - Follow same pattern as hideBranding for consistency - Fixes issue where org brand colors only applied to team events Co-Authored-By: anik@cal.com <adhabal2002@gmail.com>
WalkthroughProfile styling fields (theme, brandColor, darkBrandColor) are now resolved from organization/team parent where present with fallbacks to user-level values via a new getBrandingForEventType utility. Event type selections and returned payloads (booking flows, team pages, routing link generation, and default event commons) include organization/team branding. ProfileRepository and related Prisma selects fetch organization.{brandColor,darkBrandColor,theme}. UserPageProps and server-side props were extended to include the enriched profile branding fields; tests were updated to match the new shape. Possibly related PRs
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
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 |
…ides - Added brandColor, darkBrandColor, theme to ProfileRepository findById organization select - Updated test mock to include new organization fields - Ensures consistent organization branding types across all queries - All type errors related to brand color changes now resolved Co-Authored-By: anik@cal.com <adhabal2002@gmail.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub. |
The spread operator already includes profile when it exists. Explicit assignment causes type conflicts with union types where profile is not guaranteed to exist in all branches. Resolves TypeScript error at bookings-single-view.getServerSideProps.tsx:134 Co-Authored-By: anik@cal.com <adhabal2002@gmail.com>
Changed eventType.profile to eventTypeRaw.profile in profile object construction to fix TypeScript errors where profile property doesn't exist on transformed eventType object. The eventTypeRaw object maintains the original profile field from the database query. Resolves TypeScript errors at lines 155, 158, 161 in bookings-single-view.getServerSideProps.tsx Co-Authored-By: anik@cal.com <adhabal2002@gmail.com>
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
apps/web/modules/users/views/users-public-view.test.tsx (1)
23-30: LGTM! Test fixture updated correctly.The organization object now includes the new styling fields (brandColor, darkBrandColor, theme) set to null, which aligns with the PR's objective to support organization-level branding.
Consider adding a test case where these organization fields are non-null to verify that the fallback logic works correctly when organization styling is present:
organization: { requestedSlug: "slug", slug: "slug", id: 1, brandColor: "#000000", darkBrandColor: "#ffffff", theme: "light", },
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Disabled knowledge base sources:
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (7)
apps/web/lib/apps/routing-forms/[...pages]/getServerSidePropsRoutingLink.ts(1 hunks)apps/web/lib/booking.ts(2 hunks)apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx(3 hunks)apps/web/modules/users/views/users-public-view.test.tsx(1 hunks)apps/web/server/lib/[user]/getServerSideProps.ts(3 hunks)packages/features/eventtypes/lib/defaultEvents.ts(1 hunks)packages/features/profile/repositories/ProfileRepository.ts(2 hunks)
🧰 Additional context used
📓 Path-based instructions (5)
**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
Always use
t()for text localization in frontend code; direct text embedding should trigger a warning
Files:
apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsxapps/web/modules/users/views/users-public-view.test.tsx
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
Flag excessive Day.js use in performance-critical code; prefer native Date or Day.js
.utc()in hot paths like loops
Files:
apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsxapps/web/modules/users/views/users-public-view.test.tsxapps/web/lib/booking.tsapps/web/lib/apps/routing-forms/[...pages]/getServerSidePropsRoutingLink.tspackages/features/profile/repositories/ProfileRepository.tsapps/web/server/lib/[user]/getServerSideProps.tspackages/features/eventtypes/lib/defaultEvents.ts
**/*.{ts,tsx,js,jsx}
⚙️ CodeRabbit configuration file
Flag default exports and encourage named exports. Named exports provide better tree-shaking, easier refactoring, and clearer imports. Exempt main components like pages, layouts, and components that serve as the primary export of a module.
Files:
apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsxapps/web/modules/users/views/users-public-view.test.tsxapps/web/lib/booking.tsapps/web/lib/apps/routing-forms/[...pages]/getServerSidePropsRoutingLink.tspackages/features/profile/repositories/ProfileRepository.tsapps/web/server/lib/[user]/getServerSideProps.tspackages/features/eventtypes/lib/defaultEvents.ts
**/*.ts
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
**/*.ts: For Prisma queries, only select data you need; never useinclude, always useselect
Ensure thecredential.keyfield is never returned from tRPC endpoints or APIs
Files:
apps/web/lib/booking.tsapps/web/lib/apps/routing-forms/[...pages]/getServerSidePropsRoutingLink.tspackages/features/profile/repositories/ProfileRepository.tsapps/web/server/lib/[user]/getServerSideProps.tspackages/features/eventtypes/lib/defaultEvents.ts
**/*Repository.ts
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
Repository files must include
Repositorysuffix, prefix with technology if applicable (e.g.,PrismaAppRepository.ts), and use PascalCase matching the exported class
Files:
packages/features/profile/repositories/ProfileRepository.ts
🧠 Learnings (5)
📚 Learning: 2025-08-27T13:32:46.887Z
Learnt from: supalarry
PR: calcom/cal.com#23364
File: apps/api/v2/src/ee/event-types/event-types_2024_06_14/transformers/internal-to-api/internal-to-api.spec.ts:295-296
Timestamp: 2025-08-27T13:32:46.887Z
Learning: In calcom/cal.com, when transforming booking fields from internal to API format, tests in organizations-event-types.e2e-spec.ts already expect name field label and placeholder to be empty strings ("") rather than undefined. PR changes that set these to explicit empty strings are typically fixing implementation to match existing test expectations rather than breaking changes.
Applied to files:
apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsxapps/web/lib/booking.ts
📚 Learning: 2025-08-28T10:48:03.862Z
Learnt from: anglerfishlyy
PR: calcom/cal.com#0
File: :0-0
Timestamp: 2025-08-28T10:48:03.862Z
Learning: In Cal.com booking pipeline, loadUsersByEventType must return a plain array of user objects, not host-wrapped objects; returning { user, ... } causes downstream watchlist/validation to throw (e.g., reading 'split').
Applied to files:
apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx
📚 Learning: 2025-08-21T13:44:06.805Z
Learnt from: supalarry
PR: calcom/cal.com#23217
File: apps/api/v2/src/ee/event-types/event-types_2024_06_14/services/output-event-types.service.ts:93-94
Timestamp: 2025-08-21T13:44:06.805Z
Learning: In apps/api/v2/src/ee/event-types/event-types_2024_06_14/event-types.repository.ts, repository functions that use explicit Prisma select clauses (like getEventTypeWithSeats) are used for specific purposes and don't need to include all EventType fields like bookingRequiresAuthentication. These methods don't feed into the general OutputEventTypesService_2024_06_14 flow.
Applied to files:
apps/web/lib/booking.ts
📚 Learning: 2025-08-21T12:28:42.018Z
Learnt from: alishaz-polymath
PR: calcom/cal.com#23247
File: packages/features/webhooks/lib/factory/WebhookPayloadFactory.ts:274-282
Timestamp: 2025-08-21T12:28:42.018Z
Learning: In BookingPaymentInitiatedDTO and other webhook DTOs in packages/features/webhooks/lib/dto/types.ts, the booking field is a restricted structure containing only specific fields (id, eventTypeId, userId) rather than the full database booking object, so there are no security or PII leakage concerns when passing the booking object to buildEventPayload.
Applied to files:
apps/web/lib/booking.ts
📚 Learning: 2025-08-21T12:28:42.018Z
Learnt from: alishaz-polymath
PR: calcom/cal.com#23247
File: packages/features/webhooks/lib/factory/WebhookPayloadFactory.ts:274-282
Timestamp: 2025-08-21T12:28:42.018Z
Learning: In webhook DTOs in packages/features/webhooks/lib/dto/types.ts, the booking fields are restricted structures containing only specific fields (id, eventTypeId, userId, and sometimes additional fields like startTime or smsReminderNumber) rather than full database booking objects, so there are no security or PII leakage concerns when using these booking objects in webhook payloads.
Applied to files:
apps/web/lib/booking.ts
🔇 Additional comments (10)
packages/features/profile/repositories/ProfileRepository.ts (2)
44-56: LGTM! Organization styling fields added consistently.The addition of
brandColor,darkBrandColor, andthemetoorganizationSelectensures these fields are available across all profile queries. SinceorganizationWithSettingsSelectspreadsorganizationSelect, these fields propagate correctly to all derived selects.
480-494: LGTM! Styling fields included in profile lookup.The explicit selection of organization branding fields in
findByIdaligns with the changes toorganizationSelectand ensures organization styling is available for profile-based queries.packages/features/eventtypes/lib/defaultEvents.ts (1)
144-144: LGTM! Profile field added to dynamic event configuration.Adding
profile: nullto thecommonsobject aligns with the broader changes that enrich event types with profile/organization data. Setting it tonullis appropriate for the default event configuration, and optional chaining elsewhere safely handles this value.apps/web/server/lib/[user]/getServerSideProps.ts (2)
36-38: LGTM! Type definition extended correctly.The
organizationobject inUserPagePropsnow includes the styling fields (brandColor,darkBrandColor,theme) that enable organization-level branding for personal events.
141-149: LGTM! Branding resolution implements correct fallback hierarchy.The profile construction now properly sources
theme,brandColor, anddarkBrandColorfrom organization-level settings when available, falling back to user-level values and then to defaults. This aligns perfectly with the PR's objective to apply organization branding to personal events.apps/web/lib/apps/routing-forms/[...pages]/getServerSidePropsRoutingLink.ts (1)
86-92: LGTM! Branding fallback pattern applied consistently.The profile props now source
theme,brandColor, anddarkBrandColorfrom organization-level values when available, with proper fallbacks to user-level values. This ensures routing forms display with organization branding for members, consistent with the broader changes in this PR.apps/web/lib/booking.ts (2)
49-60: LGTM! Organization styling fields included in event type query.The profile selection now includes
organizationwith its styling fields (brandColor,darkBrandColor,theme). This enriches the event type data with organization-level branding information, enabling it to be used downstream in booking flows.
126-133: LGTM! Organization team detection and payload construction updated correctly.The
isOrgTeamEventcheck now useseventType.profile?.organizationId, which correctly identifies organization-scoped team events. Spreading the fulleventType(line 130) ensures that the enriched profile data, including organization styling fields, is included in the returned payload.apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx (2)
118-120: LGTM! Improved hosts validation logic.Checking
hosts?.lengthinstead of just the truthy value ofhostsis a more precise condition. An emptyhostsarray (which would be truthy) now correctly falls back toeventTypeRaw.users, which is the logically correct behavior.
150-163: LGTM! Profile branding resolution updated correctly.For non-team events, the branding fields (
theme,brandColor,darkBrandColor) now prioritize organization-level values with appropriate fallbacks to user-level values, completing the implementation of organization branding for personal events. Team events correctly continue to usenullfor these fields.
apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx
Outdated
Show resolved
Hide resolved
apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx
Outdated
Show resolved
Hide resolved
Pull request was converted to draft
- Create getBrandingForEventType utility function that handles organization brand color overrides for both team and personal events - For team events: org branding → team branding → null - For personal events: org branding → user branding → null - Refactor bookings-single-view to use utility function - Update team booking page to apply organization brand overrides - Add organization branding fields to ProfileRepository and team queries Addresses review feedback from @hariombalhara on PR #24456 Co-Authored-By: anik@cal.com <adhabal2002@gmail.com>
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (3)
apps/web/lib/booking.ts (1)
136-139: Return shape change (spreading full eventType).Returning the full eventType instead of a pruned "rest" can increase prop size. If this is server-only and not serialized to client unchanged, fine; otherwise consider pruning to essentials.
packages/features/profile/lib/getBranding.ts (1)
27-48: Optional: export the input type (and add JSDoc).Export EventTypeWithBranding and add brief JSDoc to encourage consistent use and reduce shape drift in callers.
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx (1)
137-152: Pass only the needed fields to branding helper.You can avoid spreading the full team object; pass a minimal shape to reduce coupling.
Example:
-const branding = getBrandingForEventType({ - eventType: { - team: team.parent ? { ...team, parent: { brandColor: team.parent.brandColor, darkBrandColor: team.parent.darkBrandColor, theme: team.parent.theme } } : team, - users: [], - profile: null, - }, -}); +const branding = getBrandingForEventType({ + eventType: { + team: team.parent + ? { + brandColor: team.brandColor, + darkBrandColor: team.darkBrandColor, + theme: team.theme, + parent: { + brandColor: team.parent.brandColor, + darkBrandColor: team.parent.darkBrandColor, + theme: team.parent.theme, + }, + } + : { + brandColor: team.brandColor, + darkBrandColor: team.darkBrandColor, + theme: team.theme, + }, + users: [], + profile: null, + }, +});
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Disabled knowledge base sources:
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (4)
apps/web/lib/booking.ts(3 hunks)apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx(7 hunks)apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx(3 hunks)packages/features/profile/lib/getBranding.ts(1 hunks)
🧰 Additional context used
📓 Path-based instructions (4)
**/*.ts
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
**/*.ts: For Prisma queries, only select data you need; never useinclude, always useselect
Ensure thecredential.keyfield is never returned from tRPC endpoints or APIs
Files:
packages/features/profile/lib/getBranding.tsapps/web/lib/booking.ts
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
Flag excessive Day.js use in performance-critical code; prefer native Date or Day.js
.utc()in hot paths like loops
Files:
packages/features/profile/lib/getBranding.tsapps/web/lib/team/[slug]/[type]/getServerSideProps.tsxapps/web/lib/booking.tsapps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx
**/*.{ts,tsx,js,jsx}
⚙️ CodeRabbit configuration file
Flag default exports and encourage named exports. Named exports provide better tree-shaking, easier refactoring, and clearer imports. Exempt main components like pages, layouts, and components that serve as the primary export of a module.
Files:
packages/features/profile/lib/getBranding.tsapps/web/lib/team/[slug]/[type]/getServerSideProps.tsxapps/web/lib/booking.tsapps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx
**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
Always use
t()for text localization in frontend code; direct text embedding should trigger a warning
Files:
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsxapps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx
🧠 Learnings (5)
📚 Learning: 2025-08-21T13:44:06.805Z
Learnt from: supalarry
PR: calcom/cal.com#23217
File: apps/api/v2/src/ee/event-types/event-types_2024_06_14/services/output-event-types.service.ts:93-94
Timestamp: 2025-08-21T13:44:06.805Z
Learning: In apps/api/v2/src/ee/event-types/event-types_2024_06_14/event-types.repository.ts, repository functions that use explicit Prisma select clauses (like getEventTypeWithSeats) are used for specific purposes and don't need to include all EventType fields like bookingRequiresAuthentication. These methods don't feed into the general OutputEventTypesService_2024_06_14 flow.
Applied to files:
apps/web/lib/booking.tsapps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx
📚 Learning: 2025-08-27T13:32:46.887Z
Learnt from: supalarry
PR: calcom/cal.com#23364
File: apps/api/v2/src/ee/event-types/event-types_2024_06_14/transformers/internal-to-api/internal-to-api.spec.ts:295-296
Timestamp: 2025-08-27T13:32:46.887Z
Learning: In calcom/cal.com, when transforming booking fields from internal to API format, tests in organizations-event-types.e2e-spec.ts already expect name field label and placeholder to be empty strings ("") rather than undefined. PR changes that set these to explicit empty strings are typically fixing implementation to match existing test expectations rather than breaking changes.
Applied to files:
apps/web/lib/booking.ts
📚 Learning: 2025-08-21T12:28:42.018Z
Learnt from: alishaz-polymath
PR: calcom/cal.com#23247
File: packages/features/webhooks/lib/factory/WebhookPayloadFactory.ts:274-282
Timestamp: 2025-08-21T12:28:42.018Z
Learning: In webhook DTOs in packages/features/webhooks/lib/dto/types.ts, the booking fields are restricted structures containing only specific fields (id, eventTypeId, userId, and sometimes additional fields like startTime or smsReminderNumber) rather than full database booking objects, so there are no security or PII leakage concerns when using these booking objects in webhook payloads.
Applied to files:
apps/web/lib/booking.ts
📚 Learning: 2025-08-21T12:28:42.018Z
Learnt from: alishaz-polymath
PR: calcom/cal.com#23247
File: packages/features/webhooks/lib/factory/WebhookPayloadFactory.ts:274-282
Timestamp: 2025-08-21T12:28:42.018Z
Learning: In BookingPaymentInitiatedDTO and other webhook DTOs in packages/features/webhooks/lib/dto/types.ts, the booking field is a restricted structure containing only specific fields (id, eventTypeId, userId) rather than the full database booking object, so there are no security or PII leakage concerns when passing the booking object to buildEventPayload.
Applied to files:
apps/web/lib/booking.ts
📚 Learning: 2025-08-28T10:48:03.862Z
Learnt from: anglerfishlyy
PR: calcom/cal.com#0
File: :0-0
Timestamp: 2025-08-28T10:48:03.862Z
Learning: In Cal.com booking pipeline, loadUsersByEventType must return a plain array of user objects, not host-wrapped objects; returning { user, ... } causes downstream watchlist/validation to throw (e.g., reading 'split').
Applied to files:
apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx
🧬 Code graph analysis (2)
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx (1)
packages/features/profile/lib/getBranding.ts (1)
getBrandingForEventType(27-48)
apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx (1)
packages/features/profile/lib/getBranding.ts (1)
getBrandingForEventType(27-48)
⏰ Context from checks skipped due to timeout of 180000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Detect changes
🔇 Additional comments (8)
apps/web/lib/booking.ts (3)
52-58: Good: organization branding is selected via Prisma select (no include).Keeps payload minimal and enables org-level theming downstream.
As per coding guidelines
81-90: Good: team and parent branding selected explicitly.Appropriate fields only; matches centralized branding usage.
As per coding guidelines
132-132: Confirm isOrgTeamEvent logic
Requiring botheventType.teamandeventType.profile.organizationIdwill treat org-member personal events (no team) as non-org-team and differs from other modules checkingteam.parentId. Ensure this aligns with expected behavior for org, team, and personal event types.packages/features/profile/lib/getBranding.ts (1)
1-48: Nice centralization of branding fallbacks.Clear precedence: team.parent → team → org → user. Null-safe and minimal surface.
apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx (2)
119-121: Users mapping from hosts looks good.Produces a plain array of user objects (not host-wrapped), which avoids downstream issues.
Based on learnings
154-155: Good: branding derived via helper.Using getBrandingForEventType reduces duplication and aligns sources (team/org/user).
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx (2)
169-175: Good: profile spreads computed branding.Keeps view logic simple and consistent with other pages.
226-229: Good: added branding fields to Prisma selects.Select-only aligns with our Prisma guideline; minimal fields needed for theming.
As per coding guidelines
Also applies to: 239-242
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx (1)
137-153: Branding derivation is correct; consider passing a minimal shapeCurrent use spreads the whole
teaminto the eventType stub. For clarity and tighter typing, pass only the needed fields (theme, brandColor, darkBrandColor, parent’s counterparts).Example:
- const branding = getBrandingForEventType({ - eventType: { - team: team.parent - ? { - ...team, - parent: { - brandColor: team.parent.brandColor, - darkBrandColor: team.parent.darkBrandColor, - theme: team.parent.theme, - }, - } - : team, - users: [], - profile: null, - }, - }); + const branding = getBrandingForEventType({ + eventType: { + team: { + theme: team.theme, + brandColor: team.brandColor, + darkBrandColor: team.darkBrandColor, + parent: team.parent + ? { + theme: team.parent.theme, + brandColor: team.parent.brandColor, + darkBrandColor: team.parent.darkBrandColor, + } + : undefined, + }, + users: [], + profile: null, + }, + });
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Disabled knowledge base sources:
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (1)
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx(6 hunks)
🧰 Additional context used
📓 Path-based instructions (3)
**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
Always use
t()for text localization in frontend code; direct text embedding should trigger a warning
Files:
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
Flag excessive Day.js use in performance-critical code; prefer native Date or Day.js
.utc()in hot paths like loops
Files:
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx
**/*.{ts,tsx,js,jsx}
⚙️ CodeRabbit configuration file
Flag default exports and encourage named exports. Named exports provide better tree-shaking, easier refactoring, and clearer imports. Exempt main components like pages, layouts, and components that serve as the primary export of a module.
Files:
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx
🧬 Code graph analysis (1)
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx (1)
packages/features/profile/lib/getBranding.ts (1)
getBrandingForEventType(27-48)
🔇 Additional comments (3)
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx (3)
10-13: Imports look goodBranding and avatar utilities imported correctly.
174-175: Spreading branding into profile: LGTMThis exposes theme and colors to the renderer via profile.
226-229: Selecting branding fields: LGTMParent and team brandColor/darkBrandColor/theme are correctly selected for branding resolution.
Also applies to: 239-242
… settings - Changed getBrandingForEventType to use either parent or team branding entirely - Simplified team parent branding structure in getServerSideProps - Prevents inconsistent branding when some properties exist in parent but not others - Addresses PR review feedback from hariombalhara Co-Authored-By: hariom@cal.com <hariombalhara@gmail.com>
There was a problem hiding this comment.
Actionable comments posted: 0
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx (1)
181-181: SetthemeBasistoteam.sluginstead ofnullfor team event type booking pages.The codebase shows a consistent pattern where team event type booking pages should use the team slug as
themeBasis:
- Team overview pages use
themeBasis: serializableTeam.slug- Booking pages use
themeBasis: eventType.team ? eventType.team.slug : eventType.users[0]?.username- The theme provider warns if
themeBasisis missing for booking pages, as it causes theme flickerSetting it to
nullbreaks theme localStorage keying. Useteam.sluginstead.
♻️ Duplicate comments (2)
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx (2)
180-180: Boolean parsing bug affects this line.The improper string-to-boolean conversion of
queryIsInstantMeetingat line 34 causes this ternary to incorrectly evaluate any non-empty query param value (including"false") as truthy. This issue has been flagged in previous reviews.
34-34: String-to-boolean parsing bug remains unresolved.This line destructures
queryIsInstantMeetingas a string from the query params, which causes the issue at line 180 where any non-empty string (including"false") will be treated as truthy. This critical bug has already been flagged in previous reviews.
🧹 Nitpick comments (1)
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx (1)
137-143: Simplify branding computation by passing team directly.The current code passes
team: team.parent ?? team, butgetBrandingForEventTypealready implements the fallback logiceventType.team.parent ?? eventType.team. This creates a confusing double fallback.Apply this diff to simplify and clarify the logic:
const branding = getBrandingForEventType({ eventType: { - team: team.parent ?? team, + team: team, users: [], profile: null, }, });This achieves the same result (organization branding preferred over team branding) but relies on the utility function's intended logic rather than pre-computing the fallback.
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Disabled knowledge base sources:
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (2)
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx(6 hunks)packages/features/profile/lib/getBranding.ts(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- packages/features/profile/lib/getBranding.ts
🧰 Additional context used
📓 Path-based instructions (3)
**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
Always use
t()for text localization in frontend code; direct text embedding should trigger a warning
Files:
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
Flag excessive Day.js use in performance-critical code; prefer native Date or Day.js
.utc()in hot paths like loops
Files:
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx
**/*.{ts,tsx,js,jsx}
⚙️ CodeRabbit configuration file
Flag default exports and encourage named exports. Named exports provide better tree-shaking, easier refactoring, and clearer imports. Exempt main components like pages, layouts, and components that serve as the primary export of a module.
Files:
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx
🧬 Code graph analysis (1)
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx (1)
packages/features/profile/lib/getBranding.ts (1)
getBrandingForEventType(27-49)
🔇 Additional comments (3)
apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx (3)
10-10: LGTM: Utility import added correctly.The import of
getBrandingForEventTypeis appropriate for the new branding functionality being introduced in this file.
217-219: LGTM: Branding fields added to data selection.The addition of
brandColor,darkBrandColor, andthemeto both the parent (organization) and team selections correctly provides the necessary data for thegetBrandingForEventTypeutility function.Also applies to: 230-232
165-165: No changes needed — branding spread is correctly typed and implemented.The branding object from
getBrandingForEventType()(line 137) has an explicit return type that includestheme,brandColor, anddarkBrandColor, each typed asstring | null. The spread at line 165 correctly adds these fields to the profile object. TypeScript validates this at compile time, and the pattern is consistent with other similar uses in the codebase.
E2E results are ready! |
- Add 20 unit tests covering getBrandingForEventType, getBrandingForUser, and getBrandingForTeam - Test organization branding override scenarios for both team and personal events - Test fallback behavior when organization branding is not set - Test handling of null and optional branding properties - Verify theme and color inheritance from parent organizations Co-Authored-By: anik@cal.com <adhabal2002@gmail.com>
- Reduce from 20 to 8 essential test cases - Focus on org override and fallback behavior for each utility - Remove redundant edge case tests while maintaining full coverage Co-Authored-By: anik@cal.com <adhabal2002@gmail.com>
There was a problem hiding this comment.
1 issue found across 10 files
Prompt for AI agents (all 1 issues)
Understand the root cause of the following 1 issues and fix them.
<file name="apps/web/server/lib/[user]/getServerSideProps.ts">
<violation number="1" location="apps/web/server/lib/[user]/getServerSideProps.ts:144">
If the member belongs to an org that has branding but no theme, profile.theme now becomes null instead of falling back to the member’s theme, regressing the previous behavior. Please retain the user fallback when the org theme is missing.</violation>
</file>
React with 👍 or 👎 to teach cubic. Mention @cubic-dev-ai to give feedback, ask questions, or re-run the review.
…nts (calcom#24456) * fix: Apply organization brand colors and theme to member personal events - Fetch organization brand colors and theme in getEventTypesFromDB - Override user brand colors/theme with org values for personal events - Apply to booking confirmation pages, user booking pages, and routing forms - Follow same pattern as hideBranding for consistency - Fixes issue where org brand colors only applied to team events Co-Authored-By: anik@cal.com <adhabal2002@gmail.com> * fix: Resolve type errors for organization brand color and theme overrides - Added brandColor, darkBrandColor, theme to ProfileRepository findById organization select - Updated test mock to include new organization fields - Ensures consistent organization branding types across all queries - All type errors related to brand color changes now resolved Co-Authored-By: anik@cal.com <adhabal2002@gmail.com> * fix: Remove redundant profile assignment causing type errors The spread operator already includes profile when it exists. Explicit assignment causes type conflicts with union types where profile is not guaranteed to exist in all branches. Resolves TypeScript error at bookings-single-view.getServerSideProps.tsx:134 Co-Authored-By: anik@cal.com <adhabal2002@gmail.com> * fix: Use eventTypeRaw.profile for organization brand color access Changed eventType.profile to eventTypeRaw.profile in profile object construction to fix TypeScript errors where profile property doesn't exist on transformed eventType object. The eventTypeRaw object maintains the original profile field from the database query. Resolves TypeScript errors at lines 155, 158, 161 in bookings-single-view.getServerSideProps.tsx Co-Authored-By: anik@cal.com <adhabal2002@gmail.com> * fix type error * refactor: Extract branding logic into getBrandingForEventType utility - Create getBrandingForEventType utility function that handles organization brand color overrides for both team and personal events - For team events: org branding → team branding → null - For personal events: org branding → user branding → null - Refactor bookings-single-view to use utility function - Update team booking page to apply organization brand overrides - Add organization branding fields to ProfileRepository and team queries Addresses review feedback from @hariombalhara on PR calcom#24456 Co-Authored-By: anik@cal.com <adhabal2002@gmail.com> * Update getBranding.ts * Change Set themeBasis to null instead of branding.theme. * refactor: Simplify branding fallback logic to prevent mixing org/team settings - Changed getBrandingForEventType to use either parent or team branding entirely - Simplified team parent branding structure in getServerSideProps - Prevents inconsistent branding when some properties exist in parent but not others - Addresses PR review feedback from hariombalhara Co-Authored-By: hariom@cal.com <hariombalhara@gmail.com> * addressed review * test: Add comprehensive unit tests for branding utility functions - Add 20 unit tests covering getBrandingForEventType, getBrandingForUser, and getBrandingForTeam - Test organization branding override scenarios for both team and personal events - Test fallback behavior when organization branding is not set - Test handling of null and optional branding properties - Verify theme and color inheritance from parent organizations Co-Authored-By: anik@cal.com <adhabal2002@gmail.com> * test: Simplify branding tests to focus on core scenarios - Reduce from 20 to 8 essential test cases - Focus on org override and fallback behavior for each utility - Remove redundant edge case tests while maintaining full coverage Co-Authored-By: anik@cal.com <adhabal2002@gmail.com> --------- Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com> Co-authored-by: hariom@cal.com <hariombalhara@gmail.com>
What does this PR do?
Fixes organization brand colors and theme not applying to personal events of organization members. Previously, org-level brand colors and themes only applied to team events but were ignored for personal events, causing inconsistent branding within organizations.