fix(cli): improve dark mode drawer contrast in uniwind template

[Zakariaaben]

Summary

• ensure drawer labels/icons in the Expo Router layout respect the current theme colors
• avoid low-contrast text in dark mode by falling back to themeColorForeground when the item isn’t focused
• keep the focused state behavior unchanged so active items still pick up the drawer accent color

Summary by CodeRabbit

• Style
  • Improved drawer navigation with dynamic visual feedback—labels and icons now change color to highlight the currently active menu item, providing clearer visual distinction across all navigation screens.

[vercel]

@Zakariaaben is attempting to deploy a commit to the Better T Stack Team on Vercel.

A member of the Team first needs to authorize it.

[coderabbitai]

Walkthrough

The drawer navigation configuration is updated to replace static labels and icons with dynamic, focus-aware components. Drawer labels now render as Text components with conditional color styling, and drawer icons receive a focused parameter to apply theme-aware coloring based on navigation focus state.

Changes

Cohort / File(s)	Summary
Drawer Navigation Focus-Aware Styling apps/cli/templates/frontend/native/uniwind/app/(drawer)/_layout.tsx.hbs	Added Text import. Converted all Drawer.Screen drawerLabel from static strings to functions rendering Text with focused-conditional color. Updated all Drawer.Screen drawerIcon functions to accept focused parameter and apply conditional coloring (themeColorForeground when unfocused). Applied consistently across Home, Tabs, Todos, and AI screens.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

• Verify that the conditional color logic is correctly applied: focused ? color : themeColorForeground across all four drawer screens
• Confirm Text component import is present and used correctly
• Ensure focused parameter is properly passed by the navigation system to all icon and label renderers

Poem

🐰 Drawer screens now shimmer bright,
With colors dancing on focus light!
Unfocused fade to theme's delight,
Navigation polish, done just right! ✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately describes the main change: improving dark mode drawer contrast by using dynamic color rendering based on focus state in the uniwind template's drawer layout.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between b9685e7 and cbf4148.

📒 Files selected for processing (1)

• apps/cli/templates/frontend/native/uniwind/app/(drawer)/_layout.tsx.hbs (4 hunks)

🔇 Additional comments (2)

apps/cli/templates/frontend/native/uniwind/app/(drawer)/_layout.tsx.hbs (2)

6-6: LGTM: Text import added for drawer labels.

The Text import is necessary for the new dynamic drawer label implementation.

---

32-37: API compatibility verified—implementation is correct.

The focused parameter is supported in both drawerLabel and drawerIcon functions, and the code correctly uses these parameters for conditional theming. Both functions receive an object with { focused, color, size } properties, and drawerLabel can return a React component. Your implementation is correct and will work as expected.

---

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

[AmanVarshney01]

Thanks @Zakariaaben ❤️