Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions .changeset/blue-lions-bake.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
---
'@tanstack/pacer-devtools': patch
'@tanstack/react-pacer': patch
'@tanstack/solid-pacer': patch
'@tanstack/pacer': patch
---

feat(async-batcher): make result a type parameter
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,10 @@ title: useAsyncBatchedCallback
# Function: useAsyncBatchedCallback()

```ts
function useAsyncBatchedCallback<TFn>(fn, options): (...args) => Promise<void>
function useAsyncBatchedCallback<TValue, TResult>(fn, options): (item) => Promise<void>
```

Defined in: [react-pacer/src/async-batcher/useAsyncBatchedCallback.ts:43](https://github.com/TanStack/pacer/blob/main/packages/react-pacer/src/async-batcher/useAsyncBatchedCallback.ts#L43)
Defined in: [react-pacer/src/async-batcher/useAsyncBatchedCallback.ts:42](https://github.com/TanStack/pacer/blob/main/packages/react-pacer/src/async-batcher/useAsyncBatchedCallback.ts#L42)

A React hook that creates a batched version of an async callback function.
This hook is a convenient wrapper around the `useAsyncBatcher` hook,
Expand All @@ -34,27 +34,29 @@ Consider using the `useAsyncBatcher` hook instead.

## Type Parameters

• **TFn** *extends* `AnyAsyncFunction`
• **TValue**

• **TResult**

## Parameters

### fn

(`items`) => `Promise`\<`any`\>
(`items`) => `Promise`\<`TResult`\>

### options

`AsyncBatcherOptions`\<`Parameters`\<`TFn`\>\[`0`\]\>
`AsyncBatcherOptions`\<`TValue`, `TResult`\>

## Returns

`Function`

### Parameters

#### args
#### item

...`Parameters`\<`TFn`\>
`TValue`

### Returns

Expand Down
22 changes: 12 additions & 10 deletions docs/framework/react/reference/functions/useasyncbatcher.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,10 @@ title: useAsyncBatcher
# Function: useAsyncBatcher()

```ts
function useAsyncBatcher<TValue, TSelected>(
function useAsyncBatcher<TValue, TResult, TSelected>(
fn,
options,
selector): ReactAsyncBatcher<TValue, TSelected>
selector): ReactAsyncBatcher<TValue, TResult, TSelected>
```

Defined in: [react-pacer/src/async-batcher/useAsyncBatcher.ts:167](https://github.com/TanStack/pacer/blob/main/packages/react-pacer/src/async-batcher/useAsyncBatcher.ts#L167)
Expand Down Expand Up @@ -75,32 +75,34 @@ Available state properties:

• **TValue**

• **TResult**

• **TSelected** = \{\}

## Parameters

### fn

(`items`) => `Promise`\<`any`\>
(`items`) => `Promise`\<`TResult`\>

### options

`AsyncBatcherOptions`\<`TValue`\> = `{}`
`AsyncBatcherOptions`\<`TValue`, `TResult`\> = `{}`

### selector

(`state`) => `TSelected`

## Returns

[`ReactAsyncBatcher`](../../interfaces/reactasyncbatcher.md)\<`TValue`, `TSelected`\>
[`ReactAsyncBatcher`](../../interfaces/reactasyncbatcher.md)\<`TValue`, `TResult`, `TSelected`\>

## Example

```tsx
// Basic async batcher for API requests - no reactive state subscriptions
const asyncBatcher = useAsyncBatcher(
async (items) => {
async (items: Item[]) => {
const results = await Promise.all(items.map(item => processItem(item)));
return results;
},
Expand All @@ -109,7 +111,7 @@ const asyncBatcher = useAsyncBatcher(

// Opt-in to re-render when execution state changes (optimized for loading indicators)
const asyncBatcher = useAsyncBatcher(
async (items) => {
async (items: Item[]) => {
const results = await Promise.all(items.map(item => processItem(item)));
return results;
},
Expand All @@ -123,7 +125,7 @@ const asyncBatcher = useAsyncBatcher(

// Opt-in to re-render when results are available (optimized for data display)
const asyncBatcher = useAsyncBatcher(
async (items) => {
async (items: Item[]) => {
const results = await Promise.all(items.map(item => processItem(item)));
return results;
},
Expand All @@ -137,7 +139,7 @@ const asyncBatcher = useAsyncBatcher(

// Opt-in to re-render when error state changes (optimized for error handling)
const asyncBatcher = useAsyncBatcher(
async (items) => {
async (items: Item[]) => {
const results = await Promise.all(items.map(item => processItem(item)));
return results;
},
Expand All @@ -155,7 +157,7 @@ const asyncBatcher = useAsyncBatcher(

// Complete example with all callbacks
const asyncBatcher = useAsyncBatcher(
async (items) => {
async (items: Item[]) => {
const results = await Promise.all(items.map(item => processItem(item)));
return results;
},
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,18 +5,20 @@ title: ReactAsyncBatcher

<!-- DO NOT EDIT: this page is autogenerated from the type comments -->

# Interface: ReactAsyncBatcher\<TValue, TSelected\>
# Interface: ReactAsyncBatcher\<TValue, TResult, TSelected\>

Defined in: [react-pacer/src/async-batcher/useAsyncBatcher.ts:10](https://github.com/TanStack/pacer/blob/main/packages/react-pacer/src/async-batcher/useAsyncBatcher.ts#L10)

## Extends

- `Omit`\<`AsyncBatcher`\<`TValue`\>, `"store"`\>
- `Omit`\<`AsyncBatcher`\<`TValue`, `TResult`\>, `"store"`\>

## Type Parameters

• **TValue**

• **TResult**

• **TSelected** = \{\}

## Properties
Expand All @@ -38,7 +40,7 @@ Use this instead of `batcher.store.state`
### ~~store~~

```ts
readonly store: Store<Readonly<AsyncBatcherState<TValue>>>;
readonly store: Store<Readonly<AsyncBatcherState<TValue, TResult>>>;
```

Defined in: [react-pacer/src/async-batcher/useAsyncBatcher.ts:23](https://github.com/TanStack/pacer/blob/main/packages/react-pacer/src/async-batcher/useAsyncBatcher.ts#L23)
Expand Down
18 changes: 10 additions & 8 deletions docs/framework/solid/reference/functions/createasyncbatcher.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,10 @@ title: createAsyncBatcher
# Function: createAsyncBatcher()

```ts
function createAsyncBatcher<TValue, TSelected>(
function createAsyncBatcher<TValue, TResult, TSelected>(
fn,
initialOptions,
selector): SolidAsyncBatcher<TValue, TSelected>
selector): SolidAsyncBatcher<TValue, TResult, TSelected>
```

Defined in: [async-batcher/createAsyncBatcher.ts:128](https://github.com/TanStack/pacer/blob/main/packages/solid-pacer/src/async-batcher/createAsyncBatcher.ts#L128)
Expand Down Expand Up @@ -71,7 +71,7 @@ Example usage:
```tsx
// Default behavior - no reactive state subscriptions
const asyncBatcher = createAsyncBatcher(
async (items) => {
async (items: Item[]) => {
const results = await Promise.all(items.map(item => processItem(item)));
return results;
},
Expand All @@ -89,7 +89,7 @@ const asyncBatcher = createAsyncBatcher(

// Opt-in to re-render when items or isExecuting changes (optimized for UI updates)
const asyncBatcher = createAsyncBatcher(
async (items) => {
async (items: Item[]) => {
const results = await Promise.all(items.map(item => processItem(item)));
return results;
},
Expand All @@ -99,7 +99,7 @@ const asyncBatcher = createAsyncBatcher(

// Opt-in to re-render when error state changes (optimized for error handling)
const asyncBatcher = createAsyncBatcher(
async (items) => {
async (items: Item[]) => {
const results = await Promise.all(items.map(item => processItem(item)));
return results;
},
Expand All @@ -121,22 +121,24 @@ const { items, isExecuting } = asyncBatcher.state();

• **TValue**

• **TResult**

• **TSelected** = \{\}

## Parameters

### fn

(`items`) => `Promise`\<`any`\>
(`items`) => `Promise`\<`TResult`\>

### initialOptions

`AsyncBatcherOptions`\<`TValue`\> = `{}`
`AsyncBatcherOptions`\<`TValue`, `TResult`\> = `{}`

### selector

(`state`) => `TSelected`

## Returns

[`SolidAsyncBatcher`](../../interfaces/solidasyncbatcher.md)\<`TValue`, `TSelected`\>
[`SolidAsyncBatcher`](../../interfaces/solidasyncbatcher.md)\<`TValue`, `TResult`, `TSelected`\>
Original file line number Diff line number Diff line change
Expand Up @@ -5,18 +5,20 @@ title: SolidAsyncBatcher

<!-- DO NOT EDIT: this page is autogenerated from the type comments -->

# Interface: SolidAsyncBatcher\<TValue, TSelected\>
# Interface: SolidAsyncBatcher\<TValue, TResult, TSelected\>

Defined in: [async-batcher/createAsyncBatcher.ts:10](https://github.com/TanStack/pacer/blob/main/packages/solid-pacer/src/async-batcher/createAsyncBatcher.ts#L10)

## Extends

- `Omit`\<`AsyncBatcher`\<`TValue`\>, `"store"`\>
- `Omit`\<`AsyncBatcher`\<`TValue`, `TResult`\>, `"store"`\>

## Type Parameters

• **TValue**

• **TResult**

• **TSelected** = \{\}

## Properties
Expand All @@ -38,7 +40,7 @@ Use this instead of `batcher.store.state`
### ~~store~~

```ts
readonly store: Store<Readonly<AsyncBatcherState<TValue>>>;
readonly store: Store<Readonly<AsyncBatcherState<TValue, TResult>>>;
```

Defined in: [async-batcher/createAsyncBatcher.ts:23](https://github.com/TanStack/pacer/blob/main/packages/solid-pacer/src/async-batcher/createAsyncBatcher.ts#L23)
Expand Down
32 changes: 16 additions & 16 deletions docs/guides/async-batching.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,8 +26,8 @@ The `asyncBatch` function provides a simple way to create an async batching func
```ts
import { asyncBatch } from '@tanstack/pacer'

const processAsyncBatch = asyncBatch<number>(
async (items) => {
const processAsyncBatch = asyncBatch(
async (items: number[]) => {
// Process the batch asynchronously
const results = await Promise.all(
items.map(item => processApiCall(item))
Expand Down Expand Up @@ -65,8 +65,8 @@ For more control over async batch behavior, use the `AsyncBatcher` class directl
```ts
import { AsyncBatcher } from '@tanstack/pacer'

const batcher = new AsyncBatcher<number>(
async (items) => {
const batcher = new AsyncBatcher(
async (items: number[]) => {
// Process the batch asynchronously
const results = await Promise.all(
items.map(item => processApiCall(item))
Expand Down Expand Up @@ -109,8 +109,8 @@ batcher.start() // Resume processing
Unlike the synchronous batcher which returns void, the async version allows you to capture and use the return value from your batch function:

```ts
const batcher = new AsyncBatcher<string>(
async (items) => {
const batcher = new AsyncBatcher(
async (items: string[]) => {
const results = await processBatch(items)
return results
},
Expand All @@ -130,8 +130,8 @@ const batcher = new AsyncBatcher<string>(
The async batcher provides comprehensive error handling capabilities:

```ts
const batcher = new AsyncBatcher<number>(
async (items) => {
const batcher = new AsyncBatcher(
async (items: number[]) => {
// This might throw an error
const results = await riskyBatchOperation(items)
return results
Expand Down Expand Up @@ -164,8 +164,8 @@ const batcher = new AsyncBatcher<number>(
The async batcher tracks when batches are actively executing:

```ts
const batcher = new AsyncBatcher<number>(
async (items) => {
const batcher = new AsyncBatcher(
async (items: number[]) => {
console.log('Starting batch execution...')
const results = await longRunningBatchOperation(items)
console.log('Batch execution completed')
Expand Down Expand Up @@ -196,8 +196,8 @@ The `AsyncBatcher` supports these async-specific callbacks:
The async batcher provides flexible error handling through the `throwOnError` option:

```ts
const batcher = new AsyncBatcher<number>(
async (items) => {
const batcher = new AsyncBatcher(
async (items: number[]) => {
// This might throw an error
throw new Error('Batch processing failed')
},
Expand All @@ -222,8 +222,8 @@ const batcher = new AsyncBatcher<number>(
Like the synchronous batcher, the async batcher supports dynamic options:

```ts
const batcher = new AsyncBatcher<number>(
async (items) => {
const batcher = new AsyncBatcher(
async (items: number[]) => {
return await processBatch(items)
},
{
Expand Down Expand Up @@ -360,8 +360,8 @@ The `AsyncBatcherState` includes:
The async batcher tracks items that failed during batch processing:

```ts
const batcher = new AsyncBatcher<number>(
async (items) => {
const batcher = new AsyncBatcher(
async (items: number[]) => {
// This might fail for some items
if (items.some(item => item < 0)) {
throw new Error('Negative numbers not allowed')
Expand Down
Loading