import type { Agent } from "@atproto/api";

import { escapeHtml, page } from "../lib/theme";

export const REDIRECT_DELAY_SECONDS = 5;

// ============================================================================

// Helpers

// ============================================================================

export function withReturnToParam(

	returnTo: string | undefined,

	key: string,

	value: string,

): string | undefined {

	if (!returnTo) return undefined;

	try {

		const url = new URL(returnTo);

		url.searchParams.set(key, value);

		return url.toString();

	} catch {

		return returnTo;

	}

}

/**

 * Scan a repo for a record in `collection` where `record[field] === uri`.

 * Returns the record AT-URI, or null if not found.

 */

export async function findExistingRecord(

	agent: Agent,

	did: string,

	collection: string,

	field: string,

	uri: string,

): Promise<string | null> {

	let cursor: string | undefined;

	do {

		const result = await agent.com.atproto.repo.listRecords({

			repo: did,

			collection,

			limit: 100,

			cursor,

		});

		for (const record of result.data.records) {

			const value = record.value as Record<string, unknown>;

			if (value[field] === uri) {

				return record.uri;

			}

		}

		cursor = result.data.cursor;

	} while (cursor);

	return null;

}

// ============================================================================

// HTML rendering

// ============================================================================

export function renderHandleForm(params: {

	resourceUri: string;

	resourceField: string;

	loginPath: string;

	title: string;

	description: string;

	buttonLabel: string;

	returnTo?: string;

	error?: string;

	action?: string;

}): string {

	const {

		resourceUri,

		resourceField,

		loginPath,

		title,

		description,

		buttonLabel,

		returnTo,

		error,

		action,

	} = params;

	const errorHtml = error ? `<p class="error">${escapeHtml(error)}</p>` : "";

	const returnToInput = returnTo

		? `<input type="hidden" name="returnTo" value="${escapeHtml(returnTo)}" />`

		: "";

	const actionInput = action

		? `<input type="hidden" name="action" value="${escapeHtml(action)}" />`

		: "";

	return page(`

		<h1>${escapeHtml(title)}</h1>

		<p>${escapeHtml(description)}</p>

		${errorHtml}

		<form method="POST" action="${escapeHtml(loginPath)}">

			<input type="hidden" name="${escapeHtml(resourceField)}" value="${escapeHtml(resourceUri)}" />

			${returnToInput}

			${actionInput}

			<input

				type="text"

				name="handle"

				placeholder="you.bsky.social"

				autocomplete="username"

				required

				autofocus

			/>

			<button type="submit">${escapeHtml(buttonLabel)}</button>

		</form>

	`);

}

export function renderSuccess(params: {

	resourceUri: string;

	resourceLabel: string;

	recordUri: string | null;

	heading: string;

	msg: string;

	returnTo?: string;

}): string {

	const { resourceUri, resourceLabel, recordUri, heading, msg, returnTo } =

		params;

	const escapedResourceUri = escapeHtml(resourceUri);

	const escapedReturnTo = returnTo ? escapeHtml(returnTo) : "";

	const redirectHtml = returnTo

		? `<p id="redirect-msg">Redirecting to <a href="${escapedReturnTo}">${escapedReturnTo}</a> in <span id="countdown">${REDIRECT_DELAY_SECONDS}</span>\u00a0seconds\u2026</p>

		<script>

		(function(){

			var secs = ${REDIRECT_DELAY_SECONDS};

			var el = document.getElementById('countdown');

			var iv = setInterval(function(){

				secs--;

				if (el) el.textContent = String(secs);

				if (secs <= 0) { clearInterval(iv); location.href = ${JSON.stringify(returnTo)}; }

			}, 1000);

		})();

		</script>`

		: "";

	const headExtra = returnTo

		? `<meta http-equiv="refresh" content="${REDIRECT_DELAY_SECONDS};url=${escapedReturnTo}" />`

		: "";

	return page(

		`

		<h1>${escapeHtml(heading)}</h1>

		<p>${msg}</p>

		${redirectHtml}

		<table>

			<colgroup><col style="width:7rem;"><col></colgroup>

			<tbody>

				<tr>

					<td>${escapeHtml(resourceLabel)}</td>

					<td>

						<div><code><a href="https://pds.ls/${escapedResourceUri}">${escapedResourceUri}</a></code></div>

					</td>

				</tr>

				${

					recordUri

						? `<tr>

					<td>Record</td>

					<td>

						<div><code><a href="https://pds.ls/${escapeHtml(recordUri)}">${escapeHtml(recordUri)}</a></code></div>

					</td>

				</tr>`

						: ""

				}

			</tbody>

		</table>

	`,

		headExtra,

	);

}

export function renderError(message: string): string {

	return page(`<h1>Error</h1><p class="error">${escapeHtml(message)}</p>`);

}