diff --git a/src/pages/CommunitiesPage.tsx b/src/pages/CommunitiesPage.tsx index 443bf5e6..0bfc8595 100644 --- a/src/pages/CommunitiesPage.tsx +++ b/src/pages/CommunitiesPage.tsx @@ -102,7 +102,7 @@ export function CommunitiesPage() { // Lift org moderation to the page so search results can drop hidden // groups (or include them when the Show-hidden switch is on). - const { data: orgModeration } = useOrganizationModeration(); + const { data: orgModeration, isReady: orgModerationReady } = useOrganizationModeration(); const { searchHits, searchHiddenCount } = useMemo(() => { if (!searchHitsRaw) return { searchHits: undefined, searchHiddenCount: 0 }; const hiddenCoords = orgModeration?.hiddenCoords ?? new Set(); @@ -161,6 +161,15 @@ export function CommunitiesPage() { .filter((c) => (isMod && showHidden) || !hiddenCoords.has(c.aTag)); }, [featuredOrgs, orgModeration, isMod, showHidden]); + // Idle-render skeleton gate. `useFeaturedOrganizations` is internally + // gated on `moderationReady`, so while the moderation labels are + // still loading, the hook is *disabled* and reports `isLoading: false` + // / `data: undefined`. Treating that as "not loading" would render + // the empty state for a moment before the curated grid pops in; + // tracking moderation-readiness here keeps the skeleton on screen + // until we know what's featured. + const idleLoading = !orgModerationReady || featuredOrgsLoading || featuredOrgs === undefined; + // Search + sort + show-hidden cluster for the unified section. const searchToolbar = ( )} - ) : featuredOrgsLoading ? ( + ) : idleLoading ? ( {Array.from({ length: 8 }).map((_, i) => (