Skip to content
This repository was archived by the owner on Mar 23, 2021. It is now read-only.

joshforisha/cycle-fire

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

90 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

cycle-fire

build npm firebase

A Firebase driver for Cycle.js.

Example

import firebaseConfig from './firebaseConfig';
import { button, div, h2, makeDOMDriver } from '@cycle/dom';
import { firebaseActions, makeFirebaseDriver } from 'cycle-fire';
import { run } from '@cycle/run';

function main(sources) {
  const action$ = sources.DOM
    .select('.shuffle')
    .events('click')
    .map(() => Math.ceil(Math.random() * 99))
    .map(firebaseActions.database.ref('test').set);

  const vdom$ = sources.firebase.database
    .ref('test')
    .value.map(value => div([h2(value), button('.shuffle', 'Shuffle')]));

  return {
    DOM: vdom$,
    firebase: action$
  };
}

run(main, {
  DOM: makeDOMDriver('Application'),
  firebase: makeFirebaseDriver(firebaseConfig)
});

API

firebaseActions

Write effects to the connected Firebase database are requested by calling an action generator—a function defined on the firebaseActions object—and passed to the firebase sink.

<action>.as(category: string)

Effectively attaches a category to the action's result stream, allowing for lookup using the source's select().

import { firebaseActions } from 'cycle-fire';
import xs from 'xstream';

function Cycle(sources) {
  const setAction = firebaseActions.database
    .ref('test')
    .set('newValue')
    .as('setTestValue');

  sources.firebase.select('setTestValue').addListener({
    error: err => {
      console.error(err);
    },
    next: response => {
      console.log(response);
    }
  });

  return {
    firebase: xs.of(setAction)
  };
}

makeFirebaseDriver(config, name?)

  • config: object
    • apiKey: string
    • authDomain: string
    • databaseURL: string
    • messagingSenderId: string
    • projectId: string
    • storageBucket: string
  • name?: string

Initializes a connection to a Firebase database by calling firebase.initializeApp(), returning a source object containing the following:

  • auth: object containing:
  • database: object containing:
    • ref(path: string): ReferenceSource containing:
      • child(path: string): ReferenceSource
      • events(eventType: string): MemoryStream of the ref's eventType events, using Reference.on
      • value: MemoryStream – a shortcut stream equivalent to events('value')
    • refFromURL(url: string): ReferenceSource
  • select(category: string): Stream of results from action requests that were categorized using <action>.as().

About

A Firebase driver for Cycle.js

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Contributors 3

  •  
  •  
  •