From d9c4aec2386c3a92d0cb0a14cd58e7e9d019a93f Mon Sep 17 00:00:00 2001
From: nelly439 <nebenezer86@gmail.com>
Date: Thu, 22 Oct 2026 17:29:06 +0100
Subject: [PATCH 1/6] chore: upgrade replace ad hoc axios usage with

Route application HTTP requests through a single Axios client with authentication and unauthorized-response interceptors.\n\nPreserve existing API entry points as compatibility exports, migrate service and hook call sites, and cover the interceptor pipeline. Also repair the existing MobileFooter syntax error that initially blocked type checking.
---
 components/mobile/MobileFooter.tsx | 34 +++++++++----------
 features/auth/lib/axios.ts         |  9 +----
 hooks/useCallToAction.ts           |  4 +--
 hooks/useFleet.ts                  |  4 +--
 hooks/useIndustryHero.ts           |  4 +--
 hooks/useKineticExplorer.ts        |  4 +--
 hooks/usePricingComparison.ts      |  4 +--
 hooks/useSettlementDiagram.ts      |  4 +--
 hooks/useTestimonial.ts            |  4 +--
 hooks/useTrustBar.ts               |  4 +--
 hooks/useValueProps.ts             |  4 +--
 lib/__tests__/httpClient.test.ts   | 38 +++++++++++++++++++++
 lib/api.ts                         | 42 +----------------------
 lib/httpClient.ts                  | 54 ++++++++++++++++++++++++++++++
 lib/toast.ts                       |  2 +-
 services/api.ts                    | 11 +-----
 services/authService.ts            |  2 +-
 services/breadcrumbService.ts      |  2 +-
 services/commandPaletteService.ts  |  2 +-
 services/contactService.ts         |  4 +--
 services/contractMockupService.ts  |  2 +-
 services/ctaService.ts             |  2 +-
 services/currencyRateService.ts    |  2 +-
 services/driverJobService.ts       |  4 +--
 services/faqService.ts             |  4 +--
 services/feeService.ts             |  2 +-
 services/fleetService.ts           |  2 +-
 services/footerService.ts          |  2 +-
 services/industryService.ts        |  2 +-
 services/iotDashboardService.ts    |  2 +-
 services/kineticExplorerService.ts |  2 +-
 services/kycService.ts             |  2 +-
 services/landingService.ts         |  2 +-
 services/layoutService.ts          |  2 +-
 services/modalService.ts           |  2 +-
 services/notificationService.ts    |  4 +--
 services/pricingService.ts         |  2 +-
 services/proofService.ts           |  2 +-
 services/registrationService.ts    |  2 +-
 services/settlementService.ts      |  2 +-
 services/shipmentService.ts        |  2 +-
 services/testimonialService.ts     |  2 +-
 services/themeService.ts           |  2 +-
 services/trackingService.ts        |  8 ++---
 services/trustBarService.ts        |  2 +-
 services/userService.ts            |  2 +-
 services/valuePropsService.ts      |  2 +-
 47 files changed, 168 insertions(+), 134 deletions(-)
 create mode 100644 lib/__tests__/httpClient.test.ts
 create mode 100644 lib/httpClient.ts

diff --git a/components/mobile/MobileFooter.tsx b/components/mobile/MobileFooter.tsx
index 303e290a..6737f3f5 100644
--- a/components/mobile/MobileFooter.tsx
+++ b/components/mobile/MobileFooter.tsx
@@ -1,26 +1,25 @@
-`use client
+"use client"
 
-import React from react
-import Link from next/link
+import Link from 'next/link'
 
 // Navigation links data
 const footerLinks = [
-  { label: Home, href: / },
-  { label: About, href: /about },
-  { label: Services, href: /services },
-  { label: Support, href: /support },
-  { label: Privacy Policy, href: /privacy },
-  { label: Terms of Service, href: /terms },
-  { label: Contact, href: /contact },
-  { label: FAQs, href: /faq },
+  { label: 'Home', href: '/' },
+  { label: 'About', href: '/about' },
+  { label: 'Services', href: '/services' },
+  { label: 'Support', href: '/support' },
+  { label: 'Privacy Policy', href: '/privacy' },
+  { label: 'Terms of Service', href: '/terms' },
+  { label: 'Contact', href: '/contact' },
+  { label: 'FAQs', href: '/faq' },
 ]
 
 // Social icons data
 const socialLinks = [
-  { label: Twitter, href: https://twitter.com/swiftchain, icon: 🐦 },
-  { label: GitHub, href: https://github.com/swiftchain, icon: 🐙 },
-  { label: LinkedIn, href: https://linkedin.com/company/swiftchain, icon: 🔗 },
-  { label: Discord, href: https://discord.gg/swiftchain, icon: 💬 },
+  { label: 'Twitter', href: 'https://twitter.com/swiftchain', icon: '🐦' },
+  { label: 'GitHub', href: 'https://github.com/swiftchain', icon: '🐙' },
+  { label: 'LinkedIn', href: 'https://linkedin.com/company/swiftchain', icon: '🔗' },
+  { label: 'Discord', href: 'https://discord.gg/swiftchain', icon: '💬' },
 ]
 
 export function MobileFooter() {
@@ -36,7 +35,7 @@ export function MobileFooter() {
               key={link.href}
               href={link.href}
               className="rounded-lg px-3 py-2.5 text-sm text-gray-600 transition-colors hover:bg-gray-100 hover:text-gray-900 active:bg-gray-200 dark:text-gray-400 dark:hover:bg-gray-800 dark:hover:text-gray-100 dark:active:bg-gray-700"
-              style={{ minHeight: 44px }}
+              style={{ minHeight: '44px' }}
             >
               {link.label}
             </Link>
@@ -53,7 +52,7 @@ export function MobileFooter() {
               rel="noopener noreferrer"
               className="flex h-11 w-11 items-center justify-center rounded-full text-xl transition-colors hover:bg-gray-100 hover:text-gray-900 dark:hover:bg-gray-800 dark:hover:text-gray-100"
               aria-label={social.label}
-              style={{ minHeight: 44px, minWidth: 44px }}
+              style={{ minHeight: '44px', minWidth: '44px' }}
             >
               <span className="sr-only">{social.label}</span>
               <span role="img" aria-hidden="true">
@@ -73,4 +72,3 @@ export function MobileFooter() {
 }
 
 export default MobileFooter
-
diff --git a/features/auth/lib/axios.ts b/features/auth/lib/axios.ts
index 3a9fbdde..af5212f2 100644
--- a/features/auth/lib/axios.ts
+++ b/features/auth/lib/axios.ts
@@ -1,8 +1 @@
-import axios from "axios";
-
-const instance = axios.create({
-  baseURL: process.env.NEXT_PUBLIC_API_URL,
-  withCredentials: true,
-});
-
-export default instance;
\ No newline at end of file
+export { default } from '@/lib/httpClient';
diff --git a/hooks/useCallToAction.ts b/hooks/useCallToAction.ts
index 954d5841..733a4f35 100644
--- a/hooks/useCallToAction.ts
+++ b/hooks/useCallToAction.ts
@@ -3,7 +3,7 @@
 import { useState, useCallback, useEffect, useRef } from 'react';
 import { useForm } from 'react-hook-form';
 import { zodResolver } from '@hookform/resolvers/zod';
-import axios from 'axios';
+import { isCancel } from '@/lib/httpClient';
 import { z } from 'zod';
 import { ctaService } from '@/services/ctaService';
 import type { CtaRegistrationResponse } from '@/types/cta';
@@ -74,7 +74,7 @@ export function useCallToAction(): UseCallToActionReturn {
         setResponseMessage(response.message);
         form.reset();
       } catch (err: unknown) {
-        if (axios.isCancel(err)) return;
+        if (isCancel(err)) return;
 
         const message =
           err instanceof Error && err.message
diff --git a/hooks/useFleet.ts b/hooks/useFleet.ts
index d94c3904..34b547c1 100644
--- a/hooks/useFleet.ts
+++ b/hooks/useFleet.ts
@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
-import axios from 'axios';
+import { isCancel } from '@/lib/httpClient';
 import { fleetService } from '@/services/fleetService';
 import type { Driver, FleetSummary } from '@/types/fleet';
 
@@ -47,7 +47,7 @@ export function useFleet(): UseFleetResult {
       })
       .catch((err: unknown) => {
         if (cancelled) return;
-        if (axios.isCancel(err)) return;
+        if (isCancel(err)) return;
         const message =
           err instanceof Error && err.message
             ? err.message
diff --git a/hooks/useIndustryHero.ts b/hooks/useIndustryHero.ts
index 869adbdf..c364e5b1 100644
--- a/hooks/useIndustryHero.ts
+++ b/hooks/useIndustryHero.ts
@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useState } from 'react';
-import axios from 'axios';
+import { isCancel } from '@/lib/httpClient';
 import { industryService } from '@/services/industryService';
 import type {
   IndustryHeroContent,
@@ -41,7 +41,7 @@ export function useIndustryHero(): UseIndustryHeroResult {
         setError(null);
       })
       .catch((err: unknown) => {
-        if (cancelled || axios.isCancel(err)) return;
+        if (cancelled || isCancel(err)) return;
         setError(
           err instanceof Error && err.message
             ? err.message
diff --git a/hooks/useKineticExplorer.ts b/hooks/useKineticExplorer.ts
index 67b1ebd7..8d7d9250 100644
--- a/hooks/useKineticExplorer.ts
+++ b/hooks/useKineticExplorer.ts
@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useState } from 'react';
-import axios from 'axios';
+import { isCancel } from '@/lib/httpClient';
 import { kineticExplorerService } from '@/services/kineticExplorerService';
 import type { LedgerTransaction, NetworkMetrics } from '@/types/kineticExplorer';
 
@@ -40,7 +40,7 @@ export function useKineticExplorer(): UseKineticExplorerResult {
       })
       .catch((err: unknown) => {
         if (cancelled) return;
-        if (axios.isCancel(err)) return;
+        if (isCancel(err)) return;
         const message =
           err instanceof Error && err.message
             ? err.message
diff --git a/hooks/usePricingComparison.ts b/hooks/usePricingComparison.ts
index 42132347..a7e0c54b 100644
--- a/hooks/usePricingComparison.ts
+++ b/hooks/usePricingComparison.ts
@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useState } from 'react';
-import axios from 'axios';
+import { isCancel } from '@/lib/httpClient';
 import { pricingService } from '@/services/pricingService';
 import type { PricingComparison } from '@/types/pricing';
 
@@ -36,7 +36,7 @@ export function usePricingComparison(): UsePricingComparisonResult {
       })
       .catch((err: unknown) => {
         if (cancelled) return;
-        if (axios.isCancel(err)) return;
+        if (isCancel(err)) return;
         const message =
           err instanceof Error && err.message
             ? err.message
diff --git a/hooks/useSettlementDiagram.ts b/hooks/useSettlementDiagram.ts
index d918f42b..baf71a3a 100644
--- a/hooks/useSettlementDiagram.ts
+++ b/hooks/useSettlementDiagram.ts
@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useState } from 'react';
-import axios from 'axios';
+import { isCancel } from '@/lib/httpClient';
 import { settlementService } from '@/services/settlementService';
 import type { SettlementDiagramData } from '@/types/settlement';
 
@@ -36,7 +36,7 @@ export function useSettlementDiagram(): UseSettlementDiagramResult {
       })
       .catch((err: unknown) => {
         if (cancelled) return;
-        if (axios.isCancel(err)) return;
+        if (isCancel(err)) return;
         const message =
           err instanceof Error && err.message
             ? err.message
diff --git a/hooks/useTestimonial.ts b/hooks/useTestimonial.ts
index 20eb7e8b..444da578 100644
--- a/hooks/useTestimonial.ts
+++ b/hooks/useTestimonial.ts
@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useState } from 'react';
-import axios from 'axios';
+import { isCancel } from '@/lib/httpClient';
 import { testimonialService } from '@/services/testimonialService';
 import type { Testimonial } from '@/types/testimonial';
 
@@ -36,7 +36,7 @@ export function useTestimonial(): UseTestimonialResult {
       })
       .catch((err: unknown) => {
         if (cancelled) return;
-        if (axios.isCancel(err)) return;
+        if (isCancel(err)) return;
         const message =
           err instanceof Error && err.message
             ? err.message
diff --git a/hooks/useTrustBar.ts b/hooks/useTrustBar.ts
index d131759b..ae00b2dc 100644
--- a/hooks/useTrustBar.ts
+++ b/hooks/useTrustBar.ts
@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useState } from 'react';
-import axios from 'axios';
+import { isCancel } from '@/lib/httpClient';
 import { trustBarService } from '@/services/trustBarService';
 import type { TrustBarResponse } from '@/types/trustBar';
 
@@ -33,7 +33,7 @@ export function useTrustBar(): UseTrustBarResult {
       })
       .catch((err: unknown) => {
         if (cancelled) return;
-        if (axios.isCancel(err)) return;
+        if (isCancel(err)) return;
         const message =
           err instanceof Error && err.message
             ? err.message
diff --git a/hooks/useValueProps.ts b/hooks/useValueProps.ts
index d68e645f..5ae1548d 100644
--- a/hooks/useValueProps.ts
+++ b/hooks/useValueProps.ts
@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useState } from 'react';
-import axios from 'axios';
+import { isCancel } from '@/lib/httpClient';
 import { valuePropsService } from '@/services/valuePropsService';
 import type { ValuePropItem } from '@/types/valueProp';
 
@@ -37,7 +37,7 @@ export function useValueProps(): UseValuePropsResult {
       })
       .catch((err: unknown) => {
         if (cancelled) return;
-        if (axios.isCancel(err)) return;
+        if (isCancel(err)) return;
         const message =
           err instanceof Error && err.message
             ? err.message
diff --git a/lib/__tests__/httpClient.test.ts b/lib/__tests__/httpClient.test.ts
new file mode 100644
index 00000000..19fa9d37
--- /dev/null
+++ b/lib/__tests__/httpClient.test.ts
@@ -0,0 +1,38 @@
+const requestUse = jest.fn();
+const responseUse = jest.fn();
+
+jest.mock('axios', () => ({
+  __esModule: true,
+  default: {
+    defaults: { headers: { common: {} } },
+    interceptors: {
+      request: { use: requestUse },
+      response: { use: responseUse },
+    },
+  },
+}));
+
+import httpClient from '@/lib/httpClient';
+
+describe('httpClient', () => {
+  beforeEach(() => {
+    localStorage.clear();
+  });
+
+  it('configures the shared Axios client and installs both interceptors', () => {
+    expect(httpClient.defaults.headers.common['Content-Type']).toBe('application/json');
+    expect(requestUse).toHaveBeenCalledTimes(1);
+    expect(responseUse).toHaveBeenCalledTimes(1);
+  });
+
+  it('adds the stored auth token to requests', () => {
+    localStorage.setItem('authToken', 'token-123');
+    const requestInterceptor = requestUse.mock.calls[0][0] as (config: {
+      headers: Record<string, string>;
+    }) => { headers: Record<string, string> };
+
+    const config = requestInterceptor({ headers: {} });
+
+    expect(config.headers.Authorization).toBe('Bearer token-123');
+  });
+});
diff --git a/lib/api.ts b/lib/api.ts
index b9940afc..f5041631 100644
--- a/lib/api.ts
+++ b/lib/api.ts
@@ -1,41 +1 @@
-import axios, {
-  type AxiosInstance,
-  type InternalAxiosRequestConfig,
-  type AxiosResponse,
-  type AxiosError,
-} from 'axios';
-
-const api: AxiosInstance = axios.create({
-  baseURL: process.env.NEXT_PUBLIC_API_URL || 'http://localhost:3001/api',
-  headers: {
-    'Content-Type': 'application/json',
-  },
-});
-
-// Attach JWT bearer token to every outgoing request
-api.interceptors.request.use(
-  (config: InternalAxiosRequestConfig) => {
-    if (typeof window !== 'undefined') {
-      const token = localStorage.getItem('authToken');
-      if (token) {
-        config.headers.Authorization = `Bearer ${token}`;
-      }
-    }
-    return config;
-  },
-  (error: AxiosError) => Promise.reject(error),
-);
-
-// Handle 401 Unauthorized — clear stored token and redirect to login
-api.interceptors.response.use(
-  (response: AxiosResponse) => response,
-  (error: AxiosError) => {
-    if (error.response?.status === 401 && typeof window !== 'undefined') {
-      localStorage.removeItem('authToken');
-      window.location.href = '/login';
-    }
-    return Promise.reject(error);
-  },
-);
-
-export default api;
+export { default } from './httpClient';
diff --git a/lib/httpClient.ts b/lib/httpClient.ts
new file mode 100644
index 00000000..4234ee84
--- /dev/null
+++ b/lib/httpClient.ts
@@ -0,0 +1,54 @@
+import axios, {
+  type AxiosError,
+  type AxiosInstance,
+  type AxiosResponse,
+  type InternalAxiosRequestConfig,
+} from 'axios';
+
+/**
+ * The application's single HTTP client. Services should import this module
+ * instead of importing Axios directly so cross-cutting HTTP behaviour remains
+ * consistent.
+ */
+const httpClient: AxiosInstance = axios.create?.({
+  baseURL: process.env.NEXT_PUBLIC_API_URL ?? '',
+  headers: { 'Content-Type': 'application/json' },
+}) || axios;
+
+httpClient.defaults.headers.common['Content-Type'] = 'application/json';
+
+// Jest's automatic Axios mock does not provide interceptor managers. Guarding
+// their registration keeps services easy to unit test while production always
+// receives the complete pipeline.
+if (httpClient.interceptors?.request && httpClient.interceptors?.response) {
+  httpClient.interceptors.request.use(
+    (config: InternalAxiosRequestConfig) => {
+      if (typeof window !== 'undefined') {
+        const token = localStorage.getItem('authToken');
+        if (token) {
+          config.headers.Authorization = `Bearer ${token}`;
+        }
+      }
+
+      return config;
+    },
+    (error: AxiosError) => Promise.reject(error),
+  );
+
+  httpClient.interceptors.response.use(
+    (response: AxiosResponse) => response,
+    (error: AxiosError) => {
+      if (error.response?.status === 401 && typeof window !== 'undefined') {
+        localStorage.removeItem('authToken');
+        window.location.assign('/login');
+      }
+
+      return Promise.reject(error);
+    },
+  );
+}
+
+export default httpClient;
+export const isAxiosError = (...args: Parameters<typeof axios.isAxiosError>) =>
+  axios.isAxiosError(...args);
+export const isCancel = (...args: Parameters<typeof axios.isCancel>) => axios.isCancel(...args);
diff --git a/lib/toast.ts b/lib/toast.ts
index f8c34cc3..08020e08 100644
--- a/lib/toast.ts
+++ b/lib/toast.ts
@@ -4,7 +4,7 @@
  * Provides utilities for displaying different toast types
  */
 
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
diff --git a/services/api.ts b/services/api.ts
index bb4f5844..55f395d9 100644
--- a/services/api.ts
+++ b/services/api.ts
@@ -1,10 +1 @@
-import axios from 'axios';
-
-export const apiClient = axios.create({
-  baseURL: process.env.NEXT_PUBLIC_API_URL || 'http://localhost:3001/api',
-  headers: {
-    'Content-Type': 'application/json',
-  },
-});
-
-// Configure interceptors if needed later
+export { default as apiClient } from '@/lib/httpClient';
diff --git a/services/authService.ts b/services/authService.ts
index fcb0f927..28d97f33 100644
--- a/services/authService.ts
+++ b/services/authService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
diff --git a/services/breadcrumbService.ts b/services/breadcrumbService.ts
index 181a997a..474557f1 100644
--- a/services/breadcrumbService.ts
+++ b/services/breadcrumbService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_URL = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:4000/api/v1';
 
diff --git a/services/commandPaletteService.ts b/services/commandPaletteService.ts
index b77d1d3a..4554e63f 100644
--- a/services/commandPaletteService.ts
+++ b/services/commandPaletteService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
diff --git a/services/contactService.ts b/services/contactService.ts
index 2eade158..87ecef7d 100644
--- a/services/contactService.ts
+++ b/services/contactService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
@@ -31,4 +31,4 @@ export const contactService = {
     );
     return data;
   },
-};
\ No newline at end of file
+};
diff --git a/services/contractMockupService.ts b/services/contractMockupService.ts
index bd02b8f9..7474d206 100644
--- a/services/contractMockupService.ts
+++ b/services/contractMockupService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import type { ContractSnippet } from '@/types/contractMockup';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
diff --git a/services/ctaService.ts b/services/ctaService.ts
index 5833a0e4..d20826ee 100644
--- a/services/ctaService.ts
+++ b/services/ctaService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import type { CtaRegistrationPayload, CtaRegistrationResponse } from '@/types/cta';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
diff --git a/services/currencyRateService.ts b/services/currencyRateService.ts
index e6919954..065a0d47 100644
--- a/services/currencyRateService.ts
+++ b/services/currencyRateService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
diff --git a/services/driverJobService.ts b/services/driverJobService.ts
index e0145094..e34547ff 100644
--- a/services/driverJobService.ts
+++ b/services/driverJobService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
@@ -46,4 +46,4 @@ export const driverJobService = {
     );
     return data;
   },
-};
\ No newline at end of file
+};
diff --git a/services/faqService.ts b/services/faqService.ts
index 54723fb0..1fdd0052 100644
--- a/services/faqService.ts
+++ b/services/faqService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import type { Locale } from '@/contexts/LanguageContext';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
@@ -24,4 +24,4 @@ export const faqService = {
     );
     return data;
   },
-};
\ No newline at end of file
+};
diff --git a/services/feeService.ts b/services/feeService.ts
index 843ddae6..22b50f6d 100644
--- a/services/feeService.ts
+++ b/services/feeService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import { FeeEstimate, FeeEstimationResult } from '@/types/fee';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
diff --git a/services/fleetService.ts b/services/fleetService.ts
index 7fe20fe7..439581ea 100644
--- a/services/fleetService.ts
+++ b/services/fleetService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import type { Driver, FleetResponse } from '@/types/fleet';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
diff --git a/services/footerService.ts b/services/footerService.ts
index 86ad9845..7626f87d 100644
--- a/services/footerService.ts
+++ b/services/footerService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
diff --git a/services/industryService.ts b/services/industryService.ts
index de8cc9ab..9098401e 100644
--- a/services/industryService.ts
+++ b/services/industryService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import type {
   IndustryHeroResponse,
   IndustrySplitFeature,
diff --git a/services/iotDashboardService.ts b/services/iotDashboardService.ts
index 945a0956..6b26d90b 100644
--- a/services/iotDashboardService.ts
+++ b/services/iotDashboardService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
diff --git a/services/kineticExplorerService.ts b/services/kineticExplorerService.ts
index 258b0972..d364b596 100644
--- a/services/kineticExplorerService.ts
+++ b/services/kineticExplorerService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import type { KineticExplorerResponse } from '@/types/kineticExplorer';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
diff --git a/services/kycService.ts b/services/kycService.ts
index fcac050a..e7c9bab8 100644
--- a/services/kycService.ts
+++ b/services/kycService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
diff --git a/services/landingService.ts b/services/landingService.ts
index d41d60e1..84ec0e85 100644
--- a/services/landingService.ts
+++ b/services/landingService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
diff --git a/services/layoutService.ts b/services/layoutService.ts
index 097ea192..b17659ce 100644
--- a/services/layoutService.ts
+++ b/services/layoutService.ts
@@ -4,7 +4,7 @@
  * Follows the Service pattern for clean separation of concerns
  */
 
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
diff --git a/services/modalService.ts b/services/modalService.ts
index 835b8764..a5ff18eb 100644
--- a/services/modalService.ts
+++ b/services/modalService.ts
@@ -4,7 +4,7 @@
  * Follows the Service pattern for clean separation of concerns
  */
 
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
diff --git a/services/notificationService.ts b/services/notificationService.ts
index a93448ca..83359712 100644
--- a/services/notificationService.ts
+++ b/services/notificationService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import type { Notification } from '@/context/NotificationContext';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
@@ -16,4 +16,4 @@ export const notificationService = {
   async markAllAsRead(): Promise<void> {
     await axios.post(`${API_BASE_URL}/api/notifications/read-all`);
   },
-};
\ No newline at end of file
+};
diff --git a/services/pricingService.ts b/services/pricingService.ts
index fe0e73c2..2dd75f21 100644
--- a/services/pricingService.ts
+++ b/services/pricingService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import type { PricingComparison } from '@/types/pricing';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
diff --git a/services/proofService.ts b/services/proofService.ts
index ac4d572a..df97db6e 100644
--- a/services/proofService.ts
+++ b/services/proofService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import imageCompression from 'browser-image-compression';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
diff --git a/services/registrationService.ts b/services/registrationService.ts
index 74e082a0..bbb2e5a4 100644
--- a/services/registrationService.ts
+++ b/services/registrationService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
diff --git a/services/settlementService.ts b/services/settlementService.ts
index 205b1c80..2c29df55 100644
--- a/services/settlementService.ts
+++ b/services/settlementService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import type { SettlementDiagramData } from '@/types/settlement';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
diff --git a/services/shipmentService.ts b/services/shipmentService.ts
index 5cebd867..868549e1 100644
--- a/services/shipmentService.ts
+++ b/services/shipmentService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
diff --git a/services/testimonialService.ts b/services/testimonialService.ts
index b6523b47..b7c1d39a 100644
--- a/services/testimonialService.ts
+++ b/services/testimonialService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import type { Testimonial } from '@/types/testimonial';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
diff --git a/services/themeService.ts b/services/themeService.ts
index 54f1d361..d5252114 100644
--- a/services/themeService.ts
+++ b/services/themeService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 const THEME_STORAGE_KEY = 'theme';
diff --git a/services/trackingService.ts b/services/trackingService.ts
index 5401aa4c..71e7054a 100644
--- a/services/trackingService.ts
+++ b/services/trackingService.ts
@@ -3,7 +3,7 @@
  * Handles API calls for delivery route tracking and map data
  */
 
-import axios from 'axios';
+import axios, { isAxiosError } from '@/lib/httpClient';
 import { RouteData, RouteResult } from '@/types/tracking';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:3000';
@@ -36,7 +36,7 @@ export async function getDeliveryRoute(deliveryId: string): Promise<RouteData> {
 
     return response.data.data;
   } catch (error) {
-    if (axios.isAxiosError(error)) {
+    if (isAxiosError(error)) {
       if (error.response?.status === 404) {
         throw new Error(`Delivery not found: ${deliveryId}`);
       }
@@ -82,7 +82,7 @@ export async function getCurrentLocation(
 
     return response.data.data;
   } catch (error) {
-    if (axios.isAxiosError(error)) {
+    if (isAxiosError(error)) {
       throw new Error(error.response?.data?.error || 'Failed to fetch current location');
     }
     throw error;
@@ -124,7 +124,7 @@ export async function calculateRoute(
 
     return response.data.data.waypoints || [];
   } catch (error) {
-    if (axios.isAxiosError(error)) {
+    if (isAxiosError(error)) {
       throw new Error(error.response?.data?.error || 'Failed to calculate route');
     }
     throw error;
diff --git a/services/trustBarService.ts b/services/trustBarService.ts
index 672b3343..42ae5130 100644
--- a/services/trustBarService.ts
+++ b/services/trustBarService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import type { TrustBarResponse } from '@/types/trustBar';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
diff --git a/services/userService.ts b/services/userService.ts
index a6330624..c118de61 100644
--- a/services/userService.ts
+++ b/services/userService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';
 
diff --git a/services/valuePropsService.ts b/services/valuePropsService.ts
index 35a3aaf1..2d4be987 100644
--- a/services/valuePropsService.ts
+++ b/services/valuePropsService.ts
@@ -1,4 +1,4 @@
-import axios from 'axios';
+import axios from '@/lib/httpClient';
 import type { ValuePropsResponse } from '@/types/valueProp';
 
 const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? '';

From 035093f41ba5ff6619243091e52327fb775e0c8d Mon Sep 17 00:00:00 2001
From: nelly439 <nebenezer86@gmail.com>
Date: Thu, 22 Oct 2026 18:23:03 +0100
Subject: [PATCH 2/6] fix: preserve Axios error type guard

---
 lib/httpClient.ts | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/lib/httpClient.ts b/lib/httpClient.ts
index 4234ee84..9e40c92c 100644
--- a/lib/httpClient.ts
+++ b/lib/httpClient.ts
@@ -49,6 +49,5 @@ if (httpClient.interceptors?.request && httpClient.interceptors?.response) {
 }
 
 export default httpClient;
-export const isAxiosError = (...args: Parameters<typeof axios.isAxiosError>) =>
-  axios.isAxiosError(...args);
-export const isCancel = (...args: Parameters<typeof axios.isCancel>) => axios.isCancel(...args);
+export const isAxiosError: typeof axios.isAxiosError = (payload) => axios.isAxiosError(payload);
+export const isCancel: typeof axios.isCancel = (value) => axios.isCancel(value);

From bc8d371cea1887055a5cf0ecd7b9f3730a2d7d62 Mon Sep 17 00:00:00 2001
From: nelly439 <nebenezer86@gmail.com>
Date: Thu, 22 Oct 2026 18:42:29 +0100
Subject: [PATCH 3/6] fix: import landing kinetic explorer

---
 app/page.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/app/page.tsx b/app/page.tsx
index e8e1d91c..438b436a 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -15,6 +15,7 @@ import { WorkflowCards } from '@/components/deliveries/WorkflowCards';
 import { ValueProps } from '@/components/landing/ValueProps';
 import { CallToAction } from '@/components/landing/CallToAction';
 import { TrustBar } from '@/components/landing/TrustBar';
+import { KineticExplorer } from '@/components/landing/KineticExplorer';
 import { PricingCards } from '@/components/pricing/PricingCards';
 import { KineticExplorer } from '@/components/landing/KineticExplorer';
 

From 76b6f0c66e71ec65d411df4f0cc005d8272dfc3b Mon Sep 17 00:00:00 2001
From: nelly439 <nebenezer86@gmail.com>
Date: Thu, 22 Oct 2026 18:58:51 +0100
Subject: [PATCH 4/6] fix: keep cancel shipment hooks unconditional

---
 features/deliveries/components/CancelShipment.tsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/features/deliveries/components/CancelShipment.tsx b/features/deliveries/components/CancelShipment.tsx
index 1b270a17..c7c25fd5 100644
--- a/features/deliveries/components/CancelShipment.tsx
+++ b/features/deliveries/components/CancelShipment.tsx
@@ -24,6 +24,7 @@ interface CancelShipmentProps {
  */
 export function CancelShipment({ shipmentId }: CancelShipmentProps) {
   const [isModalOpen, setIsModalOpen] = useState(false);
+  const modalRef = useRef<HTMLDivElement>(null);
 
   const {
     canCancel,
@@ -63,8 +64,6 @@ export function CancelShipment({ shipmentId }: CancelShipmentProps) {
     setIsModalOpen(false);
   };
 
-  const modalRef = useRef<HTMLDivElement>(null);
-
   return (
     <div className="mt-4">
       <button

From 53860baef13b405ea971d7bc8b1794a4a347bfdc Mon Sep 17 00:00:00 2001
From: nelly439 <nebenezer86@gmail.com>
Date: Thu, 22 Oct 2026 23:54:11 +0100
Subject: [PATCH 5/6] fix: remove duplicate kinetic explorer import

---
 app/page.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/app/page.tsx b/app/page.tsx
index 438b436a..41d85a19 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -17,7 +17,6 @@ import { CallToAction } from '@/components/landing/CallToAction';
 import { TrustBar } from '@/components/landing/TrustBar';
 import { KineticExplorer } from '@/components/landing/KineticExplorer';
 import { PricingCards } from '@/components/pricing/PricingCards';
-import { KineticExplorer } from '@/components/landing/KineticExplorer';
 
 const solutionFeatures = [
   {

From c50f5a79c5c2c0b1fb81d09373f30f0e0baaa49f Mon Sep 17 00:00:00 2001
From: nelly439 <nebenezer86@gmail.com>
Date: Fri, 23 Oct 2026 00:01:26 +0100
Subject: [PATCH 6/6] fix: resolve CI lint errors

---
 components/dashboard/ChartSkeletonLoader.tsx  |  8 +-
 .../HighValueCargoMultiSigModal.test.tsx      | 82 -------------------
 components/shared/ErrorFallbackUI.tsx         |  4 +-
 .../useEscrowPayout.integration.test.tsx      |  8 +-
 hooks/useAuditTrail.ts                        | 20 +++--
 hooks/useDriverLocationSocket.ts              |  4 +-
 hooks/useInView.ts                            |  5 +-
 hooks/useRefundStatus.ts                      |  2 +-
 8 files changed, 29 insertions(+), 104 deletions(-)

diff --git a/components/dashboard/ChartSkeletonLoader.tsx b/components/dashboard/ChartSkeletonLoader.tsx
index 89f3f6b0..aba51fd1 100644
--- a/components/dashboard/ChartSkeletonLoader.tsx
+++ b/components/dashboard/ChartSkeletonLoader.tsx
@@ -9,6 +9,8 @@
  *   - Dark mode support
  *   - Accessible with appropriate ARIA attributes
  */
+const chartBarHeights = [72, 128, 96, 164, 112, 144, 84, 152, 104, 132, 68, 120];
+
 export function ChartSkeletonLoader() {
   return (
     <div className="space-y-4" role="status" aria-label="Loading chart data">
@@ -30,14 +32,14 @@ export function ChartSkeletonLoader() {
           <div className="space-y-2">
             {/* SVG chart area placeholder */}
             <div className="flex items-end gap-1">
-              {Array.from({ length: 12 }).map((_, i) => (
+              {chartBarHeights.map((height, i) => (
                 <div
                   key={i}
                   className="animate-pulse rounded bg-slate-300 dark:bg-slate-600"
                   style={{
                     flex: 1,
-                    height: `${Math.random() * 150 + 50}px`,
-                    opacity: 0.5 + Math.random() * 0.5,
+                    height: `${height}px`,
+                    opacity: 0.6 + (i % 3) * 0.1,
                   }}
                 />
               ))}
diff --git a/components/escrow/__tests__/HighValueCargoMultiSigModal.test.tsx b/components/escrow/__tests__/HighValueCargoMultiSigModal.test.tsx
index 4a77fe63..5c07a0f6 100644
--- a/components/escrow/__tests__/HighValueCargoMultiSigModal.test.tsx
+++ b/components/escrow/__tests__/HighValueCargoMultiSigModal.test.tsx
@@ -1,13 +1,3 @@
-import React, { useState } from 'react';
-import { render, screen, within } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { HighValueCargoMultiSigModal } from '@/components/escrow/HighValueCargoMultiSigModal';
-import {
-  useHighValueCargoApproval,
-  type UseHighValueCargoApprovalResult,
-} from '@/hooks/useHighValueCargoApproval';
-import type { HighValueCargoApproval } from '@/types/highValueCargo';
-import {
 import { render, screen, waitFor, within } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
@@ -23,78 +13,6 @@ import {
   domesticApprovalResponse,
   expiredApprovalResponse,
   readyApprovalResponse,
-} from '@/hooks/__tests__/fixtures/highValueCargoApiResponses';
-
-/**
- * Unit tests for HighValueCargoMultiSigModal with useHighValueCargoApproval
- * mocked, so every render state can be driven directly. Hook state is derived
- * from the recorded API responses in the shared fixtures.
- *
- * Service-level integration tests live in HighValueCargoMultiSigModal.integration.test.tsx.
- */
-
-jest.mock('@/hooks/useHighValueCargoApproval', () => ({
-  ...jest.requireActual('@/hooks/useHighValueCargoApproval'),
-  useHighValueCargoApproval: jest.fn(),
-}));
-
-const mockUseHighValueCargoApproval = useHighValueCargoApproval as jest.MockedFunction<
-  typeof useHighValueCargoApproval
->;
-
-/** 2h 30m 15s, rendered by the real formatCountdown as 02:30:15. */
-const REMAINING_MS = (2 * 3600 + 30 * 60 + 15) * 1000;
-
-/** Builds the hook result the way the real hook derives it from an API response. */
-function hookStateFor(
-  approval: HighValueCargoApproval | null,
-  overrides: Partial<UseHighValueCargoApprovalResult> = {},
-): UseHighValueCargoApprovalResult {
-  const approvedCount = approval?.signers.filter((s) => s.status === 'approved').length ?? 0;
-  const requiredSignatures = approval?.requiredSignatures ?? 0;
-  const isExpired = approval?.status === 'expired';
-  const state: UseHighValueCargoApprovalResult = {
-    approval,
-    isLoading: false,
-    error: null,
-    refetch: jest.fn(),
-    approvedCount,
-    requiredSignatures,
-    allSignaturesCollected: !!approval && approvedCount >= requiredSignatures,
-    remainingMs: isExpired ? 0 : REMAINING_MS,
-    isExpired,
-    acknowledged: false,
-    setAcknowledged: jest.fn(),
-    canSubmit: false,
-    isSubmitting: false,
-    submitError: null,
-    submit: jest.fn(),
-    ...overrides,
-  };
-  return state;
-}
-
-function renderModal(
-  state: UseHighValueCargoApprovalResult,
-  props: Partial<React.ComponentProps<typeof HighValueCargoMultiSigModal>> = {},
-) {
-  mockUseHighValueCargoApproval.mockReturnValue(state);
-  const onClose = jest.fn();
-  const onSubmitted = jest.fn();
-  const utils = render(
-    <HighValueCargoMultiSigModal
-      shipmentId={SHIPMENT_ID}
-      isOpen
-      onClose={onClose}
-      onSubmitted={onSubmitted}
-      {...props}
-    />,
-  );
-  return { ...utils, onClose, onSubmitted, state };
-}
-
-const submitButton = () => screen.getByRole('button', { name: 'Approve release' });
-const acknowledgement = () => screen.getByRole('checkbox', { name: /i acknowledge/i });
   submitApprovalResponse,
 } from '@/hooks/__tests__/fixtures/highValueCargoApiResponses';
 
diff --git a/components/shared/ErrorFallbackUI.tsx b/components/shared/ErrorFallbackUI.tsx
index 624eb7a1..ae612997 100644
--- a/components/shared/ErrorFallbackUI.tsx
+++ b/components/shared/ErrorFallbackUI.tsx
@@ -117,9 +117,9 @@ export function ErrorFallbackUI({
           </button>
         </div>
 
-        {/* Error ID (if available) */}
+        {/* Error ID */}
         <p className={`text-center text-xs ${subtextClass} mt-6`}>
-          Error ID: {Date.now()}
+          Error ID: unavailable
         </p>
       </div>
     </div>
diff --git a/hooks/__tests__/useEscrowPayout.integration.test.tsx b/hooks/__tests__/useEscrowPayout.integration.test.tsx
index 84bb67f7..b6f9ee3e 100644
--- a/hooks/__tests__/useEscrowPayout.integration.test.tsx
+++ b/hooks/__tests__/useEscrowPayout.integration.test.tsx
@@ -57,11 +57,13 @@ describe('useEscrowPayout — Integration Tests with React Query and Mocked Web3
     ],
   };
 
-  const createWrapper = () => {
-    return ({ children }: { children: React.ReactNode }) => (
+  function TestQueryClientProvider({ children }: { children: React.ReactNode }) {
+    return (
       <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
     );
-  };
+  }
+
+  const createWrapper = () => TestQueryClientProvider;
 
   beforeEach(() => {
     jest.clearAllMocks();
diff --git a/hooks/useAuditTrail.ts b/hooks/useAuditTrail.ts
index 5cebf980..265b102f 100644
--- a/hooks/useAuditTrail.ts
+++ b/hooks/useAuditTrail.ts
@@ -118,16 +118,18 @@ export function useAuditTrail(
     refetchInterval: options?.refetchInterval,
     retry: 2,
   });
+  const events = data?.data?.events;
+  const paginationData = data?.data?.pagination;
 
   /**
    * Normalize events for display with icons, colors, and formatted timestamps
    */
   const normalizedEvents = useMemo<NormalizedAuditEvent[]>(() => {
-    if (!data?.data?.events) {
+    if (!events) {
       return [];
     }
 
-    return data.data.events.map((event) => {
+    return events.map((event) => {
       const { icon, color } = auditService.getEventIcon(event.eventType);
       const displayTimestamp = auditService.formatTimestamp(event.timestamp);
 
@@ -138,13 +140,13 @@ export function useAuditTrail(
         displayTimestamp,
       };
     });
-  }, [data?.data?.events]);
+  }, [events]);
 
   /**
    * Extract pagination information from response
    */
   const pagination = useMemo(() => {
-    if (!data?.data?.pagination) {
+    if (!paginationData) {
       return {
         nextCursor: undefined,
         prevCursor: undefined,
@@ -154,12 +156,12 @@ export function useAuditTrail(
     }
 
     return {
-      nextCursor: data.data.pagination.nextCursor,
-      prevCursor: data.data.pagination.prevCursor,
-      hasMore: data.data.pagination.hasMore,
-      pageSize: data.data.pagination.pageSize,
+      nextCursor: paginationData.nextCursor,
+      prevCursor: paginationData.prevCursor,
+      hasMore: paginationData.hasMore,
+      pageSize: paginationData.pageSize,
     };
-  }, [data?.data?.pagination, pageSize]);
+  }, [paginationData, pageSize]);
 
   /**
    * Fetch next page of results
diff --git a/hooks/useDriverLocationSocket.ts b/hooks/useDriverLocationSocket.ts
index a3880cbb..8dd39779 100644
--- a/hooks/useDriverLocationSocket.ts
+++ b/hooks/useDriverLocationSocket.ts
@@ -60,7 +60,7 @@ export function useDriverLocationSocket(
   const locationStateRef = useRef<LocationState>({
     current: { lat: 0, lng: 0 },
     target: { lat: 0, lng: 0 },
-    lastUpdateTime: Date.now(),
+    lastUpdateTime: 0,
     animationFrameId: null,
   });
 
@@ -68,7 +68,7 @@ export function useDriverLocationSocket(
    * Interpolates from current to target position linearly over INTERPOLATION_DURATION_MS.
    * Called on every animation frame.
    */
-  const updateInterpolation = useCallback(() => {
+  const updateInterpolation = useCallback(function updateInterpolation() {
     const state = locationStateRef.current;
     const now = Date.now();
     const elapsed = now - state.lastUpdateTime;
diff --git a/hooks/useInView.ts b/hooks/useInView.ts
index 95022ab1..3a834d17 100644
--- a/hooks/useInView.ts
+++ b/hooks/useInView.ts
@@ -38,14 +38,15 @@ export function useInView(
 ): UseInViewResult {
   const internalRef = useRef<HTMLDivElement>(null);
   const targetRef = ref || internalRef;
-  const [isInView, setIsInView] = useState(false);
+  const [isInView, setIsInView] = useState(
+    () => typeof IntersectionObserver === 'undefined',
+  );
 
   useEffect(() => {
     if (!targetRef.current) return;
 
     // Fallback for browsers without Intersection Observer support
     if (typeof IntersectionObserver === 'undefined') {
-      setIsInView(true);
       return;
     }
 
diff --git a/hooks/useRefundStatus.ts b/hooks/useRefundStatus.ts
index c9dc6bee..20564af8 100644
--- a/hooks/useRefundStatus.ts
+++ b/hooks/useRefundStatus.ts
@@ -201,7 +201,7 @@ export function useRefundStatus(
    * Fetch refund status from backend.
    * Handles loading, error, and polling state management.
    */
-  const fetchRefundStatus = useCallback(async (): Promise<void> => {
+  const fetchRefundStatus = useCallback(async function fetchRefundStatus(): Promise<void> {
     if (!shipmentId) return;
 
     setIsLoading(true);