Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(docs): remove remaining instances of getFirebase from docs - #635 #694

Merged
merged 1 commit into from
Apr 29, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion SUMMARY.md
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,6 @@
* [dataReducer](/docs/api/reducers.md#datareducer)
* [orderedReducer](/docs/api/reducers.md#orderedreducer)
* [props.firebase](/docs/api/props-firebase.md)
* [getFirebase](/docs/api/get-firebase.md)
* [firebaseInstance](/docs/api/firebaseInstance.md)
* [helpers](/docs/api/helpers.md)
* Migration Guides
Expand Down
1 change: 0 additions & 1 deletion docs/FAQ.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@
* `react-native` support ([web/js](http://react-redux-firebase.com/docs/recipes/react-native.html) or native modules through [`react-native-firebase`](http://docs.react-redux-firebase.com/history/v2.0.0/docs/recipes/react-native.html#native-modules))
* tons of [integrations](#integrations)
* [`profileFactory`](http://react-redux-firebase.com/docs/config) - change format of profile stored on Firebase
* [`getFirebase`](http://react-redux-firebase.com/docs/thunks) - access to firebase instance that fires actions when methods are called
* [access to firebase's `storage`](http://react-redux-firebase.com/docs/storage) and `messaging` services
* `uniqueSet` method helper for only setting if location doesn't already exist
* Object or String notation for paths (`[{ path: '/todos' }]` equivalent to `['/todos']`)
Expand Down
1 change: 0 additions & 1 deletion docs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,6 @@
* [dataReducer](/docs/api/reducers.md#datareducer)
* [orderedReducer](/docs/api/reducers.md#orderedreducer)
* [props.firebase](/docs/api/props-firebase.md)
* [getFirebase](/docs/api/get-firebase.md)
* [firebaseInstance](/docs/api/firebaseInstance.md)
* [helpers](/docs/api/helpers.md)
* [FAQ](/docs/FAQ.md)
Expand Down
1 change: 0 additions & 1 deletion docs/api/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@ Just like [redux](http://redux.js.org/docs/api/index.html), the react-redux-fire
* [withFirestore](/docs/api/withFirestore.md)
* [reducer](/docs/api/reducer.md) (also exported as `firebaseReducer`)
* [reactReduxFirebase](/docs/api/enhancer.md)
* [getFirebase](/docs/api/get-firebase.md)
* [constants](/docs/api/constants.md)
* [actionTypes](/docs/api/constants.md)
* [helpers](/docs/api/helpers.md)
Expand Down
12 changes: 12 additions & 0 deletions docs/api/firebaseInstance.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@
- [unWatchEvent](#unwatchevent)
- [promiseEvents](#promiseevents)
- [login](#login)
- [handleRedirectResult](#handleredirectresult)
- [logout](#logout)
- [createUser](#createuser)
- [resetPassword](#resetpassword)
Expand Down Expand Up @@ -331,6 +332,17 @@ Logs user into Firebase. For examples, visit the

Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)** Containing user's auth data

## handleRedirectResult

Logs user into Firebase using external. For examples, visit the
[auth section](/docs/recipes/auth.md)

**Parameters**

- `authData` **[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Auth data from Firebase's getRedirectResult

Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)** Containing user's profile

## logout

Logs user out of Firebase and empties firebase state from
Expand Down
42 changes: 0 additions & 42 deletions docs/api/get-firebase.md

This file was deleted.

2 changes: 1 addition & 1 deletion docs/auth.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ const enhance = connect(
enhance(SomeComponent)
```

If you need access to methods that are not available at the top level, you can access Firebase's Full Auth API using `props.firebase.auth()` or `getFirebase().auth()`.
If you need access to methods that are not available at the top level, you can access Firebase's Full Auth API using `props.firebase.auth()`

#### NOTE
All examples below assume you have passed `firebase` from `context` to props. Wrapping your component with with the `withFirebase` or `firebaseConnect` Higher Order Components will make `props.firebase` available within your component:
Expand Down
27 changes: 2 additions & 25 deletions docs/integrations/react-chrome-redux.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,13 +27,13 @@ const store = new Store({
// Do not call firebaseConnect here
export default connect(null, { login })(LoginForm);
```
Then, create your alias in the background script, import `react-redux-firebase` as well as `redux-thunk` to wait for Firebase's reply before updating the state (see reply in [ issue #84 on react-chrome-redux](https://github.com/tshaddix/react-chrome-redux/issues/84)).
Then, create your alias in the background script, import `react-redux-firebase` as well as `redux-thunk` to wait for Firebase's reply before updating the state (see reply in [issue #84 on react-chrome-redux](https://github.com/tshaddix/react-chrome-redux/issues/84)).

```js
// in event (background script)
// ...
import thunk from 'redux-thunk'
import { reactReduxFirebase, getFirebase } from 'react-redux-firebase'
import { reactReduxFirebase } from 'react-redux-firebase'
// ...
// Add redux Firebase to compose
const createStoreWithFirebase = compose(
Expand All @@ -49,27 +49,4 @@ const store = createStoreWithFirebase(
wrapStore(store, {
portName: 'example'
});
// ...
const aliases = {
USER_LOGGING_IN: (payload) => {
return (dispatch) => {
getFirebase().login({
email: payload.data.email,
password: payload.data.password
})
.then(() => {
dispatch({
type: constants.USER_LOGGED_IN,
payload: "ok"
})
})
.catch(() => {
dispatch({
type: constants.USER_LOGGED_OUT,
payload: "logout"
})
})
}
}
};
```
2 changes: 1 addition & 1 deletion docs/integrations/react-native.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ Passing in an instance also allows for libraries with similar APIs (such as [`re
```js
import { compose, createStore } from 'redux';
import RNFirebase from 'react-native-firebase';
import { getFirebase, reactReduxFirebase } from 'react-redux-firebase';
import { reactReduxFirebase } from 'react-redux-firebase';
import thunk from 'redux-thunk';
import makeRootReducer from './reducers';

Expand Down
29 changes: 15 additions & 14 deletions docs/integrations/redux-form.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,8 @@ Examples below assume that you have setup `redux-observable` middleware so that
Debounce writing of info that is typed to a ref on Firebase (useful for syncing changes typed into redux-form inputs).

```javascript
import firebase from 'firebase/app'
import 'firebase/database'
import { actionTypes } from 'redux-form';
import { Observable } from 'rxjs';
import 'rxjs/add/operator/switchMap';
Expand All @@ -22,10 +24,10 @@ const blur = action$ => action$.ofType(actionTypes.BLUR);
// Combine form input streams
const formInput = actionStreams$ => Observable.merge(...actionStreams$);

const firebaseSet$ = (getFirebase, path, payload) =>
Observable.fromPromise(getFirebase().ref(path).set(payload));
const firebaseSet$ = (path, payload) =>
Observable.fromPromise(firebase.database().ref(path).set(payload));

export const reduxFormFieldChangeEpic = (action$, { getState, dispatch }, getFirebase) =>
export const reduxFormFieldChangeEpic = (action$, { getState, dispatch }) =>
// create a stream of formInput actions, listen to change and blur events
formInput([change(action$), blur(action$)])
.do(({ meta }) => { // create a side-effect for dispatching action before update
Expand All @@ -39,7 +41,7 @@ export const reduxFormFieldChangeEpic = (action$, { getState, dispatch }, getFir
const path = 'some/path'

// make call to update firebase
return firebaseSet$(getFirebase, path, payload)
return firebaseSet$(path, payload)
// map each promise to an action that indicates the update complete
.mapTo(({
type: 'FORM_FIELD_UPDATED',
Expand All @@ -53,6 +55,8 @@ export const reduxFormFieldChangeEpic = (action$, { getState, dispatch }, getFir
Writing of info that is changed in a redux-form array to firebase.

```js
import firebase from 'firebase/app'
import 'firebase/database'
import { actionTypes } from 'redux-form';
import { get } from 'lodash';
import { Observable } from 'rxjs';
Expand All @@ -65,12 +69,13 @@ const arrayPush = action$ => action$.ofType(actionTypes.ARRAY_PUSH);
// Combine form array action streams
const formArrayAction = actionStream$ => Observable.merge(...actionStream$);

const firebaseSet$ = (getFirebase, path, payload) =>
Observable.fromPromise(getFirebase().ref(path).set(payload));
export function firebaseSet$(path, payload) {
return Observable.fromPromise(firebase.database().ref(path).set(payload));
}

export const reduxFormArrayEpic = (action$, { getState }, getFirebase) =>
export function reduxFormArrayEpic(action$, { getState }) {
// create a stream of formArray actions, listen to add and remove events
formArrayAction([arrayRemove(action$), arrayPush(action$)])
return formArrayAction([arrayRemove(action$), arrayPush(action$)])
// map arrayActions to an Observable which is merged in the output Observable of promises
.mergeMap((action) => {
const { form } = getState();
Expand All @@ -79,16 +84,12 @@ export const reduxFormArrayEpic = (action$, { getState }, getFirebase) =>
const path = 'some/path'

// make call to update firebase
return firebaseSet$(getFirebase, path, payload)
return firebaseSet$(path, payload)
// the action indicating the action was completed
.mapTo(({
type: 'FORM_ARRAY_CHANGE',
payload: meta,
}));
});

export default {
reduxFormFieldChangeEpic,
reduxFormArrayEpic,
};
}
```
17 changes: 9 additions & 8 deletions docs/integrations/redux-observable.md
Original file line number Diff line number Diff line change
@@ -1,21 +1,22 @@
# redux-observable
If you are using `redux-observable`, make sure to set up your redux-observable middleware so that firebase is available within your epics. Here is an example `combineEpics` function that adds `getFirebase` as third argument along with an epic that uses it:
If you are using `redux-observable`, make sure to set up your redux-observable middleware so that firebase is available within your epics. Here is an example `combineEpics` function:

## Setup
Examples below assume that you have setup `redux-observable` middleware so that firebase is available within your epics. Here is an example `combineEpics` function that adds `getFirebase` as the third argument along with an epic that uses it:
Examples below assume that you have setup `redux-observable` middleware so that firebase is available within your epics.

```javascript
import { getFirebase } from 'react-redux-firebase'
import firebase from 'firebase/app'
import 'firebase/database'
import { combineEpics } from 'redux-observable'

const rootEpic = (...args) =>
combineEpics(somethingEpic, epic2)(...args, getFirebase)
combineEpics(somethingEpic, epic2)(...args)

// then later in your epics
const somethingEpic = (action$, store, getFirebase) =>
const somethingEpic = (action$, store) =>
action$.ofType(SOMETHING)
.map(() =>
getFirebase().push('somePath/onFirebase', { some: 'data' })
firebase.database().ref('somePath/onFirebase').push({ some: 'data' })
)
```

Expand All @@ -31,12 +32,12 @@ Debounce is writing to a ref on Firebase such as `/notifications` (useful so tha
```js
const SEND_NOTIFICATION = 'SEND_NOTIFICATION';

export const notificationEpic = (action$, { getState, dispatch }, { getFirebase }) =>
export const notificationEpic = (action$, { getState, dispatch }) =>
action$.ofType(SEND_NOTIFICATION) // stream of notification actions
.debounceTime(2000) // debounce SEND_NOTIFICATION actions by 2 seconds
.do((action) => {
// push the notification object to the notifications ref
return getFirebase().push('/notifications', action.payload)
return firebase.database().ref('notifications').push(action.payload)
})
.mapTo({ type: 'EMAIL_NOTIFICATION_CREATED' });
```
13 changes: 6 additions & 7 deletions docs/integrations/redux-saga.md
Original file line number Diff line number Diff line change
@@ -1,16 +1,15 @@
# Redux Saga Recipes

In order to use `react-redux-firebase` instance within sagas, pass it as the second argument of the run function `sagaMiddleware.run(helloSaga, getFirebase)`.

### Example

```javascript
import { applyMiddleware, compose, createStore } from 'redux'
import { browserHistory } from 'react-router'
import { reactReduxFirebase, getFirebase } from 'react-redux-firebase'
import { reactReduxFirebase } from 'react-redux-firebase'
import makeRootReducer from './reducers'
import createSagaMiddleware from 'redux-saga'
import firebase from 'firebase/app';
import 'firebase/database';

const firebaseConfig = {} // firebase configuration including databaseURL
const reduxFirebase = {
Expand All @@ -20,9 +19,9 @@ const reduxFirebase = {

firebase.initializeApp(firebaseConfig);

function* helloSaga(getFirebase) {
function* helloSaga() {
try {
yield getFirebase().push('/some/path', { nice: 'work!' })
yield firebase.ref('/some/path').push({ nice: 'work!' })
} catch(err) {
console.log('Error in saga!:', err)
}
Expand All @@ -46,6 +45,6 @@ export default (initialState = {}, history) => {
return store
}

// when calling saga, pass getFirebase
sagaMiddleware.run(helloSaga, getFirebase)
// when calling saga
sagaMiddleware.run(helloSaga)
```
16 changes: 6 additions & 10 deletions docs/integrations/thunks.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ In order to get the most out of writing your thunks, make sure to set up your th
```javascript
import { applyMiddleware, compose, createStore } from 'redux';
import thunk from 'redux-thunk';
import { reactReduxFirebase, getFirebase } from 'react-redux-firebase';
import { reactReduxFirebase } from 'react-redux-firebase';
import makeRootReducer from './reducers';

const fbConfig = {} // your firebase config
Expand All @@ -16,9 +16,7 @@ const store = createStore(
makeRootReducer(),
initialState,
compose(
applyMiddleware(
thunk.withExtraArgument(getFirebase) // Pass getFirebase function as extra argument
),
applyMiddleware(thunk),
reactReduxFirebase(fbConfig, { userProfile: 'users', enableLogging: false })
)
);
Expand All @@ -27,19 +25,17 @@ const store = createStore(

## Example Thunk

After following the setup above, `getFirebase` function becomes available within your thunks as the third argument:

```javascript
const sendNotification = (payload) => ({
type: NOTIFICATION,
payload
})

export const addTodo = (newTodo) =>
(dispatch, getState, getFirebase) => {
const firebase = getFirebase()
firebase
.push('todos', newTodo)
(dispatch, getState) => {
return firebase
.ref('todos')
.push(newTodo)
.then(() => {
dispatch(sendNotification('Todo Added'))
})
Expand Down
4 changes: 2 additions & 2 deletions docs/recipes/auth.md
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,7 @@ export default compose(
```js
import firebase from 'firebase'
import { compose, createStore, applyMiddleware } from 'redux'
import { getFirebase, reactReduxFirebase } from 'react-redux-firebase'
import { reactReduxFirebase } from 'react-redux-firebase'

// Firebase config
const fbConfig = {
Expand All @@ -146,7 +146,7 @@ const createStore = (initialState = {}) => {
initialState,
compose(
reactReduxFirebase(firebase, rrfConfig),
applyMiddleware(thunk.withExtraArgument(getFirebase))
applyMiddleware(thunk)
)
)

Expand Down
2 changes: 1 addition & 1 deletion docs/recipes/ssr.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ Preloading data is a common step to in serverside rendering. How it is done diff
After creating your store:

```js
store.firebase // getFirebase can also be used
store.firebase
.promiseEvents([
{ path: 'todos' },
{ path: 'users' }
Expand Down
Loading