feat: implement useAnalytics hook and integrate automatic screen trac…

[Chrisbankz0]

#closes #83

Description

This PR resolves the issue where the AnalyticsProvider was mounted in the root layout but lacked automated and standardized tracking capabilities. It introduces automatic screen view tracking globally across the app and provides a robust set of methods in the useAnalytics hook for developers to easily track specific user interactions and errors.

Close #22
Resolves #83

Changes Made

• app/_layout.tsx:
  • Introduced an internal <ScreenTracker /> component that hooks into expo-router's usePathname and useSegments.
  • Mounted <ScreenTracker /> inside <AnalyticsProvider> to automatically emit screen_view events whenever the navigation route changes.
• src/hooks/useAnalytics.ts:
  • Added trackButtonClick(buttonName, properties) to standardize logging ui_click events.
  • Added trackFormSubmit(formName, properties) to standardize logging form_submit events.
  • Added trackError(error, isFatal, properties) to seamlessly capture api_error and crash_report events.

Testing Instructions

1. Run the app using npx expo start.
2. Screen Tracking: Navigate between different tabs and pages (e.g., Home -> Settings -> Profile). Verify in the development console or your analytics dashboard that screen_view events are firing with the correct pathname.
3. Action Tracking: Integrate trackButtonClick, trackFormSubmit, or trackError on a temporary test screen component and execute those actions. Ensure that ui_click, form_submit, and error events are successfully dispatched with their respective properties.

Impacted Files

• app/_layout.tsx
• src/hooks/useAnalytics.ts

Labels

monitoring, priority-medium

[drips-wave]

@Chrisbankz0 Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits