refactor: Replace console logging with logger utility

- Add logger import across multiple view components
- Replace console.error/warn/log with logger methods
- Update error handling to use structured logging
- Improve type safety for error objects
- Add crypto-browserify polyfill for browser environment

The changes improve logging by:
1. Using consistent logging interface
2. Adding structured error logging
3. Improving error type safety
4. Centralizing logging configuration
5. Fixing browser compatibility issues

Affected files:
- Multiple view components
- vite.config.ts
- Build configuration

src/services/api.ts

@@ -1,8 +1,8 @@
 import { AxiosError } from "axios";
-
+import { logger } from "../utils/logger";
 export const handleApiError = (error: AxiosError, endpoint: string) => {
   if (process.env.VITE_PLATFORM === "capacitor") {
-    console.error(`[Capacitor API Error] ${endpoint}:`, {
+    logger.error(`[Capacitor API Error] ${endpoint}:`, {
       message: error.message,
       status: error.response?.status,
       data: error.response?.data,
@@ -16,7 +16,7 @@ export const handleApiError = (error: AxiosError, endpoint: string) => {
 
   // Specific handling for rate limits
   if (error.response?.status === 400) {
-    console.warn(`[Rate Limit] ${endpoint}`);
+    logger.warn(`[Rate Limit] ${endpoint}`);
     return null;
   }
 

src/services/plan.ts

@@ -1,4 +1,5 @@
 import axios from "axios";
+import { logger } from "../utils/logger";
 
 interface PlanResponse {
   data?: unknown;
@@ -11,14 +12,14 @@ export const loadPlanWithRetry = async (
   retries = 3,
 ): Promise<PlanResponse> => {
   try {
-    console.log(`[Plan Service] Loading plan ${handle}, attempt 1/${retries}`);
-    console.log(
+    logger.log(`[Plan Service] Loading plan ${handle}, attempt 1/${retries}`);
+    logger.log(
       `[Plan Service] Context: Deep link handle=${handle}, isClaimFlow=${handle.includes("claim")}`,
     );
 
     // Different endpoint if this is a claim flow
     const response = await loadPlan(handle);
-    console.log(`[Plan Service] Plan ${handle} loaded successfully:`, {
+    logger.log(`[Plan Service] Plan ${handle} loaded successfully:`, {
       status: response?.status,
       headers: response?.headers,
       data: response?.data,
@@ -26,7 +27,7 @@ export const loadPlanWithRetry = async (
 
     return response;
   } catch (error: unknown) {
-    console.error(`[Plan Service] Error loading plan ${handle}:`, {
+    logger.error(`[Plan Service] Error loading plan ${handle}:`, {
       message: (error as Error).message,
       status: (error as { response?: { status?: number } })?.response?.status,
       statusText: (error as { response?: { statusText?: string } })?.response
@@ -43,7 +44,7 @@ export const loadPlanWithRetry = async (
     });
 
     if (retries > 1) {
-      console.log(
+      logger.log(
         `[Plan Service] Retrying plan ${handle}, ${retries - 1} attempts remaining`,
       );
       await new Promise((resolve) => setTimeout(resolve, 1000));
@@ -58,19 +59,19 @@ export const loadPlanWithRetry = async (
 };
 
 export const loadPlan = async (handle: string): Promise<PlanResponse> => {
-  console.log(`[Plan Service] Making API request for plan ${handle}`);
+  logger.log(`[Plan Service] Making API request for plan ${handle}`);
 
   const endpoint = handle.includes("claim")
     ? `/api/claims/${handle}`
     : `/api/plans/${handle}`;
 
-  console.log(`[Plan Service] Using endpoint: ${endpoint}`);
+  logger.log(`[Plan Service] Using endpoint: ${endpoint}`);
 
   try {
     const response = await axios.get(endpoint);
     return response;
   } catch (error: unknown) {
-    console.error(`[Plan Service] API request failed for ${handle}:`, {
+    logger.error(`[Plan Service] API request failed for ${handle}:`, {
       endpoint,
       error: (error as Error).message,
       response: (error as { response?: { data?: unknown } })?.response?.data,