feat: Add different vehicles' services#69
Conversation
|
Warning Rate limit exceeded
To keep reviews running without waiting, you can enable usage-based add-on for your organization. This allows additional reviews beyond the hourly cap. Account admins can enable it under billing. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthroughThis PR introduces a vehicle/service selection feature by adding type definitions for vehicle types, building a vehicle options helper, adding translations for multiple languages, and replacing the home screen's register button with a styled grid interface for selecting services. ChangesVehicle Service Selection Interface
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ 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 |
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (4)
frontend/src/constants/vehicleOptions.ts (2)
3-3: 💤 Low valueConsider using
TFunctionfromreact-i18nextinstead of the hand-rolled(key: string) => string.The simplified signature works at runtime but discards i18next-specific overloads (interpolation, count, namespace, etc.), which may cause issues if usages evolve. Typing
tasTFunctionfromreact-i18nextkeeps this future-proof with no behaviour change today.♻️ Proposed refactor
-import { VehicleType, VehicleOption } from '../types/vehicle'; +import { VehicleType, VehicleOption } from '../types/vehicle'; +import type { TFunction } from 'react-i18next'; -export const getVehicleOptions = (t: (key: string) => string): VehicleOption[] => [ +export const getVehicleOptions = (t: TFunction): VehicleOption[] => [🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@frontend/src/constants/vehicleOptions.ts` at line 3, The getVehicleOptions function currently types its t parameter as (key: string) => string; replace that manual type with TFunction from react-i18next to preserve i18next overloads (interpolation, count, namespace, etc.), so update the function signature to use TFunction and add the appropriate import (import { TFunction } from 'react-i18next'), ensuring all usages still compile.
7-7: ⚡ Quick winTyped
iconfield inVehicleOptionshould useComponentProps<typeof MaterialIcons>['name']to enable compile-time icon name validation.Currently
VehicleOption.iconis typed asstring, and the consumer inBody.tsxcasts it withas any, meaning any typo in an icon name would silently render nothing at runtime. Tightening the type would catch errors at compile time and eliminate theas anycast.♻️ Proposed refactor
In
frontend/src/types/vehicle.ts:+import type { ComponentProps } from 'react'; +import type { MaterialIcons } from '@expo/vector-icons'; export interface VehicleOption { type: VehicleType; label: string; - icon: string; + icon: ComponentProps<typeof MaterialIcons>['name']; color: string; description: string; }In
frontend/src/components/home/Body.tsx:- <MaterialIcons - name={option.icon as any} + <MaterialIcons + name={option.icon}Confirm that the icon names used (
'medical-services','local-shipping','local-taxi','car-rental','church','celebration') are all valid entries inMaterialIconsfrom@expo/vector-iconsversion 15.1.1, since an invalid name will silently render nothing at runtime:`@expo/vector-icons` 15.1.1 MaterialIcons valid icon names car-rental church celebration🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@frontend/src/constants/vehicleOptions.ts` at line 7, Change VehicleOption.icon from string to the typed icon name union by updating its type to ComponentProps<typeof MaterialIcons>['name'] (reference the VehicleOption type) and update the consumer in Body.tsx to remove the "as any" cast so the prop passes type-checked icon names; also verify that the literal icon values ('medical-services', 'local-shipping', 'local-taxi', 'car-rental', 'church', 'celebration') are valid entries in MaterialIcons v15.1.1 and correct any invalid names if necessary.frontend/src/components/home/Body.tsx (1)
19-22: ⚡ Quick winRemove
console.logdebug statement before merging.
console.log('Selected vehicle type:', type)is a debug artifact that should not ship to production. TheTODOcomment is fine to keep or convert to a GitHub issue.🧹 Proposed fix
const handleVehicleSelect = (type: VehicleType) => { - console.log('Selected vehicle type:', type); // TODO: Navigate to booking screen with vehicle type };🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@frontend/src/components/home/Body.tsx` around lines 19 - 22, Remove the debug console log from the handleVehicleSelect function: delete the console.log('Selected vehicle type:', type) statement in the handleVehicleSelect(type: VehicleType) handler and keep (or convert) the existing TODO about navigating to the booking screen; ensure no other stray console.* calls remain in that handler.frontend/src/assets/translate/en.json (1)
26-26: 💤 Low valueInconsistent indentation on
"prom-transport"key.Line 26 uses 4 spaces while every other key in the file uses 2 spaces. This is a cosmetic inconsistency.
🔧 Proposed fix
- "prom-transport": "Prom transportation services", + "prom-transport": "Prom transportation services",🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@frontend/src/assets/translate/en.json` at line 26, The "prom-transport" JSON key line has inconsistent indentation (4 spaces) compared to the rest of the file; locate the "prom-transport" entry in en.json and change its leading spaces to match the 2-space indentation used elsewhere so the file remains cosmetically consistent and properly aligned with other keys.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/components/home/Body.style.tsx`:
- Around line 34-46: The vehicleCard style sets borderWidth: 2 but omits
borderColor, causing a default black border; update the vehicleCard style
(object named vehicleCard) to include a themed borderColor (e.g.,
theme.colors.border or another appropriate theme color like
theme.colors.onSurface) so the border follows the app theme and contrasts
correctly with surface/background.
- Around line 8-13: The container style object content currently sets
alignItems: "center" which causes vehicleGrid to shrink-wrap and makes
vehicleCard width: '47%' compute from a reduced parent; remove alignItems from
content (or move center styling to the title/subtitle container) and ensure
vehicleGrid uses alignSelf: "stretch" or width: "100%" so vehicleGrid spans the
full horizontal space and vehicleCard's 47% behaves as two columns.
---
Nitpick comments:
In `@frontend/src/assets/translate/en.json`:
- Line 26: The "prom-transport" JSON key line has inconsistent indentation (4
spaces) compared to the rest of the file; locate the "prom-transport" entry in
en.json and change its leading spaces to match the 2-space indentation used
elsewhere so the file remains cosmetically consistent and properly aligned with
other keys.
In `@frontend/src/components/home/Body.tsx`:
- Around line 19-22: Remove the debug console log from the handleVehicleSelect
function: delete the console.log('Selected vehicle type:', type) statement in
the handleVehicleSelect(type: VehicleType) handler and keep (or convert) the
existing TODO about navigating to the booking screen; ensure no other stray
console.* calls remain in that handler.
In `@frontend/src/constants/vehicleOptions.ts`:
- Line 3: The getVehicleOptions function currently types its t parameter as
(key: string) => string; replace that manual type with TFunction from
react-i18next to preserve i18next overloads (interpolation, count, namespace,
etc.), so update the function signature to use TFunction and add the appropriate
import (import { TFunction } from 'react-i18next'), ensuring all usages still
compile.
- Line 7: Change VehicleOption.icon from string to the typed icon name union by
updating its type to ComponentProps<typeof MaterialIcons>['name'] (reference the
VehicleOption type) and update the consumer in Body.tsx to remove the "as any"
cast so the prop passes type-checked icon names; also verify that the literal
icon values ('medical-services', 'local-shipping', 'local-taxi', 'car-rental',
'church', 'celebration') are valid entries in MaterialIcons v15.1.1 and correct
any invalid names if necessary.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: a329a55e-4e33-492f-8e09-a00d27eb9894
📒 Files selected for processing (8)
frontend/src/assets/translate/bg.jsonfrontend/src/assets/translate/en.jsonfrontend/src/components/home/Body.style.tsxfrontend/src/components/home/Body.tsxfrontend/src/components/navigation/Header.style.tsxfrontend/src/constants/vehicleOptions.tsfrontend/src/screens/home/Home.style.tsxfrontend/src/types/vehicle.ts
|



Summary by CodeRabbit
Release Notes