szaranger/firebase-saga

A library for connecting redux-saga middleware to Firebase.

firebase-saga's Issues

Firebase sync?

Does Firebase sync work?

VM46116:1 Uncaught ReferenceError: firebaseRef is not defined

Thanks for putting this together. Working on a large project using mxstbr/react-boilerplate as a starter and just decided to move to Firebase.

I used the sample code in a saga.

import { take, takeEvery, call, fork, cancel, put } from 'redux-saga/effects';
import { LOCATION_CHANGE } from 'react-router-redux';
import { GET_DOCUMENTS } from './constants';
import { getDocumentsSuccess, getDocumentsError } from './actions';
import * as firebaseRef from 'firebase-saga';

export function* getDocuments() {
  debugger;
  const documents = yield call(firebaseRef.get, 'documents');

  if (!documents.err) {
    yield put(getDocumentsSuccess(documents.data.results));
  } else {
    yield put(getDocumentsError(documents.err));
  }
}

export function* setWatcher() {
  while (yield take(GET_DOCUMENTS)) {
    yield call(getDocuments);
  }
}

export function* dashboardSaga() {
  const watcher = yield fork(setWatcher);
  yield take(LOCATION_CHANGE);
  yield cancel(watcher);
}

export default [
  dashboardSaga,
];

The saga errors out and says that firebaseRef has not been defined.

Here's a screenshot

Sync Child_added & Child_removed with depth causes issue in reducer

yield fork(sync, path, {
    [CHILD_ADDED]: actions.syncNotificationAdded,
    [CHILD_REMOVED]: actions.syncNotificationDeleted,
  }, 1);

If I delete a notification or try to add one it calls both seemingly in a random order which causes problems. If I remove the depth specifier it works 100% as expected.

'push' method return value.

Currently push method only returns error.
I don't know if anyone else need the key after creating data.
Would it be a good idea to return key if there is no error?

export function* push(path, fn) {
    const key = yield call(newKey, path);
    const payload = yield call(fn, key);
    const opts = newOpts('error');
    const ref = firebase.database().ref(path);
    const [ _, { error } ] = yield [
        call([ref, ref.push], payload, opts.handler),
        take(opts)
    ];
    if (error === undefined) {
      return key;
    }
    return error;
}

thank you.

Dependabot can't parse your package.json

Dependabot couldn't parse the package.json found at /package.json.

You can mention @dependabot in the comments below to contact the Dependabot team.

Firebase saga push creates a initial key then pushes to firebase with a different key

The firebase saga push method, returns a key, however, it returns a key different to the one created on Firebase. I

ORIGINAL

export function* push(path, fn, getKey) {
  const key = yield call(newKey, path);
  const payload = yield call(fn, key);
  const opts = newOpts('error', 'key');
  const ref = firebase.database().ref(path);
  const [_, { error }] = yield [call([ref, ref.push], payload, opts.handler), take(opts)];
  console.log(_, 'METHOD');
  console.log(error, 'ERROR');
  // console.log(key, 'KEY');
  if (getKey && error == undefined) {
    return key;
  }

  return error;
}

ReferenceError: firebase is not defined at getAll

Hi,

I know this is a dupe but I found the previous ticket answer not sufficient so I'm checking again here:

There is no documentation on how your library gets ahold of the firebase reference it uses (e.g. in src/index.js) without loading any context or module.

Is it absolutely necessary to make firebase globally available?

Minor issue in Blog example

Hi, there appears to be a minor issue in the Blog example that threw me when I was playing with it:

This does not look correct:

export const POST_CREATED = 'POST_RECEIVED';

here:

https://github.com/szaranger/firebase-saga/blob/master/examples/blog/src/actions/index.js#L11

(otherwise, thanks a lot, it has helped me a lot :)

can we import firebase conditionally?

I am using this lib in a Chrome extension, where I've so far been unable to figure out how to make firebase globally available (i.e., there's no index.html <script> method)

Is it possible to build this library such that it will run import firebase from 'firebase' if it can't find the firebase object?

I know it's not as simple as an if/then, but I suspect there has to be a reasonable way short of forking the project.

regeneratorRuntime is not defined

Hi,
i want use firebase-saga with next-js but i have this error on startup:

ReferenceError: regeneratorRuntime is not defined
at Object.defineProperty.value (../node_modules/firebase-saga/dist/ReactProxy.js:78:79)

Using the create function

Thanks for this, a real life saver.

I'd like use Firebases push method, I took a look at your create method but couldn't make much sense on how to use it. Could you give an example?

Cheers!

`create` requires 'path' 2x?

using the create saga & wondering about the source code here (which is also the same source code for push?):

/**
 * Saves new data to the database with `set()`
 *
 * @param path
 * @param fn
 * @example
 * import { create } from 'firebase-saga';
 *
 * yield call(create, 'posts', () => ({
 *              [`posts/1234`]: {
 *                   title: 'My Second Post',
 *                   body: 'Second post details',
 *                   timestamp: +new Date
 *               }
 *           })
 *);
 */
export function* create(path, fn) {
    const key = yield call(newKey, path);
    const payload = yield call(fn, key);
    const opts = newOpts('error');
    const ref = firebase.database().ref();
    const [_, { error }] = yield [
        call([ref, ref.update], payload, opts.handler),
        take(opts)
    ];
    return error;
}

Why does the API require declaring 'posts' as the 2nd arg, and 'posts' in the prop name of the anon set function?

events in sync

two questions on this code:

function* runSync(ref, eventType, actionCreator) {
    const opts = newOpts();
    yield call([ref, ref.on], eventType, opts.handler);

    while (true) {
        const { data } = yield take(opts);
        yield put(actionCreator({ key: data.key, value: data.val() }));
    }
}

/**
 * Gets fired every time a child added, remove, changed, or moved
 *
 * @param path
 * @param mapEventToAction
 * @param limit
 * @example
 * import { sync, CHILD_ADDED, CHILD_REMOVED } from 'firebase-saga';
 *
 *function* syncPosts() {
 *   yield fork(sync, 'posts', {
 *       [CHILD_ADDED]: actions.syncPostAdded,
 *       [CHILD_REMOVED]: actions.syncPostRemoved
 *   });
 *}
 */
export function* sync(path, mapEventToAction = {}, limit = 20) {
    const ref = firebase.database().ref(path).limitToLast(limit);

    for (let type of EVENT_TYPES) {
        const action = mapEventToAction[type];

        if (typeof action === 'function') {
            yield fork(runSync, ref, type, action);
        }
    }
}

1. why the default value on limit? i would assume the default use case would be no limit. would this be more general?

export function* sync(path, mapEventToAction = {}, limit = 20) {
    const ref = typeof limit === 'number' ? 
           firebase.database().ref(path).limitToLast(limit)
           : firebase.database().ref(path)
// ...

1. the readme says sync covers all events, but const EVENT_TYPES = ['child_added', 'child_removed'];

is that a bug or is it meant to only cover add/remove?

i can submit prs for this stuff, just let me know !

ReferenceError: firebase is not defined

I'm getting this error

ReferenceError: firebase is not defined
   at sync$ (webpack:///./~/firebase-saga/dist/ReactProxy.js?:446:18)
   ...

It is referring to the sync method. I don't see any import of the firebase tool in the code with the functions.

These are my installed versions:

• "firebase": "^3.3.2",
• "firebase-saga": "^1.1.0",

Are there any special requirements to use firebase-saga?

Support for orderBy*, limitTo* and other firebase filters

Currently queries to firebase cannot be filtered with firebase-saga.
It would be nice to have a way to access the query interface https://firebase.google.com/docs/reference/js/firebase.database.Query

[...effects] has been deprecated in favor of all([...effects])

Hi,
i have this sagas:

import { call, put, takeLatest, takeEvery, select } from 'redux-saga/effects';
import { getAll, remove } from 'firebase-saga';
import {
  POSITIONS_GET_REQUEST,
  POSITION_DEL_REQUEST,
} from '../actions/actionTypes';
import * as actions from '../actions/positions';
import { getUid } from '../selectors';

function* getPositions() {
  try {
    const userId = yield select(getUid);
    const response = yield call(getAll, `positions/${userId}`);

    yield put(actions.getPositionsReceived(response || {}));
  } catch (error) {
    yield put(actions.getPositionsFailed(error));
  }
}

function* removePosition(action) {
  try {
    const userId = yield select(getUid);

    yield call(remove, `positions/${userId}`, action.id);
    yield put(actions.removePositionSuccess(action.id));
  } catch (error) {
    yield put(actions.removePositionFailed(error));
  }
}

export default function* myPositions() {
  yield takeLatest(POSITIONS_GET_REQUEST, getPositions);
  yield takeEvery(POSITION_DEL_REQUEST, removePosition);
}

It works but i receive an error when dispatch the action POSITION_DEL_REQUEST:
[...effects] has been deprecated in favor of all([...effects])

FETCH_POSTS not in actions in example

I'm trying to get your blog demo working, but fetch posts is never called. I noticed the FETCH_POSTS is not in the reducer and I'm wondering if that is the issue?