tanner/qotnews
1
0
Fork 1
Code Issues Pull Requests Releases Wiki Activity

feat: Add detailed, expandable error messages to Article component

Browse Source 
Co-authored-by: aider (gemini/gemini-2.5-pro) <aider@aider.chat>
This commit is contained in:
Tanner Collin
2025-11-21 22:34:24 +00:00
parent 61ec583882
commit 62d5915133
1 changed files with 15 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
webclient/src/Article.js
View File

@@ -10,7 +10,7 @@ function Article({ cache }) {
if (id in cache) console.log('cache hit'); if (id in cache) console.log('cache hit');
const [story, setStory] = useState(cache[id] || false); const [story, setStory] = useState(cache[id] || false);
const [error, setError] = useState(false); const [error, setError] = useState('');
const [pConv, setPConv] = useState([]); const [pConv, setPConv] = useState([]);
useEffect(() => { useEffect(() => {
@@ -24,14 +24,20 @@ function Article({ cache }) {
); );
fetch('/api/' + id) fetch('/api/' + id)
.then(res => res.json()) .then(res => {
if (!res.ok) {
throw new Error(`Server responded with ${res.status} ${res.statusText}`);
}
return res.json();
})
.then( .then(
(result) => { (result) => {
setStory(result.story); setStory(result.story);
localForage.setItem(id, result.story); localForage.setItem(id, result.story);
}, },
(error) => { (error) => {
setError(true); const errorMessage = `Failed to fetch article content (ID: ${id}). Your connection may be down or the server might be experiencing issues. ${error.toString()}.`;
setError(errorMessage);
} }
); );
}, [id]); }, [id]);
@@ -51,7 +57,12 @@ function Article({ cache }) {
return ( return (
<div className='article-container'> <div className='article-container'>
{error && <p>Connection error?</p>} {error &&
<details style={{marginBottom: '1rem'}}>
<summary>Connection error? Click to expand.</summary>
<p>{error}</p>
</details>
}
{story ? {story ?
<div className='article'> <div className='article'>
<Helmet> <Helmet>