Improve error formatting

This commit is contained in:
Carter McBride 2024-08-23 16:07:19 -06:00
parent 29540d285d
commit d57f6f03bd
2 changed files with 16 additions and 11 deletions

View file

@ -131,11 +131,16 @@ const categoriesSelectorCss = categories
class="font-system text-base md:grid grid-cols-12 auto-rows-min p-4 bg-orange-50 dark:bg-slate-900 dark:text-slate-300 text-stone-700 font-semibold" class="font-system text-base md:grid grid-cols-12 auto-rows-min p-4 bg-orange-50 dark:bg-slate-900 dark:text-slate-300 text-stone-700 font-semibold"
> >
<header <header
class="col-span-12 row-span-1 h-fit mb-4 flex flex-row gap-8 items-center" class="col-span-12 row-span-1 h-fit mb-4 flex flex-row gap-8 items-center overflow-auto"
> >
<h1 class="">Carter's RSS Feeds</h1> <h1 class="">Carter's RSS Feeds</h1>
<hr class="flex-grow h-px border-0 border-b-2 border-b-stone-500" /> <hr class="flex-grow h-px border-0 border-b-2 border-b-stone-500" />
<ul> <ul class="flex flex-row gap-2">
{
feedItems.errors.length > 0 ? (
<li>{feedItems.errors.length} error(s)</li>
) : null
}
<li> <li>
<a <a
href="https://github.com/carterworks/rss-reader" href="https://github.com/carterworks/rss-reader"
@ -148,7 +153,7 @@ const categoriesSelectorCss = categories
</header> </header>
<nav <nav
id="category-picker" id="category-picker"
class="flex flex-row mb-2 md:flex-col gap-2 md:gap-1 col-span-2 md:sticky md:top-4 row-span-1" class="flex flex-row mb-2 md:flex-col gap-2 md:gap-1 col-span-2 md:sticky md:top-4 row-span-1 md:mr-4"
> >
{ {
categories.map((category) => ( categories.map((category) => (
@ -158,10 +163,10 @@ const categoriesSelectorCss = categories
id={category} id={category}
name="category" name="category"
class="hidden peer" class="hidden peer"
checked={category === STATIC_CATEGORIES.All} checked={category === STATIC_CATEGORIES.Recent}
/> />
<label <label
class="cursor-pointer transition-all pr-4 opacity-25 peer-checked:opacity-100 hover:opacity-100 flex flex-row gap-2 items-center" class="cursor-pointer transition-all opacity-25 peer-checked:opacity-100 hover:opacity-100 flex flex-row gap-2 items-center"
for={category} for={category}
> >
<div <div
@ -233,15 +238,15 @@ const categoriesSelectorCss = categories
</ul> </ul>
</main> </main>
<footer <footer
class="sticky bottom-4 mt-4 md:mt-0 text-sm row-end-13 row-span-1 col-span-2 h-8 opacity-25 hover:opacity-100 transition-opacity" class="mt-4 md:mr-4 md:mt-0 text-sm row-end-13 row-span-1 col-span-2 overflow-auto max-h-20 opacity-25 hover:opacity-100 transition-opacity"
> >
{ {
feedItems.errors.length === 0 ? ( feedItems.errors.length === 0 ? (
<>No errors</> <>No errors</>
) : ( ) : (
<ul class=""> <ul>
{feedItems.errors.map((error) => ( {feedItems.errors.map((error) => (
<li class="break-words">{error}</li> <li class="break-words mb-2">{error}</li>
))} ))}
</ul> </ul>
) )

View file

@ -141,7 +141,7 @@ async function parseFeedContents(
})); }));
return items; return items;
} catch (err) { } catch (err) {
console.error(`Error processing: ${feedUrl}\n${err}`); console.error(`${feedUrl}\n${err}`);
throw err; throw err;
} }
} }
@ -162,10 +162,10 @@ export default async function getAllFeedItems(): Promise<{
return parseFeedContents(feedUrl, category).catch((err) => { return parseFeedContents(feedUrl, category).catch((err) => {
let toThrow: Error; let toThrow: Error;
if (err instanceof Error) { if (err instanceof Error) {
err.message = `Error fetching ${feedUrl}: ${err.message}`; err.message = `${feedUrl}: ${err.message}`;
toThrow = err; toThrow = err;
} else { } else {
toThrow = new Error(`Error fetching ${feedUrl}: ${err}`); toThrow = new Error(`${feedUrl}: ${err}`);
} }
return Promise.reject(toThrow); return Promise.reject(toThrow);
}); });