TypeScript Error When Using `Effect.runPromise` with `getApiClient` in React Hook

import { HttpApiClient, HttpClient } from "@effect/platform"
import { Effect } from "effect"
import { Api } from "@api"

export const getApiClient: Effect.Effect<Api, never, HttpClient.HttpClient> = Effect.gen(function* () {
  const client = yield* HttpApiClient.make(Api, {
    baseUrl: "/api",
  })

  return client
})

import { useEffect, useState } from "react"
import { Effect } from "effect"
import { Api } from "@api"
import { getApiClient } from "../api/client"

export function useApiClient() {
  const [client, setClient] = useState<Api | null>(null)

  useEffect(() => {
    Effect.runPromise(getApiClient)
      .then(setClient)
      .catch((error: unknown) => {
        Effect.logError(`API Client Error: ${String(error)}`)
      })
  }, [])
  return client
}