fix: prevent "No highlights yet" flash on /me/highlights

Fix issue where "No highlights yet" message would show briefly when
navigating to /me/highlights even when user has many highlights.

Root cause:
- Sync effect only ran when myHighlights.length > 0
- Local highlights state could be empty during navigation
- "No highlights yet" condition didn't check myHighlightsLoading

Changes:
- Remove length check from sync effect (always sync myHighlights)
- Add myHighlightsLoading check to "No highlights yet" condition
- Now shows skeleton or content, never false empty state

The controller always has the highlights loaded, so we should always
sync them to local state regardless of length.
This commit is contained in:
Gigi
2025-10-18 21:52:25 +02:00
parent 809437faa6
commit 780996c7c5

View File

@@ -319,7 +319,7 @@ const Me: React.FC<MeProps> = ({
// Sync myHighlights from controller when viewing own profile
useEffect(() => {
if (isOwnProfile && myHighlights.length > 0) {
if (isOwnProfile) {
setHighlights(myHighlights)
}
}, [isOwnProfile, myHighlights])
@@ -457,7 +457,7 @@ const Me: React.FC<MeProps> = ({
</div>
)
}
return highlights.length === 0 && !loading ? (
return highlights.length === 0 && !loading && !(isOwnProfile && myHighlightsLoading) ? (
<div className="explore-loading" style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', padding: '4rem', color: 'var(--text-secondary)' }}>
No highlights yet.
</div>