@rest-hooks/experimental
    TypeScript icon, indicating that this package has built-in type declarations

    3.2.0 • Public • Published

    Experimental extensions for Rest Hooks

    CircleCI Coverage Status npm downloads bundle size npm version PRs Welcome

    Motivation

    Field application of designs help smooth edges of a theoretical design. New designs can be iterated on here, breaking freely without worry of legacy support plans.

    Usage

    useController()

    const controller = useController();
    
    return (
      <form onSubmit={() => controller.fetch(User.create(), userPayload)}>
        <button onClick={() => controller.fetch(User.list())}>Refresh list</button>
        <button onClick={() => controller.invalidate(User.list())}>Suspend list</button>
      </form>
    );

    Endpoint.update

    Simple
    const createUser = new Endpoint(postToUserFunction, {
      schema: User,
      update: (newUserId: string) => ({
        [userList.key({})]: (users = []) => [newUserId, ...users],
      }),
    });
    Multiple updates
    const createUser = new Endpoint(postToUserFunction, {
      schema: User,
      update: (newUserId: string, newUser: User)  => {
        const updates = {
          [userList.key()]: (users = []) => [newUserId, ...users],
          [userList.key({ sortBy: 'createdAt' })]: (users = [], { sortBy }) => {
            const ret = [newUserId, ...users];
            ret.sortBy(sortBy);
            return ret;
          },
        ];
        if (newUser.isAdmin) {
          updates[userList.key({ admin: true })] = (users = []) => [newUserId, ...users];
        }
        return updates;
      },
    });

    Entity, EntityRecord, Resource, BaseResource

    • Normalizes to pojo
    • Faster
    • Entity has no defined key lookups - but EntityRecord does.
    • BaseResource is missing predefined endpoints (list, detail, etc), but has everything else

    Resource.list() declarative pagination

    Addition of paginated().

    class NewsResource extends Resource {
      static listPage<T extends typeof NewsResource>(this: T) {
        return this.list().paginated(({ cursor, ...rest }) => [rest]);
      }
    }
    import { useResource } from 'rest-hooks';
    import NewsResource from 'resources/NewsResource';
    
    function NewsList() {
      const { results, cursor } = useResource(NewsResource.list(), {});
      const curRef = useRef(cursor);
      curRef.current = cursor;
      const fetch = useFetcher();
      const getNextPage = useCallback(
        () => fetch(NewsResource.listPage(), { cursor: curRef.current }),
        []
      );
    
      return (
        <Pagination onPaginate={getNextPage} nextCursor={cursor}>
          <NewsList data={results} />
        </Pagination>
      );
    }

    Install

    npm i @rest-hooks/experimental

    Homepage

    resthooks.io

    DownloadsWeekly Downloads

    2,521

    Version

    3.2.0

    License

    Apache-2.0

    Unpacked Size

    292 kB

    Total Files

    93

    Last publish

    Collaborators

    • ntucker
    • ljharb