JSPM

  • Created
  • Published
  • Downloads 174
  • Score
    100M100P100Q82039F
  • License MIT

Postgraphile client for react-admin

Package Exports

  • ra-postgraphile

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (ra-postgraphile) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

ra-postgraphile

CircleCI npm version semantic-release

Postgraphile client for react-admin

Typescript API: https://bowlingx.github.io/ra-postgraphile/

Install

$ yarn add ra-postgraphile / npm install ra-postgraphile --save

Usage

The ra-postgraphile data provider accepts 2 arguments:

  • client - The ApolloClient instance to use.

  • config - optional configuration

    pgDataProvider(client, [config])

The following examples shows the basic usage:

import React, { useEffect, useState } from 'react'
import { Admin, Resource } from 'react-admin'
import { useApolloClient } from '@apollo/react-hooks'
import pgDataProvider from 'ra-postgraphile'
import { PostList, PostEdit, PostCreate } from './posts'
import { CommentList, CommentEdit, CommentCreate } from './posts'

const App = () => {
  const [dataProvider, setDataProvider] = useState(null)
  const client = useApolloClient()

  useEffect(() => {
    ;(async () => {
      const dataProvider = await pgDataProvider(client)
      setDataProvider(() => dataProvider)
    })()
  }, [])

  return (
    dataProvider && (
      <Admin dataProvider={dataProvider} layout={Layout}>
        <Resource name="Posts" list={PostList} edit={PostEdit} create={PostCreate} />
        <Resource name="Comments" list={CommentList} create={CommentCreate} edit={CommentEdit} />
      </Admin>
    )
  )
}

export default App

Limitations

The project has been tested only with the following plugins enabled on postgraphile: There is limited support for the postgis plugin and not all input/query types are properly mapped.

const PgSimplifyInflectorPlugin = require('@graphile-contrib/pg-simplify-inflector')
const PgConnectionFilterPlugin = require('postgraphile-plugin-connection-filter')

Please see src\__test_utils\QueryRunner.ts for a minimal example setup.

Configuration

You can pass an optional configuration object:

const pgDataProviderConfig = {
  queryValueToInputValueMap: {
    GeographyPoint: (value) => value.geojson,
  },
}
  • queryValueToInputValueMap - allows you to specify a mapping of how a type should map if it's taken as an Input. Please see (src/defaultValueInputTypeMapping) for a default mapping. Your config will be merged with the defaults.

    The Map is also used to specify what complex types should be completely queried. By default only scalar and scalar[] fields are fetched.

Primary Keys

react-admin requires each resource to be identified by a unique id. If your resource does not have an id field, we will use the generated nodeId from your primaryKey.

Contribution

  • Contribution is very welcome :).
  • Please create your commit messages based on semantic-release syntax and semantics (e.g. properly mark Breaking changes etc.). This let's us automatically create release notes and releases to NPM.

Development

We are using yarn for package management.

To run all tests you have to start the dependent postgres container with docker-compose up -d.