document.getElementById('lookupForm').addEventListener('submit', async function (event) {
	event.preventDefault();

	const lookupType = document.getElementById('lookupType').value;
	const lookupId = document.getElementById('lookupId').value;
	const messageElement = document.getElementById('message');
	const resultsTable = document.getElementById('resultsTable');
	const resultsTableBody = resultsTable.querySelector('tbody');
	resultsTableBody.innerHTML = ''; // Clear previous results

	try {
		const response = await fetch(`/api/v1/ban/${lookupType}/${lookupId}`);
		const data = await response.json();

		if (response.ok) {
			messageElement.style.display = 'block';
			messageElement.className = 'alert alert-success';
			messageElement.textContent = "Success!";
			resultsTable.style.display = 'table';
			data.forEach(result => {
				const row = document.createElement('tr');
				const banTimestamp = new Date(result.banTimestamp).toLocaleString();
				const expiresTimestamp = result.expiresTimestamp ? new Date(result.expiresTimestamp).toLocaleString() : 'Never';
				const reasonsFlagNames = getSetFlags(result.reasonsFlag, window.flags).join(', ');
				row.innerHTML = `
					<td>${result.id}</td>
					<td>${result.robloxId || 'N/A'}</td>
					<td>${result.discordId || 'N/A'}</td>
					<td>${result.robloxUsername || 'N/A'}</td>
					<td>${result.discordUsername || 'N/A'}</td>
					<td>${result.reasonShort || 'N/A'}</td>
					<td>${result.reasonLong || 'N/A'}</td>
					<td>${reasonsFlagNames}</td>
					<td>${result.moderator || 'N/A'}</td>
					<td>${banTimestamp}</td>
					<td style="color: ${result.expiresTimestamp && new Date(result.expiresTimestamp) < new Date() ? 'green' : ''};">
						${expiresTimestamp}
					</td>
				`;
				resultsTableBody.appendChild(row);
			});
		} else {
			messageElement.style.display = 'block';
			messageElement.className = 'alert alert-danger';
			messageElement.textContent = data.error || 'An error occurred';
		}
	} catch (error) {
		messageElement.style.display = 'block';
		messageElement.className = 'alert alert-danger';
		messageElement.textContent = 'An error occurred while fetching the data';
		console.error(error)
	}
});