fix(marketplace): report comment load failures

[Zekbot001]

Summary

• surface comment-loading failures on directory, skill, MCP, and prompt detail pages
• stop rendering the misleading empty-thread message when the comments request failed
• cover all four public comment surfaces with one table-driven regression

Paid task

https://ugig.net/gigs/abd6b2a0-e728-48cf-a46f-f99e419ed94e

Verification

• pnpm exec vitest run src/components/MarketplaceComments.test.tsx
• pnpm exec eslint src/components/directory/DirectoryComments.tsx src/components/mcp/McpComments.tsx src/components/prompts/PromptComments.tsx src/components/skills/SkillComments.tsx src/components/MarketplaceComments.test.tsx
• git diff --check

[greptile-apps]

Greptile Summary

This PR fixes all four marketplace comment components (DirectoryComments, McpComments, PromptComments, SkillComments) to properly surface comment-loading failures instead of silently swallowing them, and adds a table-driven regression test covering all four surfaces.

• Error surfacing: Non-OK HTTP responses now parse the server error body (with a .catch(() => ({})) fallback for non-JSON) and call setError(...) instead of silently ignoring the failure; network-level errors in the catch block now set a generic message instead of being suppressed.
• Loading state correctness: setLoading(false) was moved into a finally block so it is always called, including on the new early-return path for non-OK responses.
• Empty-state guard: The render path now skips the "No comments yet" message when error is set, preventing a misleading empty-thread UI on failure; role=\"alert\" was added to the error div for accessibility.

Confidence Score: 5/5

This PR is safe to merge — all four changes are structurally identical, logically correct, and directly verified by the new test suite.

The fetchComments refactor is mechanically consistent across all four components: the finally block guarantees setLoading(false) fires on every exit path (early return, normal completion, and thrown exception), the .catch(() => ({})) fallback correctly handles non-JSON error bodies, and the error ? null : guard in the render path reliably prevents the misleading empty-state message. The new table-driven test directly exercises the 503 path for every surface and asserts both the alert content and the absence of the empty-state text. No logic changes were made to the happy path or to handlePost.

No files require special attention.

Important Files Changed

Filename	Overview
src/components/directory/DirectoryComments.tsx	Error handling refactored: non-OK responses now set error state instead of silently ignoring; setLoading moved to finally; error ? null guard added to prevent false empty-state message
src/components/mcp/McpComments.tsx	Identical error-surfacing fix as DirectoryComments — non-OK responses now set error, finally block handles loading state, empty-state guarded behind error check
src/components/prompts/PromptComments.tsx	Identical error-surfacing fix applied to PromptComments, consistent with the other three surfaces
src/components/skills/SkillComments.tsx	Identical error-surfacing fix applied to SkillComments, consistent with the other three surfaces
src/components/MarketplaceComments.test.tsx	New table-driven test covering all four comment surfaces; stubs fetch with a 503, asserts alert role is shown with server error text and empty-state message is absent

Sequence Diagram

sequenceDiagram
    participant C as Component (mount)
    participant F as fetchComments()
    participant API as /api/.../comments

    C->>F: useEffect triggers fetchComments()
    F->>API: GET request
    alt HTTP 2xx (ok)
        API-->>F: "200 OK + {comments, total}"
        F->>C: setComments(), setTotal()
        F->>C: finally: setLoading(false)
        C->>C: render comment list (or empty state)
    else HTTP error (non-ok)
        API-->>F: "4xx/5xx + {error: ...}"
        F->>C: "setError(data.error || "Failed to load comments")"
        F->>F: return (exits try block)
        F->>C: finally: setLoading(false)
        C->>C: "render role=alert error banner, suppress empty-state"
    else Network failure
        API-->>F: throws (network error)
        F->>C: catch: setError("Failed to load comments")
        F->>C: finally: setLoading(false)
        C->>C: "render role=alert error banner, suppress empty-state"
    end

Loading

_{Reviews (1): Last reviewed commit: "fix(marketplace): report comment load fa..." | Re-trigger Greptile}