feat(native-app): minor UI fixes #15405
Conversation
WalkthroughThe recent updates primarily involve restructuring communication settings, particularly focusing on notification preferences for email and in-app alerts. Additionally, state management and asynchronous updates for email notifications have been introduced. UI adjustments in various components, including the replacement of text styling utilities and changes to button visibility and condition rendering, have also been made. Furthermore, minor updates include modifying properties such as Changes
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Files selected for processing (7)
- apps/native/app/src/messages/en.ts (1 hunks)
- apps/native/app/src/messages/is.ts (1 hunks)
- apps/native/app/src/screens/applications/applications.tsx (1 hunks)
- apps/native/app/src/screens/home/applications-module.tsx (4 hunks)
- apps/native/app/src/screens/settings/settings.tsx (4 hunks)
- apps/native/app/src/ui/lib/card/vehicle-card.tsx (3 hunks)
- apps/native/app/src/utils/get-main-root.ts (1 hunks)
Additional context used
Path-based instructions (7)
apps/native/app/src/ui/lib/card/vehicle-card.tsx (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
apps/native/app/src/screens/home/applications-module.tsx (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
apps/native/app/src/utils/get-main-root.ts (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
apps/native/app/src/screens/applications/applications.tsx (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
apps/native/app/src/screens/settings/settings.tsx (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
apps/native/app/src/messages/en.ts (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
apps/native/app/src/messages/is.ts (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
Additional comments not posted (13)
apps/native/app/src/ui/lib/card/vehicle-card.tsx (5)
6-6: Good practice: Use ofTypographyfor consistent text styling.The import of
Typographyimproves the consistency of text styling across the application.
31-31: Improvement: Consistent padding and margin forTitle.Using theme spacing for padding and margin ensures consistent spacing across the application.
36-36: Improvement: Consistent padding forText.Using theme spacing for padding ensures consistent spacing across the application.
44-46: Addition:Labelstyled component.The introduction of the
Labelcomponent adds flexibility for additional content and maintains consistent spacing with the theme.
59-63: Usage: Proper use ofTypographycomponent forTitleandText.The use of
TypographyforTitleandTextensures consistent text styling.apps/native/app/src/screens/home/applications-module.tsx (3)
27-27: Addition:hideSeeAllButtonprop inApplicationsModuleProps.The new prop
hideSeeAllButtonallows control over the visibility of the "See All" button.
36-36: Default value:hideSeeAllButtonset tofalse.Setting a default value for
hideSeeAllButtonensures backward compatibility.
82-82: Conditional rendering: "See All" button based onhideSeeAllButtonprop.The "See All" button is conditionally rendered based on the
hideSeeAllButtonprop, providing flexibility in UI.apps/native/app/src/utils/get-main-root.ts (1)
19-19: Minor UI adjustment:cornerRadiusvalue change.The change in
cornerRadiusfrom 8 to 4 is a minor UI adjustment for the icon background.apps/native/app/src/screens/applications/applications.tsx (1)
206-206: Usage:hideSeeAllButtonprop set totrueinApplicationsModule.The
hideSeeAllButtonprop is correctly set totrueto hide the "See All" button in theApplicationsModule.apps/native/app/src/screens/settings/settings.tsx (1)
224-224: Ensure dependency array inuseEffecthook is exhaustive.The
useEffecthook's dependency array should include all variables that are used within the effect. Ensure thatuserProfile.datais included to avoid potential stale data issues.- }, [userProfile]) + }, [userProfile.data])apps/native/app/src/messages/en.ts (1)
80-86: LGTM! Ensure consistency across translations.The new keys for email and in-app notifications are correctly formatted and contextually appropriate.
Verify that these changes are consistently reflected in other translation files.
apps/native/app/src/messages/is.ts (1)
79-86: LGTM! Ensure consistency across translations.The new keys for email and in-app notifications are correctly formatted and contextually appropriate.
Verify that these changes are consistently reflected in other translation files.
There was a problem hiding this comment.
Actionable comments posted: 0
Outside diff range and nitpick comments (1)
apps/native/app/src/screens/vehicles/components/vehicle-item.tsx (1)
[!TIP]
Codebase VerificationVerify the impact of removing
canRegisterMileagelogic.The
canRegisterMileagelogic is still present and actively used in the codebase. Here are some specific locations where it is used:
apps/native/app/src/screens/vehicles/vehicle-mileage.screen.tsxlibs/service-portal/assets/src/screens/VehicleMileage/VehicleMileage.tsxlibs/api/domains/vehicles/src/models/usersVehicles.model.tslibs/api/domains/vehicles/src/models/getVehicleMileage.model.tslibs/api/domains/vehicles/src/utils/basicVehicleInformationMapper.tslibs/api/domains/vehicles/src/models/getVehicleDetail.model.tslibs/api/domains/vehicles/src/models/getVehicleSearch.model.tslibs/api/domains/vehicles/src/lib/api-domains-vehicles.service.tslibs/api/domains/vehicles/src/lib/api-domains-vehicles-mileage.resolver.tsEnsure that the removal of
canRegisterMileagelogic from theVehicleItemcomponent does not affect the functionality in these areas.Analysis chain
Line range hint
1-47: Verify the impact of removingcanRegisterMileagelogic.The removal of the
canRegisterMileagelogic might affect the rendering logic of theVehicleItemcomponent. Ensure that this logic is no longer needed and verify its impact on the codebase.Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the impact of removing `canRegisterMileage` logic in the codebase. # Test: Search for the usage of `canRegisterMileage` in the codebase. Expect: No remaining usage. rg --type typescript $'canRegisterMileage'Length of output: 76
Script:
#!/bin/bash # Description: Verify the impact of removing `canRegisterMileage` logic in the codebase. # Test: Search for the usage of `canRegisterMileage` in the codebase. Expect: No remaining usage. ast-grep --lang ts --pattern 'canRegisterMileage'Length of output: 49
Script:
#!/bin/bash # Description: Verify the impact of removing `canRegisterMileage` logic in the codebase. # Test: Search for the usage of `canRegisterMileage` in the codebase. Expect: No remaining usage. rg 'canRegisterMileage' --glob '**/*.ts' --glob '**/*.tsx'Length of output: 1915
Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Files selected for processing (4)
- apps/native/app/src/messages/is.ts (2 hunks)
- apps/native/app/src/screens/vehicles/components/vehicle-item.tsx (1 hunks)
- apps/native/app/src/screens/vehicles/vehicle-mileage.screen.tsx (2 hunks)
- apps/native/app/src/screens/vehicles/vehicles.tsx (1 hunks)
Files not reviewed due to errors (1)
- apps/native/app/src/screens/vehicles/vehicle-mileage.screen.tsx (no review received)
Files skipped from review due to trivial changes (1)
- apps/native/app/src/screens/vehicles/vehicles.tsx
Files skipped from review as they are similar to previous changes (1)
- apps/native/app/src/messages/is.ts
Additional context used
Path-based instructions (2)
apps/native/app/src/screens/vehicles/components/vehicle-item.tsx (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
apps/native/app/src/screens/vehicles/vehicle-mileage.screen.tsx (1)
Pattern
apps/**/*: "Confirm that the code adheres to the following:
- NextJS best practices, including file structure, API routes, and static generation methods.
- Efficient state management and server-side rendering techniques.
- Optimal use of TypeScript for component and utility type safety."
Biome
apps/native/app/src/screens/vehicles/vehicle-mileage.screen.tsx
[error] 138-147: This else clause can be omitted because previous branches break early.
Unsafe fix: Omit the else clause.
(lint/style/noUselessElse)
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Files selected for processing (3)
- apps/native/app/src/messages/en.ts (2 hunks)
- apps/native/app/src/messages/is.ts (3 hunks)
- apps/native/app/src/screens/settings/settings.tsx (6 hunks)
Files skipped from review as they are similar to previous changes (3)
- apps/native/app/src/messages/en.ts
- apps/native/app/src/messages/is.ts
- apps/native/app/src/screens/settings/settings.tsx
* fix: update settings for notifications * fix: remove see all button on applications page * fix: no space below text on vehicle card if no label * fix: no cropping of bell with red dot on android * fix: disable car milage button while submitting * fix: update vehicle milage copy * fix: remove unused code * fix: add translations for settings --------- Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
What
Minor UI fixes in the app
Screenshots / Gifs
Change in settings:
Checklist:
Summary by CodeRabbit
New Features
hideSeeAllButtonto control button visibility in Applications components.Bug Fixes
Style
Typographycomponent.Refactor