[NAV UPGRADE - 3] Replace `useRoute` and `useParams` with `route` from component props so that params are derived from root param list

[Cal-L]

What is this about?

useRoute and useParams does not pick up on the globally defined navigation types. As a result, the navigation param types can be missed while using these hooks. For better type safety, two changes can be made for each component:

• A component's prop type definition should use StackScreenProps and reference root param list along with its associated screen name. Ex. type ComponentProp = StackScreenProps<RootParamList, 'ComponentScreenName'>
• Instead of deriving params from useRoute or useParams, access route.params from props

Scenario

No response

Design

No response

Technical Details

• A component's prop type definition should use StackScreenProps and reference root param list along with its associated screen name. Ex. type ComponentProp = StackScreenProps<RootParamList, 'ComponentScreenName'>
• Instead of deriving params from useRoute or useParams, access route.params from props
• Components being updated will need an associated entry in the root params list, which is used as reference in generic types

Threat Modeling Framework

No response

Acceptance Criteria

• Components updated using StackScreenProps and route.params should have proper type safety on available route param properties

Stakeholder review needed before the work gets merged

• Engineering (needed in most cases)
• Design
• Product
• QA (automation tests are required to pass before merging PRs but not all changes are covered by automation tests - please review if QA is needed beyond automation tests)
• Security
• Legal
• Marketing
• Management (please specify)
• Other (please specify)

References

• Draft PR from @Cal-L - 593ec0d#diff-d51192e4f4a311924c07e8729744176b6d6664bca6ae7ceef5494953df13de95R268