frontend: mandar alert en error

This commit is contained in:
Cat /dev/Nulo 2023-12-09 14:09:50 -03:00
parent 6c65aa2ead
commit e9de6d00d4
3 changed files with 23 additions and 23 deletions

View file

@ -11,9 +11,9 @@
export let params: { dumpUrl: string; portal: string; id: string }; export let params: { dumpUrl: string; portal: string; id: string };
$: url = decodeURIComponent(params.dumpUrl) + "/" + params.portal; $: url = decodeURIComponent(params.dumpUrl) + "/" + params.portal;
$: data = Promise.all([fetchData(url), fetchErrors(url)]).then( $: data = Promise.all([fetchData(url), fetchErrors(url)])
([data, errors]) => ({ data, errors }), .then(([data, errors]) => ({ data, errors }))
); .catch(alert);
</script> </script>
<main class="mx-auto max-w-3xl"> <main class="mx-auto max-w-3xl">
@ -28,9 +28,9 @@
<NotFound /> <NotFound />
{:else} {:else}
<header <header
class="py-5 px-6 border-b border-b-gray-200 dark:border-b-gray-700" class="border-b border-b-gray-200 px-6 py-5 dark:border-b-gray-700"
> >
<h1 class="font-bold text-3xl">{dataset.title}</h1> <h1 class="text-3xl font-bold">{dataset.title}</h1>
<p class="text-xl">{dataset.description}</p> <p class="text-xl">{dataset.description}</p>
<!-- <!--
lo saqué porque aún antes de que venga la motosierra estos links no funcionan... lo saqué porque aún antes de que venga la motosierra estos links no funcionan...
@ -54,13 +54,13 @@
e.datasetIdentifier === dataset.identifier && e.datasetIdentifier === dataset.identifier &&
e.distributionIdentifier === dist.identifier, e.distributionIdentifier === dist.identifier,
)} )}
<li class="flex px-6 py-5 justify-between items-center"> <li class="flex items-center justify-between px-6 py-5">
<div> <div>
<h3> <h3>
{dist.title} {dist.title}
{#if dist.format} {#if dist.format}
<span <span
class="border border-current text-blue-800 dark:text-blue-400 relative inline-flex items-center text-xs font-semibold px-2 py-1 rounded-full ml-1" class="relative ml-1 inline-flex items-center rounded-full border border-current px-2 py-1 text-xs font-semibold text-blue-800 dark:text-blue-400"
> >
<span>{dist.format}</span> <span>{dist.format}</span>
</span> </span>
@ -85,7 +85,7 @@
{#if !error} {#if !error}
<button <button
type="button" type="button"
class="inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 bg-blue-600 rounded-md hover:bg-blue-700 focus:ring-2 focus:ring-offset-2 focus:ring-blue-700 focus:shadow-outline focus:outline-none" class="focus:shadow-outline inline-flex items-center justify-center rounded-md bg-blue-600 px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-700 focus:ring-offset-2"
on:click={() => downloadFile(url, dataset.identifier, dist)} on:click={() => downloadFile(url, dataset.identifier, dist)}
>Descargar</button >Descargar</button
> >

View file

@ -8,7 +8,7 @@
export let params: { dumpUrl: string }; export let params: { dumpUrl: string };
$: url = decodeURIComponent(params.dumpUrl); $: url = decodeURIComponent(params.dumpUrl);
$: metadataPromise = fetchDumpMetadata(url); $: metadataPromise = fetchDumpMetadata(url).catch(alert);
</script> </script>
<main class="mx-auto max-w-3xl"> <main class="mx-auto max-w-3xl">
@ -17,12 +17,12 @@
<p class="p-6">Cargando..</p> <p class="p-6">Cargando..</p>
{:then metadata} {:then metadata}
<header <header
class="py-5 px-6 border-b border-b-gray-200 dark:border-b-gray-700 leading-none" class="border-b border-b-gray-200 px-6 py-5 leading-none dark:border-b-gray-700"
> >
<small> <small>
Viendo archivo en Viendo archivo en
<a <a
class="underline text-blue-500 dark:text-blue-300" class="text-blue-500 underline dark:text-blue-300"
target="_blank" target="_blank"
rel="noopener" rel="noopener"
href={url}>{url}</a href={url}>{url}</a
@ -37,15 +37,15 @@
portal: site.path, portal: site.path,
})} })}
<li> <li>
<div class="flex px-6 py-5 justify-between gap-3"> <div class="flex justify-between gap-3 px-6 py-5">
<div class="flex flex-col"> <div class="flex flex-col">
<h3 class="text-lg">{site.title}</h3> <h3 class="text-lg">{site.title}</h3>
<p class="text-sm">{site.description}</p> <p class="text-sm">{site.description}</p>
</div> </div>
<div class="flex flex-col items-center justify-center shrink-0"> <div class="flex shrink-0 flex-col items-center justify-center">
<a <a
href={portalLink} href={portalLink}
class="inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 bg-blue-600 rounded-md hover:bg-blue-700 focus:ring-2 focus:ring-offset-2 focus:ring-blue-700 focus:shadow-outline focus:outline-none" class="focus:shadow-outline inline-flex items-center justify-center rounded-md bg-blue-600 px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-700 focus:ring-offset-2"
>Ver portal</a >Ver portal</a
> >
<SourceLink href={site.url} /> <SourceLink href={site.url} />

View file

@ -11,9 +11,9 @@
export let params: { dumpUrl: string; portal: string }; export let params: { dumpUrl: string; portal: string };
$: url = `${decodeURIComponent(params.dumpUrl)}/${params.portal}`; $: url = `${decodeURIComponent(params.dumpUrl)}/${params.portal}`;
$: data = Promise.all([fetchData(url), fetchErrors(url)]).then( $: data = Promise.all([fetchData(url), fetchErrors(url)])
([data, errors]) => ({ data, errors }), .then(([data, errors]) => ({ data, errors }))
); .catch(alert);
function arreglarHomepageUrl(url: string): string { function arreglarHomepageUrl(url: string): string {
if (!url.startsWith("http://") && !url.startsWith("https://")) if (!url.startsWith("http://") && !url.startsWith("https://"))
@ -51,29 +51,29 @@
<p class="p-6">Cargando..</p> <p class="p-6">Cargando..</p>
{:then { data, errors }} {:then { data, errors }}
<header <header
class="py-5 px-6 border-b border-b-gray-200 dark:border-b-gray-700 leading-none" class="border-b border-b-gray-200 px-6 py-5 leading-none dark:border-b-gray-700"
> >
<small> <small>
Viendo portal archivado de Viendo portal archivado de
<a <a
class="underline text-blue-500 dark:text-blue-300" class="text-blue-500 underline dark:text-blue-300"
target="_blank" target="_blank"
rel="noopener" rel="noopener"
href={url}>{url}</a href={url}>{url}</a
> >
</small> </small>
<h1 class="font-bold text-3xl">{data.title}</h1> <h1 class="text-3xl font-bold">{data.title}</h1>
<p class="text-xl">{data.description}</p> <p class="text-xl">{data.description}</p>
{#if data.homepage} {#if data.homepage}
<SourceLink href={arreglarHomepageUrl(data.homepage)} /> <SourceLink href={arreglarHomepageUrl(data.homepage)} />
{/if} {/if}
</header> </header>
<div class="w-full mx-auto px-6 py-2"> <div class="mx-auto w-full px-6 py-2">
<input <input
type="text" type="text"
placeholder="Buscar..." placeholder="Buscar..."
class="flex w-full h-10 px-3 py-2 text-sm bg-white dark:bg-gray-800 border rounded-md border-neutral-300 dark:border-gray-700 ring-offset-background placeholder:text-neutral-500 dark:placeholder:text-gray-500 focus:border-neutral-300 dark:focus:border-gray-700 focus:outline-none focus:ring-2 focus:ring-neutral-400 dark:focus:ring-gray-600 disabled:cursor-not-allowed disabled:opacity-50" class="ring-offset-background flex h-10 w-full rounded-md border border-neutral-300 bg-white px-3 py-2 text-sm placeholder:text-neutral-500 focus:border-neutral-300 focus:outline-none focus:ring-2 focus:ring-neutral-400 disabled:cursor-not-allowed disabled:opacity-50 dark:border-gray-700 dark:bg-gray-800 dark:placeholder:text-gray-500 dark:focus:border-gray-700 dark:focus:ring-gray-600"
bind:value={query} bind:value={query}
/> />
</div> </div>
@ -87,7 +87,7 @@
})} })}
<li> <li>
<a <a
class="flex px-6 py-5 hover:bg-gray-50 dark:hover:bg-gray-700 justify-between" class="flex justify-between px-6 py-5 hover:bg-gray-50 dark:hover:bg-gray-700"
href={datasetLink} href={datasetLink}
> >
<div> <div>