@forgeframework/react-query

Data fetching and server state management library for Forge Framework web applications.

Part of the Forge Framework — a TypeScript framework for backend microservices and web applications.

Installation

npm install @forgeframework/react-query

Usage

import { QueryClient, ForgeQueryProvider, useQuery, useMutation, ApiClient } from '@forgeframework/react-query';

const queryClient = new QueryClient({
  defaultOptions: { staleTime: 30_000, retryCount: 3 },
});

const api = new ApiClient({ baseUrl: '/api/v1' });

function UserList() {
  const { data: users, isLoading } = useQuery({
    key: ['users'],
    fetcher: () => api.get<User[]>('/users').then((r) => r.data),
  });

  const createUser = useMutation({
    mutationFn: (newUser: CreateUserDto) => api.post<User>('/users', newUser).then((r) => r.data),
    invalidateKeys: [['users']],
  });

  if (isLoading) return <Spinner />;

  return (
    <div>
      {users?.map((user) => <UserCard key={user.id} user={user} />)}
      <button onClick={() => createUser.mutate({ name: 'New User' })}>Add User</button>
    </div>
  );
}

Documentation

Full API reference and guides: https://carbonforge.io/framework/docs/web/react-query

(Documentation site launching soon.)

License

MIT © Carbon Forge