4 posts tagged with "REST"

New Features:

• Parallel data loading with useFetch() - Fetch multiple endpoints concurrently with use(useFetch()), avoiding sequential waterfalls
• Collection.move - Move entities between Collections with a single operation
• Collection.moveWith() - Customize move behavior (e.g., prepend instead of append)
• Lazy - Deferred relationship denormalization for performance and memoization isolation

Other Improvements:

• Direct schema imports - Import schema classes directly without the schema namespace
• Denormalization depth limit - Prevent stack overflow in large bidirectional entity graphs; configurable via Entity.maxEntityDepth (#3822)
• DevToolsManager exposes globalThis.__DC_CONTROLLERS__ in dev mode for programmatic store access from Chrome DevTools MCP and Expo MCP. Use the data-client-react skill to enable AI-assisted debugging.
• Remove misleading 'Uncaught Suspense' warning during Next.js SSR
• Fix sideEffect: false type being lost with method: 'POST' in RestEndpoint
• renderDataHook() automatic cleanup after each test — no manual cleanup() calls needed
• renderDataHook() returns per-render cleanup() and allSettled() for reliable test teardown

Collection.move makes it easy to move entities between Collections with a single operation:

import { useController } from '@data-client/react';
import { TaskResource, type Task } from './TaskResource';

export default function TaskCard({ task }: { task: Task }) {
  const handleMove = () => ctrl.fetch(
    TaskResource.getList.move,
    { id: task.id },
    { id: task.id, status: task.status === 'backlog' ? 'in-progress' : 'backlog' },
  );
  const ctrl = useController();
  return (
    <div className="listItem">
      <span style={{ flex: 1 }}>{task.title}</span>
      <button onClick={handleMove}>
        {task.status === 'backlog' ? '\u25bc' : '\u25b2'}
      </button>
    </div>
  );
}

Breaking Changes:

• path-to-regexp v8 - RestEndpoint.path syntax updated: /:optional? → {/:optional}, /:repeat+ → /*repeat (typed as string[])
• useFetch() returns UsablePromise - Returns a thenable for React.use(); check .resolved instead of truthiness

Upgrade with an automated codemod for all breaking changes:

npx jscodeshift -t https://dataclient.io/codemods/v0.16.js --extensions=ts,tsx,js,jsx src/

This release focuses on consistency and extensibility. Null handling is now uniform across all schema types, making data transformations more predictable. New URL utilities enable custom URL construction and search parameter encoding.

class MyEndpoint<O extends RestGenerics = any> extends RestEndpoint<O> {
  searchToString(searchParams) {
    // Use qs library for complex nested object encoding
    return qs.stringify(searchParams);
  }
}

Breaking Changes:

• Null values retained in Array/Object schemas

Other Improvements:

• RestEndpoint.searchToString() for custom search param encoding
• getUrlBase, getUrlTokens exports for custom URL construction
• DevToolsManager memory leak fix

This release focuses on developer experience with a devtools button that appears in development mode, better DevTools history, and new controller methods like controller.expireAll() and controller.fetchIfStale().

Resource.extend() provides three powerful ways to customize resources - adding new endpoints, overriding existing ones, or deriving from base endpoints.

const UserResource = createResource({
  path: '/users/:id',
  schema: User,
}).extend('current', {
  path: '/users/current',
});

Breaking Changes:

• Remove all /next exports
• makeCacheProvider removed
• DELETE -> INVALIDATE action type
• Legacy schema support dropped
• Schema Serializers must support function calls
• Action types prefixed with 'rdc'

Collections enable Arrays and Objects to be easily extended by pushing or unshifting new members. The namesake comes from Backbone Collections.

Collections are now the default schema for Resource.getList.

import { useController } from '@data-client/react';
import { TodoResource } from './TodoResource';

export default function CreateTodo({ userId }: { userId: number }) {
  const ctrl = useController();
  const handleKeyDown = async e => {
    if (e.key === 'Enter') {
      ctrl.fetch(TodoResource.getList.push, {
        userId,
        title: e.currentTarget.value,
        id: Math.random(),
      });
      e.currentTarget.value = '';
    }
  };
  return (
    <div className="listItem nogap">
      <label>
        <input type="checkbox" name="new" checked={false} disabled />
        <input type="text" onKeyDown={handleKeyDown} />
      </label>
    </div>
  );
}

Upgrading is quite simple, as @data-client/rest/next and @data-client/react/next were introduced to allow incremental adoption of the new APIs changed in this release. This makes the actual upgrade a simple import rename.

Other highlights include

• @data-client/rest
  • async RestEndpoint.getHeaders
• @data-client/react
  • Controller.fetch() return value is denormalized from schema
  • Manager action type updates

For all details, keep reading: