fix(studio): freeze-frame, loudness and peak-map requests go through studioApiFetch too

Author: miguel-heygen

packages/studio/src/hooks/useFreezeFrame.ts

@@ -6,6 +6,7 @@ import { buildProjectApiPath } from "../utils/projectRouting";
 import { markStudioWriteToken } from "../utils/studioFileVersion";
 import { serializeStudioFileMutations } from "../utils/studioFileMutationCoordinator";
 import type { RecordEditInput } from "../utils/studioFileHistory";
+import { studioApiFetch } from "../utils/studioApiFetch";
 
 type ProjectFileWriter = (path: string, content: string, expectedContent?: string) => Promise<void>;
 
@@ -31,7 +32,7 @@ function errorOf(value: unknown): string | null {
 }
 
 async function readVersion(projectId: string, path: string): Promise<string> {
-  const response = await fetch(
+  const response = await studioApiFetch(
     buildProjectApiPath(projectId, `/files/${encodeURIComponent(path)}`),
   );
   const body: unknown = await response.json().catch(() => null);
@@ -53,7 +54,7 @@ export async function requestFreezeFrame(input: {
   const expectedVersion = await readVersion(input.projectId, input.path);
   const transactionToken = `freeze:${crypto.randomUUID()}`;
   markStudioWriteToken(transactionToken);
-  const response = await fetch(
+  const response = await studioApiFetch(
     buildProjectApiPath(input.projectId, "/file-mutations/freeze-frame"),
     {
       method: "POST",

packages/studio/src/player/components/ClipPeakMarks.tsx

@@ -1,12 +1,13 @@
 import { useEffect, useState, type ReactNode } from "react";
 import { clipPeakRuns, isPeakMap, type ClipSourceWindow, type PeakMap } from "./clipPeakRuns";
+import { studioApiFetch } from "../../utils/studioApiFetch";
 
 const peakMapRequests = new Map<string, Promise<PeakMap | null>>();
 
 function loadPeakMap(url: string): Promise<PeakMap | null> {
   const pending = peakMapRequests.get(url);
   if (pending) return pending;
-  const request = fetch(url)
+  const request = studioApiFetch(url)
     .then((res) => (res.ok ? res.json() : null))
     .then((body: unknown) => (isPeakMap(body) ? body : null))
     .catch(() => null);

packages/studio/src/player/components/clipMenuNormalize.ts

@@ -4,6 +4,7 @@ import { resolveMediaPreviewUrl } from "./thumbnailUtils";
 import type { TimelineElement } from "../store/timelineElement";
 import { parseAutomation, VOLUME_TARGET } from "@hyperframes/core/audio-automation";
 import type { TimelineEditOutcome } from "../../hooks/timelineEditPermission";
+import { studioApiFetch } from "../../utils/studioApiFetch";
 
 export interface NormalizePlan {
   targetLufs: number;
@@ -74,7 +75,7 @@ function isNormalizePlan(value: unknown): value is NormalizePlan {
 export async function requestNormalizePlan(
   projectId: string,
   el: TimelineElement,
-  fetchImpl: typeof fetch = fetch,
+  fetchImpl: typeof studioApiFetch = studioApiFetch,
 ): Promise<NormalizePlan> {
   const origin = window.location.origin;
   const relative = resolvePreviewRelative(