import { getHeaders } from 'hooks/useClient';

/**
 * A thumbnail URL for something under `originals/`, authenticated by `?token=`.
 *
 * ── Why the token is in the query ──
 *
 * An `<img>` cannot send an Authorization header. `user-middleware` and the permission gate both accept
 * the token in the query string for exactly this, and the platform's own file browser does the same.
 * Built without it first, and every picture 401s while the layout looks perfectly correct.
 *
 * ── Why this is a module ──
 *
 * It was copied into GalleriesPanel and again into RecordsPanel, and a third copy was about to go into
 * MediaField. Three copies of a URL shape is three places to be wrong about the rung when the ladder
 * changes — which it did, four times in a day.
 */
export const thumbUrl = (path: string, width: 256 | 320 | 480 | 640 = 320): string => {
  const token = getHeaders()['Authorization']?.replace('Bearer ', '') ?? '';
  const encoded = path.split('/').map(encodeURIComponent).join('/');
  return `/api/fofos-admin/derived/${encoded}/${width}.webp?token=${encodeURIComponent(token)}`;
};

/**
 * A video's poster, for the same reason.
 *
 * A video has no width rungs — `poster-448.webp` and friends are cut from its still — so a slot showing
 * one asks for the poster rather than a width that does not exist.
 */
export const posterUrl = (path: string): string => {
  const token = getHeaders()['Authorization']?.replace('Bearer ', '') ?? '';
  const encoded = path.split('/').map(encodeURIComponent).join('/');
  return `/api/fofos-admin/derived/${encoded}/poster-512.webp?token=${encodeURIComponent(token)}`;
};