fix(companion): Android bottom navbar styling and iOS event type spacing issues

[dhairyashiil]

PR Description

ios

Screen.Recording.2026-01-19.at.12.43.53.AM.mov

android

Screen.Recording.2026-01-19.at.12.53.09.AM.mov

Summary

This PR addresses several UI issues in the Cal.com Companion app, including Android bottom navbar styling and iOS event type list item spacing.

Changes

1. Android Bottom Navbar Fixes

• Platform-specific icons: iOS now uses native SF Symbols while Android uses MaterialCommunityIcons with proper tinting
• Fixed dark navbar in light mode: Added explicit backgroundColor for Android (#F8F8F8) to override Material 3 default dark styling
• Made styling platform-specific: iOS uses native transparent/system default background

2. Cache Clearing on Logout

• Added clearQueryCache() call in AuthContext.logout() to clear persisted React Query cache
• Added clearCache() call in More screens to clear in-memory cache before logout
• Ensures fresh data when logging in with a different account

3. iOS Event Type Spacing Fix

• Root cause: SwiftUI Host matchContents was caching layout measurements at the native layer. When event types had badges added/removed dynamically, the cached measurements weren't updated, causing badges to appear clipped.
• Solution: Implemented dynamic minHeight calculation based on badge count:
  • 1-3 badges (1 row): 100px minimum height
  • 4-5 badges (2 rows): 130px minimum height
  • 6 badges: 160px minimum height
• This ensures adequate vertical space is always allocated regardless of SwiftUI's cached layout state
• Changed flex alignment from items-center to items-start to prevent vertical centering issues

Files Modified

• companion/app/(tabs)/_layout.tsx - Platform-specific navbar styling
• companion/contexts/AuthContext.tsx - Cache clearing on logout
• companion/app/(tabs)/(more)/index.tsx - Cache clearing on logout (Android/Web)
• companion/app/(tabs)/(more)/index.ios.tsx - Cache clearing on logout (iOS)
• companion/components/event-type-list-item/EventTypeListItem.ios.tsx - Dynamic minHeight fix
• companion/app/(tabs)/(event-types)/index.ios.tsx - Cleaned up unused key logic

Testing

• Verified Android navbar displays correctly in light mode with proper icon tinting
• Verified logout clears all cached data
• Verified iOS event type badges display with proper spacing across all badge configurations

[cubic-dev-ai]

1 issue found across 6 files

Prompt for AI agents (all issues)

Check if these issues are valid — if so, understand the root cause of each and fix them.


<file name="companion/contexts/AuthContext.tsx">

<violation number="1" location="companion/contexts/AuthContext.tsx:148">
P2: If clearQueryCache throws, logout skips resetAuthState and leaves the user authenticated. Catch cache-clear errors separately so logout state reset always runs.</violation>
</file>

_{Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.}

[github-actions]

Devin AI is addressing Cubic AI's review feedback

A Devin session has been created to address the issues identified by Cubic AI.

View Devin Session