feat: improve mirror download (new tab & manual link)

This commit is contained in:
dyzulk
2025-12-31 09:47:39 +07:00
parent 8e0f97dbc2
commit 90261a5796
2 changed files with 47 additions and 10 deletions

View File

@@ -8,6 +8,7 @@ function DownloadMirrorContent() {
const searchParams = useSearchParams();
const [status, setStatus] = useState("Preparing your download...");
const [error, setError] = useState<string | null>(null);
const [downloadUrl, setDownloadUrl] = useState<string | null>(null);
useEffect(() => {
const serial = searchParams.get("serial");
@@ -22,27 +23,27 @@ function DownloadMirrorContent() {
// Construct backend URL
const baseUrl = process.env.NEXT_PUBLIC_BACKEND_URL;
let downloadUrl = `${baseUrl}/api/public/ca-certificates/${serial}/download`;
let url = `${baseUrl}/api/public/ca-certificates/${serial}/download`;
// Append target if specified (windows/mac)
if (target) {
downloadUrl += `/${target}`;
url += `/${target}`;
}
// Append format if specified (der)
if (format) {
downloadUrl += `?format=${format}`;
url += `?format=${format}`;
}
setDownloadUrl(url);
// Mirroring: Redirect to the backend download URL
setStatus("Redirecting to download...");
window.location.href = downloadUrl;
window.location.href = url;
// Optional: Auto close or go back after some time
// But usually the download happens in the background and the page stays
const timeout = setTimeout(() => {
setStatus("If your download didn't start automatically, please refresh this page.");
}, 5000);
setStatus("Your download should have started.");
}, 3000);
return () => clearTimeout(timeout);
}, [searchParams]);
@@ -76,11 +77,31 @@ function DownloadMirrorContent() {
<path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
</svg>
</div>
<h2 className="text-xl font-bold text-gray-900 dark:text-white">{status}</h2>
<p className="text-sm text-gray-500 dark:text-gray-400">Mirroring Download from TrustLab Trust Store</p>
<div>
<h2 className="text-xl font-bold text-gray-900 dark:text-white">{status}</h2>
<p className="text-sm text-gray-500 dark:text-gray-400 mt-2">Mirroring Download from TrustLab Trust Store</p>
</div>
{downloadUrl && (
<div className="pt-4 animate-in fade-in slide-in-from-bottom-4 duration-700 delay-500 fill-mode-both">
<p className="text-sm text-gray-500 dark:text-gray-400 mb-4">
If your download didn't start automatically,
</p>
<a
href={downloadUrl}
className="inline-flex items-center gap-2 text-brand-600 dark:text-brand-400 font-semibold hover:underline"
>
<svg className="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4" />
</svg>
klik disini untuk download manual
</a>
</div>
)}
</div>
)}
</div>
<div className="absolute inset-0 overflow-hidden pointer-events-none">
<CommonGridShape />