justin/new-site
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve UX: better error messages, validation, and mobile fixes

Browse source 
FCC Compliance Check:
- FRN validation: shows "must be 10 digits" with digit count
- Auto-strips non-digits and pads to 10
- 30-second timeout with friendly message
- "Not found in any FCC database" with link to CORES
- Network error guidance
- FRN display uses overflow-wrap for mobile
- Error box uses innerHTML for clickable links

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
justin 2026-04-27 22:25:47 -05:00
parent 6865da2004
commit 4853f67f5e
1 changed files with 32 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

39
site/src/pages/tools/fcc-compliance-check.astro
View file

@ -100,7 +100,7 @@ import Base from "../../layouts/Base.astro";
<p id="entity-dba" class="text-sm text-gray-500 hidden"></p>
<p id="entity-address" class="text-sm text-gray-500 mt-1"></p>
<p class="mt-2 text-sm text-gray-600">
FRN: <span id="entity-frn" class="font-mono font-semibold text-gray-800"></span>
FRN: <span id="entity-frn" class="font-mono font-semibold text-gray-800" style="overflow-wrap:break-word;"></span>
</p>
<div id="entity-details" class="hidden mt-3 space-y-1 text-sm text-gray-600">
<p id="detail-filer-id"></p>
@ -338,8 +338,17 @@ import Base from "../../layouts/Base.astro";
frnInput.addEventListener("keydown", (e) => { if (e.key === "Enter") runCheck(); });
async function runCheck() {
const frn = frnInput.value.trim();
if (!frn) return;
const raw = frnInput.value.trim().replace(/\D/g, "");
if (!raw) {
showError("Please enter a 10-digit FRN.");
return;
}
if (raw.length !== 10) {
showError("FRN must be exactly 10 digits (e.g., 0012345678). You entered " + raw.length + " digits.");
return;
}
const frn = raw.padStart(10, "0");
frnInput.value = frn;
// Update URL
const url = new URL(window.location);
@ -352,22 +361,38 @@ import Base from "../../layouts/Base.astro";
loadingEl.classList.remove("hidden");
try {
const res = await fetch(`${API}/api/v1/fcc/lookup?frn=${frn}`);
const controller = new AbortController();
const timeout = setTimeout(() => controller.abort(), 30000);
const res = await fetch(`${API}/api/v1/fcc/lookup?frn=${frn}`, { signal: controller.signal });
clearTimeout(timeout);
if (!res.ok) {
const body = await res.json().catch(() => ({}));
throw new Error(body.detail || body.error || `Lookup failed (${res.status})`);
if (res.status === 400) {
throw new Error(body.error || "Invalid FRN format. Please check and try again.");
}
throw new Error(body.error || "FCC lookup failed. Please try again.");
}
const data = await res.json();
if (!data.entity_name && !data.cores?.entity_name && !data.filer_499) {
showError('FRN ' + frn + ' was not found in any FCC database. Verify your number at <a href="https://apps.fcc.gov/coresWeb/publicHome.do" target="_blank" style="color:#1e40af;text-decoration:underline;">FCC CORES</a>.');
return;
}
renderResults(data);
} catch (err) {
showError(err.message);
if (err.name === "AbortError") {
showError("The FCC databases are taking too long to respond. Please try again in a few moments.");
} else {
showError(err.message || "Could not reach the FCC databases. Please check your internet connection and try again.");
}
} finally {
loadingEl.classList.add("hidden");
}
}
function showError(msg) {
errorMessage.textContent = msg;
errorMessage.innerHTML = msg;
errorBox.classList.remove("hidden");
}