@juliodevelop/api-client

HTTP client factory com Axios, interceptors JWT automáticos e hooks TanStack React Query.

Instalação

npm install @juliodevelop/api-client
# peer deps:
npm install axios @tanstack/react-query react

Requer .npmrc configurado com o registry @juliodevelop. Veja o README raiz.

Uso

Criar o client

import { createApiClient } from '@juliodevelop/api-client'

const api = createApiClient({
  baseURL: 'https://api.example.com',
  getToken: () => localStorage.getItem('token'),
  onUnauthorized: () => {
    window.location.href = '/login'
  },
  refreshToken: async () => {
    const res = await fetch('/api/auth/refresh')
    const data = await res.json()
    return data.token
  },
})

React Query Hooks

import { createApiHooks } from '@juliodevelop/api-client'

const { useGet, usePost, usePut, useDelete, usePatch } = createApiHooks(api)

// GET
const { data, isLoading } = useGet<User[]>('/users')

// POST com invalidação automática
const createUser = usePost<User, CreateUserDTO>('/users', {
  invalidateKeys: [['users']],
})
createUser.mutate({ name: 'Julio', email: '[email protected]' })

Provider

import { ApiProvider } from '@juliodevelop/api-client'

function App() {
  return (
    <ApiProvider client={api}>
      <MyApp />
    </ApiProvider>
  )
}

Next.js SSR

const api = createApiClient({
  baseURL: '/api',
  getToken: async () => {
    const { cookies } = await import('next/headers')
    return cookies().get('token')?.value ?? null
  },
})