feat: add leather request header

src/app.tsx

@@ -9,6 +9,7 @@ import { BlockchainApiClientProvider } from '@components/blockchain-api-client-p
 import { Navigate } from '@components/navigate';
 import { StackingClientProvider } from '@components/stacking-client-provider/stacking-client-provider';
 import { NetworkModeUrlMap } from '@constants/network';
+import { setupLeatherFetchInterceptor } from '@utils/fetch-interceptor';
 import { loadFonts } from '@utils/load-fonts';
 
 import { AuthGuard } from './components/auth-guard';
@@ -46,6 +47,8 @@ const queryClient = new QueryClient({
   },
 });
 
+setupLeatherFetchInterceptor();
+
 function Root() {
   useEffect(() => void loadFonts(), []);
 

src/utils/fetch-interceptor.ts

@@ -0,0 +1,20 @@
+export function setupLeatherFetchInterceptor() {
+  const originalFetch = window.fetch;
+
+  window.fetch = async function (input: RequestInfo | URL, init?: RequestInit) {
+    const url = input instanceof URL ? input.toString() : input.toString();
+
+    if (url.includes('hiro.so')) {
+      const modifiedInit = {
+        ...init,
+        headers: {
+          ...init?.headers,
+          'x-hiro-product': 'Leather',
+        },
+      };
+      return await originalFetch(input, modifiedInit);
+    }
+
+    return await originalFetch(input, init);
+  };
+}