sickn33/agentic-awesome-skills · error · Error

HTTP error: ${response.status}

Error message

HTTP error: ${response.status}

What it means

In fp-refactor's fetchUser, this throws when the GET /api/users/:id response has ok === false, before JSON parsing. The skill contrasts this try/catch tower with a composed pipeline using TaskEither.

Source

Thrown at skills/fp-refactor/SKILL.md:166

### Step-by-Step Refactoring Guide

1. **Identify the error type**: Determine what errors can occur and create appropriate error types
2. **Change return type**: From `T` to `Either<E, T>` where `E` is your error type
3. **Replace throw statements**: Convert `throw new Error(...)` to `E.left(new Error(...))`
4. **Replace return statements**: Convert `return value` to `E.right(value)`
5. **Remove try-catch blocks**: They're no longer needed
6. **Update callers**: Use `pipe` with `E.flatMap` to chain operations

### Pattern: Async try-catch to TaskEither

#### Before (Imperative)

```typescript
async function fetchUser(id: string): Promise<User> {
  try {
    const response = await fetch(`/api/users/${id}`);
    if (!response.ok) {
      throw new Error(`HTTP error: ${response.status}`);
    }
    const data = await response.json();
    return validateUser(data);
  } catch (error) {
    throw new Error(`Failed to fetch user: ${error}`);
  }
}

async function fetchUserPosts(userId: string): Promise<Post[]> {
  try {
    const response = await fetch(`/api/users/${userId}/posts`);
    if (!response.ok) {
      throw new Error(`HTTP error: ${response.status}`);
    }
    return await response.json();
  } catch (error) {
    throw new Error(`Failed to fetch posts: ${error}`);
  }

View on GitHub (pinned to 58d857988f)

Solutions

1. Check the status code in the thrown message and fix the corresponding cause (re-auth for 401, verify id for 404)
2. Centralize fetch with interceptors that refresh tokens and retry once
3. Refactor to TE.chain pipelines so status errors flow as Left values with context

Example fix

// before
const response = await fetch(`/api/users/${id}`)
if (!response.ok) throw new Error(`HTTP error: ${response.status}`)

// after
const httpGet = (url: string) =>
  TE.tryCatch(async () => {
    const r = await fetch(url)
    if (!r.ok) throw Object.assign(new Error(`HTTP ${r.status}`), { status: r.status })
    return r.json()
  }, E.toError)

try {
  await fetchUser(id)
} catch (e) {
  const m = /HTTP error: (\d+)/.exec(String(e))
  if (m) switch (m[1]) {
    case '401': /* re-auth */ break
    case '404': /* render not-found */ break
    default: throw e
  }
}

When it happens

Trigger: fetch to /api/users/:id returning 401/403/404/500 — wrong id, expired session, or server error.

Common situations: Auth cookie/token expired between page load and API call; reverse proxy returning 502 while backend restarts; id typos from user-entered values.

Related errors

• HTTP ${response.status}: ${response.statusText}
• HTTP ${res.status}
• HTTP ${response.status}
• Failed to fetch user: ${error}
• Failed to fetch posts: ${error}

AI-assisted analysis of sickn33/agentic-awesome-skills@58d857988f (2026-08-26). Data as JSON: /api/errors/fce15f4e65597d36. Report an issue: GitHub.