Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(native-app): update vehicle list query in app #16824

Merged
merged 4 commits into from
Dec 5, 2024

Conversation

thoreyjona
Copy link
Contributor

@thoreyjona thoreyjona commented Nov 12, 2024

What

Use vehicleListV2 endpoint for app like service portal is using.

NOTE
Don't merge until after next release (26th of November)

Checklist:

  • I have performed a self-review of my own code
  • I have made corresponding changes to the documentation
  • My changes generate no new warnings
  • I have added tests that prove my fix is effective or that my feature works
  • Formatting passes locally with my changes
  • I have rebased against main before asking for a review

Summary by CodeRabbit

  • New Features

    • Introduced a new vehicle listing query (ListVehiclesV2) for improved data retrieval.
    • Updated vehicle fragment to include new fields (make, colorName, nextMainInspection) and removed outdated fields.
  • Bug Fixes

    • Enhanced vehicle data fetching mechanism by updating hooks and query structures.
    • Improved handling of inspection dates and vehicle identification in the user interface.
  • Documentation

    • Updated component logic to align with new data structures and ensure accurate rendering of vehicle information.

@thoreyjona thoreyjona changed the title feat(native-app): update vehicle list query in app feat(native-app): update vehicle list query in app - DO NOT MERGe Nov 12, 2024
@thoreyjona thoreyjona changed the title feat(native-app): update vehicle list query in app - DO NOT MERGe feat(native-app): update vehicle list query in app - DO NOT MERGE Nov 12, 2024
@thoreyjona thoreyjona force-pushed the feat/update-vehicle-list-app branch from 982d1f5 to 983478b Compare November 21, 2024 15:08
@thoreyjona thoreyjona requested a review from a team as a code owner November 21, 2024 15:08
Copy link
Contributor

coderabbitai bot commented Nov 21, 2024

Walkthrough

The pull request introduces significant updates to the vehicle-related GraphQL queries and fragments in the application. The VehicleFragment has been restructured, changing its type and modifying the fields it exposes. A new query, ListVehiclesV2, replaces the old ListVehicles query, along with corresponding changes to input types and data handling across various components. The updates affect how vehicle data is fetched, processed, and rendered in the application, ensuring alignment with the new data structure.

Changes

File Path Change Summary
apps/native/app/src/graphql/fragments/vehicle.fragment.graphql - Fragment type changed from VehiclesVehicle to VehicleListed.
- Multiple fields removed and new fields added, including renaming of canRegisterMileage to canRegisterMilage.
apps/native/app/src/graphql/queries/vehicles.graphql - New query ListVehiclesV2 introduced, replacing ListVehicles.
- Input type changed from GetVehiclesForUserInput! to GetVehiclesListV2Input!.
apps/native/app/src/screens/home/home.tsx - Hook renamed from useListVehiclesQuery to useListVehiclesV2Query.
- Input parameters updated by removing showDeregeristered and showHistory.
apps/native/app/src/screens/home/vehicles-module.tsx - Hook and query renamed from ListVehiclesQuery and useListVehiclesQuery to ListVehiclesV2Query and useListVehiclesV2Query.
- Data type updated in various functions to reflect new structure.
apps/native/app/src/screens/vehicles/components/vehicle-item.tsx - Type definition updated to use ListVehiclesV2Query.
- Logic updated for accessing inspection dates and navigation titles.
apps/native/app/src/screens/vehicles/vehicles.tsx - Transition from ListVehiclesQuery to ListVehiclesV2Query.
- Type definitions updated and handling of data response adjusted.

Possibly related PRs

Suggested labels

automerge, deploy-feature

Suggested reviewers

  • snaerseljan

📜 Recent review details

Configuration used: .coderabbit.yaml
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between 983478b and 8e85149.

📒 Files selected for processing (1)
  • apps/native/app/src/graphql/fragments/vehicle.fragment.graphql (1 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
apps/native/app/src/graphql/fragments/vehicle.fragment.graphql (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 (3)
apps/native/app/src/graphql/fragments/vehicle.fragment.graphql (3)

8-8: LGTM: Field name is correctly spelled.

The field canRegisterMileage is now correctly spelled, addressing the typo mentioned in the previous review.


1-1: Verify the fragment type change impact.

The fragment type has changed from VehiclesVehicle to VehicleListed, which aligns with the PR objective of using the vehicleListV2 endpoint. However, we should verify that all consumers of this fragment have been updated accordingly.

✅ Verification successful

Fragment type change is safe to proceed

The verification shows that the fragment type change from VehiclesVehicle to VehicleListed is properly aligned with the codebase:

  1. The fragment is only used in the ListVehiclesV2 query which explicitly uses the new vehiclesListV2 endpoint
  2. The old type VehiclesVehicle in client.ts is only used for cache ID generation and doesn't affect the query execution
  3. The GetVehicle query uses a different response structure, so it's not impacted by this fragment change
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Find all GraphQL operations using this fragment to ensure they're compatible with the new type

# Search for GraphQL operations using VehicleFragment
rg -t graphql "\.\.\.VehicleFragment" apps/

Length of output: 77


Script:

#!/bin/bash
# Search for files containing VehicleFragment without file type restriction
rg "\.\.\.VehicleFragment" apps/

Length of output: 112


Script:

#!/bin/bash
# Find all GraphQL files in the apps directory
fd "\.(graphql|gql)$" apps/

Length of output: 5821


Script:

#!/bin/bash
# Search for any references to VehiclesVehicle (old type) or VehicleListed (new type)
rg "Vehicle(sVehicle|Listed)" apps/

Length of output: 300


Script:

#!/bin/bash
# Check the vehicles.graphql query to understand how the fragment is being used
cat apps/native/app/src/graphql/queries/vehicles.graphql

# Check the client.ts file to understand the type handling
cat apps/native/app/src/graphql/client.ts

Length of output: 8553


1-10: Verify the removal of fields.

The fragment has been significantly simplified by removing many fields. Please confirm that the removed fields (e.g., vin, type, firstRegDate, etc.) are not required by any components in the native app.

✅ Verification successful

The removal of fields from VehicleFragment appears safe

Based on the codebase analysis:

  1. The VehicleFragment is only used in the ListVehiclesV2 query, which only displays a list view of vehicles
  2. The detailed vehicle information (including removed fields like vin, firstRegDate, etc.) is handled by a separate GetVehicle query
  3. No direct references to the removed fields were found in the application code where the VehicleFragment is used
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Search for any usage of removed fields in the codebase

# Search for references to removed fields in TypeScript/JavaScript files
echo "Searching for references to removed fields..."
rg -t typescript -t javascript "vin|firstRegDate|productYear|registrationType|role|operatorStartDate|operatorEndDate|outOfUse|otherOwners|termination|buyerPersidno|ownerPersidno|vehicleStatus|useGroup|vehGroup|plateStatus" apps/native/

Length of output: 373


Script:

#!/bin/bash
# Search for references to removed fields in all text files within native app
echo "Searching for references to removed fields..."
rg "vin|firstRegDate|productYear|registrationType|role|operatorStartDate|operatorEndDate|outOfUse|otherOwners|termination|buyerPersidno|ownerPersidno|vehicleStatus|useGroup|vehGroup|plateStatus" apps/native/

# Also check for any other GraphQL fragments or queries that might be using VehicleFragment
echo -e "\nSearching for VehicleFragment usage..."
rg "VehicleFragment" apps/native/

Length of output: 8514


Script:

#!/bin/bash
# Let's check the vehicles.graphql query to see what fields it's actually using
echo "Content of vehicles.graphql query:"
cat apps/native/app/src/graphql/queries/vehicles.graphql

# Let's also check any TypeScript interfaces or types that might be using these fields
echo -e "\nChecking for VehicleListed type definitions:"
rg "VehicleListed" apps/native/

Length of output: 2629


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?

❤️ Share
🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Generate unit testing code for this file.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai generate unit testing code for this file.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read src/utils.ts and generate unit testing code.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    • @coderabbitai help me debug CodeRabbit configuration file.

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 using PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

Copy link
Contributor

@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: 5

🧹 Outside diff range and nitpick comments (5)
apps/native/app/src/screens/vehicles/components/vehicle-item.tsx (2)

9-12: Consider using a date utility library for more robust date handling

The custom differenceInMonths function could be replaced with a more robust solution like date-fns which handles edge cases better.

Example implementation using date-fns:

import { differenceInMonths } from 'date-fns'

Line range hint 23-85: Well-structured component with good optimization

The component follows React Native best practices with:

  • Proper use of React.memo for performance optimization
  • Styled components for consistent styling
  • Clear separation of concerns between display and data handling

However, consider breaking down the component further to improve maintainability:

  1. Extract the inspection deadline logic into a custom hook
  2. Move the styled components to a separate file
  3. Create a separate component for the inspection label

Example hook extraction:

function useInspectionStatus(nextMainInspection: string | null, requiresMileageRegistration: boolean) {
  const nextInspection = useMemo(() => {
    return nextMainInspection && !isNaN(Date.parse(nextMainInspection))
      ? new Date(nextMainInspection)
      : null
  }, [nextMainInspection])

  const isInspectionDeadline = useMemo(() => {
    return nextInspection
      ? differenceInMonths(new Date(nextInspection), new Date()) < 0
      : false
  }, [nextInspection])

  return {
    nextInspection,
    isInspectionDeadline,
    requiresMileageRegistration
  }
}
apps/native/app/src/screens/home/vehicles-module.tsx (2)

62-62: Consider extracting the sorting logic into a utility function.

The vehicle sorting logic could be moved to a separate utility function to improve maintainability and testability. This would also make the component more focused on its primary responsibility of rendering.

Example:

const sortVehiclesByMileageRegistration = (vehicles: Vehicle[]) => 
  vehicles.sort((a, b) => {
    if (a.requiresMileageRegistration && !b.requiresMileageRegistration) return -1;
    if (!a.requiresMileageRegistration && b.requiresMileageRegistration) return 1;
    return 0;
  });

Line range hint 1-173: Consider splitting the component for better separation of concerns.

The VehiclesModule component currently handles multiple responsibilities:

  1. Data transformation (sorting vehicles)
  2. Conditional rendering logic
  3. Layout and styling

Consider splitting this into smaller, more focused components:

  • VehiclesList (handling the list rendering)
  • VehiclesSorter (handling the sorting logic)
  • VehiclesHeader (handling the header with "See All" button)

This would improve maintainability, testability, and reusability.

apps/native/app/src/screens/vehicles/vehicles.tsx (1)

35-35: Simplify type definition by removing redundant NonNullable

The type definition of VehicleListItem uses redundant NonNullable wrappers. Simplifying it can improve readability without affecting type safety.

Apply this diff to simplify the type:

-type VehicleListItem = NonNullable<
-  NonNullable<ListVehiclesV2Query['vehiclesListV2']>['vehicleList']
->[0]
+type VehicleListItem = NonNullable<
+  ListVehiclesV2Query['vehiclesListV2']['vehicleList']
+>[0]
📜 Review details

Configuration used: .coderabbit.yaml
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between ae1a547 and 983478b.

📒 Files selected for processing (6)
  • apps/native/app/src/graphql/fragments/vehicle.fragment.graphql (1 hunks)
  • apps/native/app/src/graphql/queries/vehicles.graphql (1 hunks)
  • apps/native/app/src/screens/home/home.tsx (2 hunks)
  • apps/native/app/src/screens/home/vehicles-module.tsx (5 hunks)
  • apps/native/app/src/screens/vehicles/components/vehicle-item.tsx (3 hunks)
  • apps/native/app/src/screens/vehicles/vehicles.tsx (7 hunks)
🧰 Additional context used
📓 Path-based instructions (6)
apps/native/app/src/graphql/fragments/vehicle.fragment.graphql (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/graphql/queries/vehicles.graphql (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/home.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/vehicles-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/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/vehicles.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."
🔇 Additional comments (16)
apps/native/app/src/graphql/fragments/vehicle.fragment.graphql (2)

1-9: Verify the impact of removed fields on dependent components

The fragment has undergone significant changes, switching from VehiclesVehicle to VehicleListed type and removing many fields. This could potentially break components that depend on the removed fields.

Let's verify the usage of removed fields in the codebase:

✅ Verification successful

Fragment changes appear safe to proceed

The codebase analysis shows that the removed fields from the VehicleFragment are not actively used in the application code. The only references found are:

  • nextInspection which has been replaced with nextMainInspection (already handled in vehicle-item.tsx)
  • useGroup and plateStatus only appear in a separate vehicles query
  • The old type VehiclesVehicle is only referenced in the Apollo client for caching purposes

The migration to VehicleListed type appears to be a coordinated change as part of the vehicleListV2 endpoint update, with proper handling of the new fields in the codebase.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for usage of removed fields in TypeScript/JavaScript files
rg -t typescript -t javascript "vin|firstRegDate|productYear|registrationType|role|operatorStartDate|operatorEndDate|outOfUse|otherOwners|termination|buyerPersidno|ownerPersidno|vehicleStatus|useGroup|vehGroup|plateStatus|nextInspection" apps/native/app/src/

Length of output: 295


Script:

#!/bin/bash
# Search for usage of removed fields in all files within the app directory
rg "vin|firstRegDate|productYear|registrationType|role|operatorStartDate|operatorEndDate|outOfUse|otherOwners|termination|buyerPersidno|ownerPersidno|vehicleStatus|useGroup|vehGroup|plateStatus|nextInspection" apps/native/app/src/

# Also check for any other GraphQL operations using the old VehiclesVehicle type
rg "VehiclesVehicle" apps/native/app/src/

# Let's also check for any components that import and use this fragment
rg "VehicleFragment" apps/native/app/src/

Length of output: 9718


1-1: Verify schema compatibility

Need to verify that the VehicleListed type and its new fields exist in the schema to prevent runtime errors.

Let's verify the schema compatibility:

✅ Verification successful

Schema compatibility verified

The VehicleListed type exists in the schema and includes all the necessary fields. The type is properly defined in libs/api/domains/vehicles/src/lib/models/usersVehicles.model.ts with the fields make, colorName, and nextMainInspection all properly declared as nullable fields using the @Field decorator.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for VehicleListed type definition in schema files
rg -t graphql "type VehicleListed" 

# Search for field definitions
ast-grep --pattern 'type VehicleListed {
  $$$
  make: $_
  colorName: $_
  nextMainInspection: $_
  $$$
}'

Length of output: 178


Script:

#!/bin/bash
# Search for schema files with common extensions
fd "\.(graphql|gql|schema)$"

# Then search for VehicleListed in all files
rg "VehicleListed"

# Also search specifically in schema directory if it exists
fd -t f . schema/ || true

Length of output: 20712


Script:

#!/bin/bash
# Let's examine the VehicleListed model definition
cat libs/api/domains/vehicles/src/lib/models/usersVehicles.model.ts

Length of output: 5584

apps/native/app/src/graphql/queries/vehicles.graphql (3)

Line range hint 13-143: Verify GetVehicle query compatibility

While this query remains unchanged, we should verify that none of its fields are affected by the backend changes to the vehicle list endpoint.

✅ Verification successful

No compatibility issues found with GetVehicle query

Based on the codebase analysis, the GetVehicle query and its associated types remain stable and consistent. The query is used across multiple parts of the application with the same structure, and there are no conflicting type definitions or breaking changes in the schema that would affect the fields being queried.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Check for any changes to the vehicle detail types in the schema
ast-grep --pattern 'type GetVehicleDetailInput'
ast-grep --pattern 'type VehicleDetail'

Length of output: 91


Script:

#!/bin/bash
# Let's try searching for GraphQL schema files and type definitions
fd -e graphql -e gql . --exec cat {} \; | grep -A 5 "type.*Vehicle"

# Also search for any recent changes to vehicle-related files
fd -e graphql -e gql -e ts -e tsx . | grep -i "vehicle" | xargs cat 2>/dev/null | grep -A 5 "type.*Vehicle\|input.*Vehicle"

# Let's also check for any fragments used in the query
fd -e graphql -e gql . --exec cat {} \; | grep -A 5 "fragment VehicleMileageDetailFragment"

Length of output: 24591


1-2: ⚠️ Potential issue

Breaking Changes Alert: Coordinate deployment with backend

This introduces breaking changes in the query name, input type, and field name. Ensure this change is coordinated with the backend deployment and the November 26th release timeline.

Let's verify the fragment compatibility and usage:

✅ Verification successful

Breaking changes verified - Fragment compatibility confirmed

The VehicleFragment is correctly used in the ListVehiclesV2 query and all references to the query have been updated to use the V2 version in the codebase. The fragment's type VehicleListed remains compatible with the new query structure. Key findings:

  • Fragment is properly referenced in the new query using ...VehicleFragment
  • All TypeScript files are using the updated ListVehiclesV2Query and useListVehiclesV2Query
  • No legacy query usage found in the codebase

The only remaining consideration is the deployment timing coordination with the backend for November 26th.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Check if the VehicleFragment is updated to match the new schema
ast-grep --pattern 'fragment VehicleFragment on $_'

# Check for any remaining usage of the old query
rg 'ListVehicles\(' --type ts

Length of output: 85


Script:

#!/bin/bash
# Let's try a broader search for fragments and query usage
# Search for fragment definitions
rg -l 'fragment.*Vehicle' --type graphql

# Search for any GraphQL fragments used in the vehicles query
rg -A 5 'query ListVehiclesV2' --type graphql

# Search for old and new query usages in TypeScript files
rg -l 'useListVehicles|ListVehicles' --type ts

Length of output: 413


Script:

#!/bin/bash
# Let's check the content of files using the query to understand the impact
rg -B2 -A2 'ListVehicles' apps/native/app/src/screens/vehicles/vehicles.tsx apps/native/app/src/screens/home/home.tsx apps/native/app/src/screens/home/vehicles-module.tsx

# Let's also check the fragments by removing the file type restriction
rg -l 'fragment.*Vehicle'

Length of output: 3993


Script:

#!/bin/bash
# Let's check the vehicle fragment content
cat apps/native/app/src/graphql/fragments/vehicle.fragment.graphql

# Check if the fragment is used in the vehicles query
cat apps/native/app/src/graphql/queries/vehicles.graphql

Length of output: 2540


Line range hint 1-12: Verify pagination implementation

The query structure maintains the same pagination fields. However, we should verify that the pagination implementation in the UI components has been updated to work with the new query.

✅ Verification successful

Let me search for the vehicle-related pagination implementation to verify if it needs updates.


Let me try again with the correct file type flag.


Let me try one more time with just searching through TypeScript files.


Based on the search results, I can now provide a final response:

Pagination implementation is correctly handled in the UI components

The pagination implementation in the UI components is already compatible with the new query structure. The code shows that:

  • In apps/native/app/src/screens/vehicles/vehicles.tsx, the pagination is correctly implemented using pageNumber and totalPages from the vehiclesListV2 response
  • The pagination data is properly handled for infinite scrolling in the native app
  • The query response structure matches the expected format with paging object containing pageNumber, totalPages, and other pagination fields
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Look for pagination-related code that might need updates
rg -A 5 'pageNumber|pageSize|totalPages|totalRecords' --type ts

Length of output: 101545


Script:

#!/bin/bash
# Look for vehicle-related components that use pagination
rg -A 5 "vehiclesListV2|vehiclesList" --type tsx

Length of output: 78


Script:

#!/bin/bash
# Look for vehicle-related components that use pagination
rg -A 5 "vehiclesListV2|vehiclesList" --type ts --type tsx

Length of output: 88


Script:

#!/bin/bash
# Look for vehicle-related components that use pagination
rg -A 5 "vehiclesListV2|vehiclesList" --type ts

# Also search for any files that might be importing this query
rg -A 2 "import.*vehicles\.graphql" --type ts

Length of output: 14098

apps/native/app/src/screens/vehicles/components/vehicle-item.tsx (2)

6-6: LGTM! Type definitions properly updated for the new V2 query

The type changes correctly reflect the new data structure from vehicleListV2 endpoint while maintaining type safety through proper use of NonNullable.

Also applies to: 14-14


54-54: Verify consistent usage of make and colorName across the app

The changes from type to make and color to colorName look good, but let's ensure these new fields are consistently used across other components.

Also applies to: 60-61

apps/native/app/src/screens/home/vehicles-module.tsx (3)

52-52: LGTM! Props interface is properly typed.

The interface update correctly reflects the V2 query type changes.


173-173: Verify the usage of exported items.

The exports have been updated correctly for V2. Let's verify their usage across the codebase.

✅ Verification successful

All exported items are being used appropriately in the codebase

The verification shows that both useListVehiclesV2Query and validateVehiclesInitialData are actively used:

  • useListVehiclesV2Query is used in home.tsx and vehicles.tsx
  • validateVehiclesInitialData is used in home.tsx
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the usage of exported items
# Check for usage of the exported hook and validation function
rg "useListVehiclesV2Query|validateVehiclesInitialData" -g '!*.{md,txt,graphql}'

Length of output: 891


20-21: Verify the V2 query implementation and types.

The transition to V2 query looks good. However, let's ensure the new query is properly implemented.

✅ Verification successful

Migration to ListVehiclesV2Query is properly implemented

The verification shows that:

  1. The V2 query is properly defined in vehicles.graphql with correct schema and types
  2. All references to the query in the codebase use the V2 version
  3. The implementation in vehicles-module.tsx correctly uses the new types and query hook
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the V2 query implementation and types
# Check if the query is properly defined in the schema
ast-grep --pattern 'query ListVehiclesV2'

# Check if there are any remaining references to the old query
rg 'ListVehiclesQuery|useListVehiclesQuery' -g '!*.{md,txt}'

Length of output: 106


Script:

#!/bin/bash
# Let's try a different approach to verify the GraphQL queries

# Search for GraphQL query definitions and usages
rg -t graphql -t typescript "ListVehiclesV2" -A 5

# Check for any GraphQL schema files
fd -e graphql

# Look for generated types related to vehicles
fd -g "*vehicle*.ts" -g "*vehicle*.tsx" --exec grep -l "ListVehicles"

# Check for any remaining old query references in the codebase
rg "useListVehicles(?!V2)" -g "*.{ts,tsx}"

Length of output: 20438


Script:

#!/bin/bash
# Let's check the GraphQL query definitions and usages with a simpler approach

# Check the vehicles.graphql file content
cat apps/native/app/src/graphql/queries/vehicles.graphql

# Look for any references to ListVehicles in typescript files
rg "ListVehicles" -g "*.{ts,tsx}" -A 2

# Check the specific module file
cat "apps/native/app/src/screens/home/vehicles-module.tsx"

Length of output: 9908

apps/native/app/src/screens/home/home.tsx (2)

58-58: LGTM! Import statement updated correctly.

The import statement has been updated to use the new V2 query hook while maintaining consistency with other module imports.


177-184: Verify removal of query parameters.

The query implementation looks good, but we should verify the impact of removing showDeregeristered and showHistory parameters from the input object.

Let's verify the changes in the GraphQL schema and related components:

✅ Verification successful

Parameters can be safely removed

Based on the search results, the removal of showDeregeristered and showHistory parameters from the ListVehiclesV2Query input is safe because:

  1. The new query implementation in apps/native/app/src/graphql/queries/vehicles.graphql doesn't include these parameters in its schema.
  2. The only remaining references to these parameters in the native app are in the vehicle history screen (libs/portals/my-pages/assets/src/screens/VehicleHistory/), which uses a different query.
  3. The parameters were previously used in the vehicles API (libs/api/domains/vehicles/), but the V2 version of the query has been updated to not require these parameters.
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the impact of removing query parameters

# Check if any components still reference the old parameters
rg -l "showDeregeristered|showHistory" "apps/native"

# Check GraphQL schema changes
ast-grep --pattern 'type ListVehiclesV2Input {
  $$$
}'

Length of output: 110


Script:

#!/bin/bash
# Let's try a different approach to verify the schema and usage

# Check GraphQL schema files for ListVehiclesV2Input
fd -e graphql -e gql | xargs rg -l "ListVehiclesV2Input"

# Search for any references to these parameters in TypeScript/JavaScript files
rg "showDeregeristered|showHistory" --type=ts --type=tsx -C 3

# Look for the query definition
rg "useListVehiclesV2Query|ListVehiclesV2Query" --type=ts --type=tsx -C 3

Length of output: 252


Script:

#!/bin/bash
# Let's try without file type specifications since tsx isn't recognized

# Find GraphQL schema files
fd -e graphql -e gql

# Search for any references to these parameters
rg "showDeregeristered|showHistory"

# Look for the query definition and its usage
rg "ListVehiclesV2" -C 3

Length of output: 29780

apps/native/app/src/screens/vehicles/vehicles.tsx (4)

17-18: Updated imports to use ListVehiclesV2

The imports have been correctly updated to use ListVehiclesV2Query and useListVehiclesV2Query, aligning with the new GraphQL schema.


78-80: Correctly initialized useListVehiclesV2Query hook

The query hook useListVehiclesV2Query is properly initialized with the correct variables, ensuring data is fetched using the updated GraphQL query.


150-150: Data mapping updated to new query structure

The data mapping has been appropriately updated to use vehiclesListV2.vehicleList, correctly reflecting the new data structure from the GraphQL query.


203-207: Correctly merging previous and new vehicle lists

The updateQuery function combines the previous and new vehicleList arrays correctly, ensuring that data from multiple pages is concatenated properly for infinite scrolling.

@thoreyjona thoreyjona changed the title feat(native-app): update vehicle list query in app - DO NOT MERGE feat(native-app): update vehicle list query in app Nov 22, 2024
Copy link

codecov bot commented Nov 22, 2024

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 35.77%. Comparing base (5a1b1a6) to head (18d0622).
Report is 1 commits behind head on main.

Additional details and impacted files

Impacted file tree graph

@@            Coverage Diff             @@
##             main   #16824      +/-   ##
==========================================
+ Coverage   35.75%   35.77%   +0.02%     
==========================================
  Files        6925     6929       +4     
  Lines      147603   148590     +987     
  Branches    42022    42496     +474     
==========================================
+ Hits        52772    53159     +387     
- Misses      94831    95431     +600     
Flag Coverage Δ
api 3.33% <ø> (ø)
api-domains-auth-admin 48.49% <ø> (ø)
application-system-api 38.76% <ø> (-0.02%) ⬇️
application-template-api-modules 27.81% <ø> (ø)
application-ui-shell 22.48% <ø> (ø)
services-auth-admin-api 52.56% <ø> (ø)
services-auth-delegation-api 58.55% <ø> (+0.08%) ⬆️
services-auth-ids-api 52.54% <ø> (-0.01%) ⬇️
services-auth-public-api 49.41% <ø> (ø)
services-sessions 65.45% <ø> (ø)
services-university-gateway 49.43% <ø> (-0.09%) ⬇️
services-user-notification 46.63% <ø> (ø)
services-user-profile 56.93% <ø> (-0.09%) ⬇️
skilavottord-ws 24.35% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

see 427 files with indirect coverage changes


Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 5a1b1a6...18d0622. Read the comment docs.

@datadog-island-is
Copy link

datadog-island-is bot commented Nov 22, 2024

Datadog Report

All test runs 299c95b 🔗

17 Total Test Services: 0 Failed, 14 Passed
🔻 Test Sessions change in coverage: 2 decreased, 1 increased (+0.04%), 42 no change

Test Services
This report shows up to 10 services
Service Name Failed Known Flaky New Flaky Passed Skipped Total Time Code Coverage Change Test Service View
api 0 0 0 4 0 3.41s 1 no change Link
api-domains-auth-admin 0 0 0 18 0 15.33s 1 no change Link
application-system-api 0 0 0 46 0 2m 23.47s 1 no change Link
application-template-api-modules 0 0 0 118 0 2m 26.7s 1 no change Link
application-ui-shell 0 0 0 74 0 33.46s 1 no change Link
auth-api-lib 0 0 0 20 0 35.49s 1 no change Link
services-auth-admin-api 0 0 0 130 0 3m 51.25s 1 no change Link
services-auth-delegation-api 0 0 0 270 0 3m 21.4s 1 increased (+0.04%) Link
services-auth-ids-api 0 0 0 262 0 1m 28.07s 1 no change Link
services-auth-personal-representative 0 0 0 0 0 306.54ms 1 no change Link

🔻 Code Coverage Decreases vs Default Branch (2)

  • services-user-profile - jest 49.31% (-0.03%) - Details
  • services-university-gateway - jest 45.25% (-0.02%) - Details

Copy link
Member

@snaerth snaerth left a comment

Choose a reason for hiding this comment

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

Nice. LGTM 👏

@thoreyjona thoreyjona added the automerge Merge this PR as soon as all checks pass label Dec 5, 2024
@kodiakhq kodiakhq bot merged commit 4704971 into main Dec 5, 2024
72 checks passed
@kodiakhq kodiakhq bot deleted the feat/update-vehicle-list-app branch December 5, 2024 15:06
thorhildurt pushed a commit that referenced this pull request Dec 11, 2024
* feat: update vehicleList endpoint to V2

* fix: remove comment

* fix: update typo  after fix from Hugsmidjan

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
automerge Merge this PR as soon as all checks pass
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants