npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2022 – Pkg Stats / Ryan Hefner

graphql-norm-patch

v0.20.1

Published

Declarative patching of normalized GraphQL responses

Downloads

515

Readme

graphql-norm-patch

npm version travis build Coverage Status code style: prettier MIT license

Declarative patching of normalized GraphQL responses

Overview

This package contains functions to do declarative patching of normalized GraphQL responses. I was design to work with graphql-norm but it should also work with any plain JS object that contains a normalized structure of GraphQL responses.

You can declare patches as data and then apply them. One usage is to apply optimistic updates to the cache when doing mutations.

Since the patches are data you can also return patches from the server. So the server could return patches to the client as part of the mutation response, and the client can then apply them to get the needed upates. One benefit of this is that the server now is responsible for knowing what parts of the schema needs updating after a mutation has been executed.

How to install

npm install graphql-norm-patch --save

How to use

The package has the following constructor functions for creating the patches:

export function createEntity<T>(
  id: GraphQLEntityCache.EntityId,
  newValue: T
): CreateEntity;

export function deleteEntity(id: GraphQLEntityCache.EntityId): DeleteEntity;

export function updateField<T>(
  id: string,
  fieldName: Extract<keyof T, string>,
  newValue: GraphQLEntityCache.EntityFieldValue | null
): UpdateField;

export function insertElement<T>(
  id: GraphQLEntityCache.EntityId,
  fieldName: Extract<keyof T, string>,
  index: number,
  newValue: GraphQLEntityCache.EntityFieldValue
): InsertElement;

export function removeElement<T>(
  id: GraphQLEntityCache.EntityId,
  fieldName: Extract<keyof T, string>,
  index: number
): RemoveElement;

export function removeEntityElement<T>(
  id: GraphQLEntityCache.EntityId,
  fieldName: Extract<keyof T, string>,
  entityId: GraphQLEntityCache.EntityId
): RemoveEntityElement;

It also has a function to apply the patches to a normalized map and returns the new normalized map:

export function apply(patches: ReadonlyArray<Patch>, cache: NormMap): NormMap;

Here is a small example:

import { createEntity, apply } from "graphql-norm-patch";

const cache = {};
const patch = createEntity("myid", { id: "myid", name: "foo" });
const patchedCache = apply(testCase.patches, cache);

console.log(JSON.stringify(cache));
/* { myid: { id: "myid", name: "foo" } } */

How patches are applied to the cache

A patch always specifies an ID for an entity in the cache. If the specified ID does not exist in cache, applying the patch will silently do nothing. The exception to this rule is the CreateEntity patch which will create the entity in the cache.

Applying patches that specify a field name will only have effect if that field name already exits in the cache. If the field name does not exist on the specified entity in the cache, then applying the patch will silently do nothing. If a field exists but have value null and a InsertElement patch is applied to that field, a new array will automatically be created when applying the patch.

Type safety

This package has built-in typescript types, and when using typescript some type saftey can be achieved by using types generated for the GraphQL schema. Types for the schema can be genereted using for example graphql-code-generator and then be used as this:

import { updateField } from "graphql-norm-patch";

const patch = updateField<GraphQLSchemaTypes.Foo>("myid", "myfield", "myvalue");

Future work

It would be interesting to investigate returning patches as an extension of the graphql response.

How to develop

To execute the tests run yarn test.

How to publish

yarn version --patch
yarn version --minor
yarn version --major