@vincit/rematch-pubnub

Rematch-PubNub

PubNub-Redux SDK plugin for Rematch.

The PubNub Redux SDK offers a data management framework that listens to realtime events generated by the PubNub network to update the view inside your application. And of course, your data can coexist with PubNub-defined data.

Install

npm install @vincit/rematch-pubnub

yarn add @vincit/rematch-pubnub

Setup

import createRematchPubnub from '@vincit/rematch-pubnub'

const pubnubPlugin = createRematchPubnub({
  publishKey: 'publishKey',
  subscribeKey: 'subscribeKey',
  uuid: 'uuid',
})

init({
  plugins: [pubnubPlugin],
})

PubNubProvider

The PubNubProvider makes available a PubNub client instance to a React component tree.

import { getPubnubInstance } from '@vincit/rematch-pubnub'
import { PubNubProvider } from 'pubnub-react'

const pubnub = getPubnubInstance()

const Root = () => (
  <PubNubProvider client={pubnub}>
    <App />
  </PubNubProvider>
)

TypeScript Support

import { PubnubState } from '@vincit/rematch-pubnub'

export type iRootState = RematchRootState<typeof models> & PubnubState

Manually setting the Pubnub client instance

store.ts

import createRematchPubnub from '@vincit/rematch-pubnub'

const pubnubPlugin = createRematchPubnub()

init({
  plugins: [pubnubPlugin],
})

app.tsx

import { setPubnubInstance } from '@vincit/rematch-pubnub'
import { PubNubProvider } from 'pubnub-react'

const App = () => {
  const pubnub = new Pubnub({
    publishKey: 'publishKey',
    subscribeKey: 'subscribeKey',
    uuid: 'uuid',
  })

  setPubnubInstance(pubnub)

  return (
    <PubNubProvider client={pubnub}>
      <App />
    </PubNubProvider>
  )
}

Usage

See pubnub-redux docs