import { t } from '@/i18n'
import type { CodeSnippetTab } from '@/lib/codeSnippet'

export const SAMPLE_IMAGE = 'north-wall.jpg'
export const VARIANT_PLACEHOLDER = '<variant-name>'
export const SETTINGS_VARIANTS_PATH = '/settings/media/variants'

const SAMPLE_WIDTHS = [400, 800, 1200]

export interface ImageResponseRow {
	request: string
	status: string
	response: string
	body: string
}

export function variantUrl(origin: string, name: string) {
	return `${origin}/media/${SAMPLE_IMAGE}?v=${name}`
}

export function unknownVariantBody(name: string) {
	return `{ "status": 400, "error": "unknown_variant", "message": "Unknown variant", "detail": "${name}" }`
}

function unsupportedParameterBody(name: string) {
	return `{ "status": 400, "error": "unsupported_parameter", "message": "Unsupported parameter", "detail": "${name}" }`
}

export function imageSnippets(origin: string, names: readonly string[]): CodeSnippetTab[] {
	const first = names[0] ?? VARIANT_PLACEHOLDER
	const second = names[1] ?? first
	const third = names[2] ?? first
	const url = (name: string) => variantUrl(origin, name)
	const srcset = [first, second, third]
		.map((name, index) => `${url(name)} ${SAMPLE_WIDTHS[index]}w`)
		.join(',\n          ')
	return [
		{ k: 'curl', label: 'curl', code: `curl -O "${url(first)}"` },
		{
			k: 'html',
			label: 'HTML',
			code: `<img\n  src="${url(second)}"\n  srcset="${srcset}"\n  sizes="(min-width: 800px) 800px, 100vw"\n  alt="North wall">`,
		},
		{
			k: 'js',
			label: 'JavaScript',
			code: `const res = await fetch("${url(first)}")\nif (!res.ok) throw new Error(await res.text())\nconst blob = await res.blob()`,
		},
	]
}

export function imageResponseRows(): ImageResponseRow[] {
	return [
		{
			request: '/media/photo.png?v=thumb',
			status: '200',
			response: t('The variant image. Generated on first request.'),
			body: '',
		},
		{
			request: '/media/photo.png?v=unknown',
			status: '400',
			response: t('Unknown variant'),
			body: unknownVariantBody('unknown'),
		},
		{
			request: '/media/photo.png?width=400',
			status: '400',
			response: t('Unsupported parameter'),
			body: unsupportedParameterBody('width'),
		},
		{
			request: '/media/missing.png?v=thumb',
			status: '404',
			response: t('Not found'),
			body: '404 page not found',
		},
		{
			request: '/media/huge.png?v=thumb',
			status: '413',
			response: t('Source image too large'),
			body: 'The source image is too large to generate this variant.',
		},
		{
			request: '/media/photo.png?v=thumb',
			status: '500',
			response: t('Unable to read the file'),
			body: 'Unable to read the file',
		},
	]
}