Skip to content

Commit

Permalink
v3.0.0-alpha.4 (#597)
Browse files Browse the repository at this point in the history
* fix(typings): add context providers to typings - #564
* fix(storage): support only firestore when calling upload and writing to db - @dirathea
* fix(core): add auth initialization to providers to match v2 store enhancer - #388
  • Loading branch information
prescottprue committed Jan 2, 2019
1 parent 71dee92 commit 5224326
Show file tree
Hide file tree
Showing 13 changed files with 155 additions and 78 deletions.
4 changes: 3 additions & 1 deletion .babelrc
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
{
"presets": [
["minify", { "keepFnName": true }],
["minify", {
"mangle": false
}],
"@babel/preset-react",
["@babel/env", {
"targets": {
Expand Down
5 changes: 5 additions & 0 deletions docs/api/firebaseInstance.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@
- [reloadAuth](#reloadauth)
- [linkWithCredential](#linkwithcredential)
- [signInWithPhoneNumber](#signinwithphonenumber)
- [initializeAuth](#initializeauth)
- [ref](#ref)
- [database](#database)
- [storage](#storage)
Expand Down Expand Up @@ -456,6 +457,10 @@ authenticates and does profile handling.

Returns **[Promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)**

## initializeAuth

Initialize auth to work with build in profile support

## ref

Firebase ref function
Expand Down
12 changes: 5 additions & 7 deletions docs/api/firestoreConnect.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ needing to access a firebase instance created under a different store key.
_Basic_

```javascript
// this.props.firebase set on App component as firebase object with helpers
// props.firebase set on App component as firebase object with helpers
import { createFirestoreConnect } from 'react-redux-firebase'
// create firebase connect that uses another redux store
const firestoreConnect = createFirestoreConnect('anotherStore')
Expand Down Expand Up @@ -53,7 +53,7 @@ attempting to use. **Note** Populate is not yet supported.
_Basic_

```javascript
// this.props.firebase set on App component as firebase object with helpers
// props.firebase set on App component as firebase object with helpers
import { firestoreConnect } from 'react-redux-firebase'
export default firestoreConnect()(SomeComponent)
```
Expand All @@ -64,13 +64,11 @@ _Basic_
import { connect } from 'react-redux'
import { firestoreConnect } from 'react-redux-firebase'

// pass todos list from redux as this.props.todosList
// pass todos list from redux as props.todosList
export default compose(
firestoreConnect(['todos']), // sync todos collection from Firestore into redux
firestoreConnect(() => ['todos']), // sync todos collection from Firestore into redux
connect((state) => ({
todosList: state.firestore.data.todos,
profile: state.firestore.profile, // pass profile data as this.props.profile
auth: state.firestore.auth // pass auth data as this.props.auth
todosList: state.firestore.data.todos
})
)(SomeComponent)
```
Expand Down
40 changes: 24 additions & 16 deletions docs/api/withFirebase.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ needing to access a firebase instance created under a different store key.
_Basic_

```javascript
// this.props.firebase set on App component as firebase object with helpers
// props.firebase set on App component as firebase object with helpers
import { createWithFirebase } from 'react-redux-firebase'

// create withFirebase that uses another redux store
Expand Down Expand Up @@ -55,12 +55,15 @@ _Basic_
```javascript
import { withFirebase } from 'react-redux-firebase'

const AddData = ({ firebase: { push } }) =>
<div>
<button onClick={() => push('todos', { done: false, text: 'Sample' })}>
Add Sample Todo
</button>
</div>
function AddData({ firebase: { push } }) {
return (
<div>
<button onClick={() => push('todos', { done: false, text: 'Sample' })}>
Add Sample Todo
</button>
</div>
)
}

export default withFirebase(AddData)
```
Expand All @@ -72,15 +75,18 @@ import { compose } from 'redux' // can also come from recompose
import { withHandlers } from 'recompose'
import { withFirebase } from 'react-redux-firebase'

const AddTodo = ({ addTodo }) =>
<div>
<button onClick={addTodo}>
Add Sample Todo
</button>
</div>

export default compose(
withFirebase(AddTodo),
function AddTodo({ addTodo }) {
return (
<div>
<button onClick={addTodo}>
Add Sample Todo
</button>
</div>
)
}

const enhance = compose(
withFirebase,
withHandlers({
addTodo: props => () =>
props.firestore.add(
Expand All @@ -89,6 +95,8 @@ export default compose(
)
})
)

export default enhance(AddTodo)
```

Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Which accepts a component to wrap and returns the
Expand Down
51 changes: 30 additions & 21 deletions docs/api/withFirestore.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ needing to access a firebase instance created under a different store key.
**Parameters**

- `storeKey` **[String](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Name of redux store which contains
Firebase state (`state.firebase`) (optional, default `'store'`)
Firestore state (`state.firestore`) (optional, default `'store'`)

**Examples**

Expand Down Expand Up @@ -50,42 +50,51 @@ from `store.firestore`, which is attached to store by the store enhancer
_Basic_

```javascript
import React from 'react'
import { withFirestore } from 'react-redux-firebase'

const AddTodo = ({ firestore: { add } }) =>
<div>
<button onClick={() => add('todos', { done: false, text: 'Sample' })}>
Add Sample Todo
</button>
</div>
function AddData({ firebase: { add } }) {
return (
<div>
<button onClick={() => add('todos', { done: false, text: 'Sample' })}>
Add Sample Todo
</button>
</div>
)
}

export default withFirestore(AddTodo)
```

_Within HOC Composition_

```javascript
import React from 'react'
import { compose } from 'redux' // can also come from recompose
import { withHandlers } from 'recompose'
import { withFirestore } from 'react-redux-firebase'

const AddTodo = ({ addTodo }) =>
<div>
<button onClick={addTodo}>
Add Sample Todo
</button>
</div>

export default compose(
withFirestore(AddTodo),
function AddTodo({ addTodo }) {
return (
<div>
<button onClick={addTodo}>
Add Sample Todo
</button>
</div>
)
}

const enhance = compose(
withFirestore,
withHandlers({
addTodo: props => () =>
props.firestore.add(
{ collection: 'todos' },
{ done: false, text: 'Sample' }
)
addTodo: props => () => {
const newTodo = { done: false, text: 'Sample' }
return props.firestore.add({ collection: 'todos' }, newTodo)
}
})
)

export default enhance(AddTodo)
```

Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Which accepts a component to wrap and returns the
Expand Down
44 changes: 29 additions & 15 deletions index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -180,32 +180,50 @@ export function populate(
notSetValue?: any
): any

export function reactReduxFirebase(instance: object, otherConfig: any): any
/**
* React Context provider for Firebase instance (with methods wrapped in dispatch). Needed to use HOCs
* like firebaseConnect and withFirebase.
*/
export function ReactReduxFirebaseProvider(props: ReactReduxFirebaseProviderProps): any;

/**
* Props passed to ReactReduFirebaseContext component
*/
export interface ReactReduxFirebaseContextProps {
firebase: object,
config: object,
dispatch: (action) => void
createFirestoreInstance?: (firebase: object, config: object, dispatch: (action) => void) => object
export interface ReactReduxFirebaseProviderProps<T> {
value: T;
firebase: object;
config: object;
dispatch: (action: object) => void;
children?: React.ReactNode;
initalizeAuth?: boolean;
createFirestoreInstance?: (firebase: object, config: object, dispatch: (action: object) => void) => object;
}

/**
* React Context provider for Firebase instance. Needed to use HOCs like firebaseConnect and withFirebase
* React Context for Firebase instance.
*/
export namespace ReactReduxFirebaseContext {
export namespace ReduxFirestoreContext {
const prototype: {}
}

/**
* React Context provider for Firebase instance. Needed to use HOCs like firebaseConnect and withFirebase
* Props passed to ReactReduFirebaseContext component
*/
export namespace ReduxFirestoreContext {
const prototype: {}
export interface ReduxFirestoreProviderProps {
firebase: object;
config: object;
dispatch: (action: object) => void;
createFirestoreInstance: (firebase: object, config: object, dispatch: (action: object) => void) => object;
children?: React.ReactNode;
initalizeAuth?: boolean;
}

/**
* React Context provider for Firestore instance (with methods wrapped in dispatch). Needed to use HOCs
* like firestoreConnect and withFirestore.
*/
export function ReduxFirestoreProvider(props: ReduxFirestoreProviderProps): any;

/**
* React Higher Order Component that passes firebase as a prop (comes from context.store.firebase)
*/
Expand Down Expand Up @@ -267,10 +285,6 @@ export namespace fixPath {
const prototype: {}
}

export namespace getFirebase {
const prototype: {}
}

export namespace getVal {
const prototype: {}
}
Expand Down
6 changes: 3 additions & 3 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "react-redux-firebase",
"version": "3.0.0-alpha.3",
"version": "3.0.0-alpha.4",
"description": "Redux integration for Firebase. Comes with a Higher Order Components for use with React.",
"main": "lib/index.js",
"module": "es/index.js",
Expand Down
14 changes: 13 additions & 1 deletion src/ReactReduxFirebaseProvider.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,17 +10,24 @@ function ReactReduxFirebaseProvider(props = {}) {
config,
dispatch,
firebase,
initializeAuth,
createFirestoreInstance
} = props
const extendedFirebaseInstance = createFirebaseInstance(
firebase,
config,
dispatch
)
// Initialize auth if not disabled
if (initializeAuth) {
extendedFirebaseInstance.initializeAuth()
}
if (createFirestoreInstance) {
return (
<ReactReduxFirebaseContext.Provider value={extendedFirebaseInstance}>
<ReduxFirestoreProvider {...props}>{children}</ReduxFirestoreProvider>
<ReduxFirestoreProvider {...props} initializeAuth={false}>
{children}
</ReduxFirestoreProvider>
</ReactReduxFirebaseContext.Provider>
)
}
Expand All @@ -31,11 +38,16 @@ function ReactReduxFirebaseProvider(props = {}) {
)
}

ReactReduxFirebaseProvider.defaultProps = {
initalizeAuth: true
}

ReactReduxFirebaseProvider.propTypes = {
children: PropTypes.node,
config: PropTypes.object.isRequired,
dispatch: PropTypes.func.isRequired,
firebase: PropTypes.object.isRequired,
initializeAuth: PropTypes.bool,
createFirestoreInstance: PropTypes.func
}

Expand Down

0 comments on commit 5224326

Please sign in to comment.