diff --git a/src/components/ProgressGuide/List.tsx b/src/components/ProgressGuide/List.tsx index 5718b4d3fd..d6b0480443 100644 --- a/src/components/ProgressGuide/List.tsx +++ b/src/components/ProgressGuide/List.tsx @@ -1,4 +1,4 @@ -import {useState} from 'react' +import {useEffect, useState} from 'react' import { type LayoutChangeEvent, type StyleProp, @@ -43,8 +43,16 @@ export function ProgressGuideList({style}: {style?: StyleProp}) { const actualFollowsCount = follows?.pages?.[0]?.follows?.length ?? 0 - // Hide if user already follows 10+ people - if (guide?.guide === 'follow-10' && actualFollowsCount >= TOTAL_AVATARS) { + // Clear stale guide if user already follows 10+ people + const shouldEndGuide = + guide?.guide === 'follow-10' && actualFollowsCount >= TOTAL_AVATARS + useEffect(() => { + if (shouldEndGuide) { + endProgressGuide() + } + }, [shouldEndGuide, endProgressGuide]) + + if (shouldEndGuide) { return null }