forked from tanner/qotnews
style: Improve error messages and loading text, add spacing to error details
This commit is contained in:
@@ -60,7 +60,7 @@ function Feed({ updateCache }) {
|
|||||||
errorMessage = `The request to fetch story '${newStory.title}' (${newStory.id}) timed out after 10 seconds. Your connection may be unstable.`;
|
errorMessage = `The request to fetch story '${newStory.title}' (${newStory.id}) timed out after 10 seconds. Your connection may be unstable.`;
|
||||||
console.log('Fetch timed out for story:', newStory.id);
|
console.log('Fetch timed out for story:', newStory.id);
|
||||||
} else {
|
} else {
|
||||||
errorMessage = `An error occurred while fetching story '${newStory.title}' (${newStory.id}): ${error.toString()}`;
|
errorMessage = `An error occurred while fetching story '${newStory.title}' (ID: ${newStory.id}): ${error.toString()}.`;
|
||||||
console.log('Fetch failed for story:', newStory.id, error);
|
console.log('Fetch failed for story:', newStory.id, error);
|
||||||
}
|
}
|
||||||
setError(errorMessage);
|
setError(errorMessage);
|
||||||
@@ -79,7 +79,7 @@ function Feed({ updateCache }) {
|
|||||||
setStories(finalStories);
|
setStories(finalStories);
|
||||||
},
|
},
|
||||||
(error) => {
|
(error) => {
|
||||||
const errorMessage = `Failed to fetch the main story list from the API. Your connection may be down or the server might be experiencing issues. Error: ${error.toString()}`;
|
const errorMessage = `Failed to fetch the main story list from the API. Your connection may be down or the server might be experiencing issues. ${error.toString()}.`;
|
||||||
setError(errorMessage);
|
setError(errorMessage);
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
@@ -92,7 +92,7 @@ function Feed({ updateCache }) {
|
|||||||
<meta name="robots" content="index" />
|
<meta name="robots" content="index" />
|
||||||
</Helmet>
|
</Helmet>
|
||||||
{error &&
|
{error &&
|
||||||
<details>
|
<details style={{marginBottom: '1rem'}}>
|
||||||
<summary>Connection error? Click to expand.</summary>
|
<summary>Connection error? Click to expand.</summary>
|
||||||
<p>{error}</p>
|
<p>{error}</p>
|
||||||
</details>
|
</details>
|
||||||
@@ -116,7 +116,7 @@ function Feed({ updateCache }) {
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
:
|
:
|
||||||
<p>loading...</p>
|
<p>Loading...</p>
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user