Skip to content

feat: Add different vehicles' services#69

Merged
StoynovAngel merged 2 commits into
mainfrom
feat/add-services
May 5, 2026
Merged

feat: Add different vehicles' services#69
StoynovAngel merged 2 commits into
mainfrom
feat/add-services

Conversation

@StoynovAngel
Copy link
Copy Markdown
Owner

@StoynovAngel StoynovAngel commented May 5, 2026

Summary by CodeRabbit

Release Notes

  • New Features
    • Added service selection screen with multiple transport options including ambulance, medical transport, logistics, taxi, rental, funeral, and prom services
    • Users can now select their desired service type from an interactive grid display
    • Added Bulgarian and English language translations for all service options

@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented May 5, 2026

Warning

Rate limit exceeded

@StoynovAngel has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 41 minutes and 15 seconds before requesting another review.

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 @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

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 configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: dc794f01-5d1e-4ccd-a491-16698f0b5fce

📥 Commits

Reviewing files that changed from the base of the PR and between 1ba7131 and 2c8e3c1.

📒 Files selected for processing (1)
  • frontend/src/components/home/Body.style.tsx
📝 Walkthrough

Walkthrough

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

Changes

Vehicle Service Selection Interface

Layer / File(s) Summary
Type Definitions
frontend/src/types/vehicle.ts
Adds VehicleType enum (AMBULANCE, LOGISTICS, TAXI, RENTAL, FUNERAL, PROM) and VehicleOption interface with type, label, icon, color, and description fields.
Constants & Options
frontend/src/constants/vehicleOptions.ts
Exports getVehicleOptions(t) that constructs an array of VehicleOption objects with fixed icons/colors and translated labels/descriptions.
Internationalization
frontend/src/assets/translate/bg.json, frontend/src/assets/translate/en.json
Adds Bulgarian and English translation entries for service selection title, prompt, and all six service types with corresponding transport labels.
Component Styling
frontend/src/components/home/Body.style.tsx, frontend/src/components/navigation/Header.style.tsx, frontend/src/screens/home/Home.style.tsx
Updates container backgrounds to use theme colors, adds vehicle grid/card styling (flex layout, icon containers, labels, descriptions), and adjusts padding/centering.
UI Implementation
frontend/src/components/home/Body.tsx
Replaces the register button with a scrollable vehicle selection screen; imports translation/theme hooks, builds vehicle options, renders a grid of pressable cards with icons and text, and defines a handleVehicleSelect callback.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Poem

🐰 A selection of rides now greets the eyes,
Ambulances, taxis beneath the skies,
Styled with care and colors so bright,
Translations in place, everything right!
From types to cards, the service flow flies! 🚕

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title 'feat: Add different vehicles' services' directly reflects the main change: adding a vehicle service selection interface with multiple service types (ambulance, medical-transport, logistics, taxi, rental, funeral, prom).
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch feat/add-services

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

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Copy Markdown

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🧹 Nitpick comments (4)
frontend/src/constants/vehicleOptions.ts (2)

3-3: 💤 Low value

Consider using TFunction from react-i18next instead 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 t as TFunction from react-i18next keeps 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 win

Typed icon field in VehicleOption should use ComponentProps<typeof MaterialIcons>['name'] to enable compile-time icon name validation.

Currently VehicleOption.icon is typed as string, and the consumer in Body.tsx casts it with as 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 the as any cast.

♻️ 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 in MaterialIcons from @expo/vector-icons version 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 win

Remove console.log debug statement before merging.

console.log('Selected vehicle type:', type) is a debug artifact that should not ship to production. The TODO comment 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 value

Inconsistent 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

📥 Commits

Reviewing files that changed from the base of the PR and between e8e615b and 1ba7131.

📒 Files selected for processing (8)
  • frontend/src/assets/translate/bg.json
  • frontend/src/assets/translate/en.json
  • frontend/src/components/home/Body.style.tsx
  • frontend/src/components/home/Body.tsx
  • frontend/src/components/navigation/Header.style.tsx
  • frontend/src/constants/vehicleOptions.ts
  • frontend/src/screens/home/Home.style.tsx
  • frontend/src/types/vehicle.ts

Comment thread frontend/src/components/home/Body.style.tsx
Comment thread frontend/src/components/home/Body.style.tsx
@sonarqubecloud
Copy link
Copy Markdown

sonarqubecloud Bot commented May 5, 2026

@StoynovAngel StoynovAngel merged commit 23d00b8 into main May 5, 2026
7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant