Seperated fireform and firekit-provider in seperate projects

TarikHuber · Sep 28, 2017 · 1aa31a5 · 1aa31a5
1 parent a4bdc75
commit 1aa31a5
Show file tree

Hide file tree

Showing 20 changed files with 52 additions and 182 deletions.
diff --git a/README.md b/README.md
@@ -59,7 +59,7 @@ When we have the `firebaseApp` we just add it as paramater to our Provider.
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
-import { FirebaseProvider } from 'firekit'; // Import the FirebaseProvider from firekit
+import { FirebaseProvider } from 'firekit-provider'; // Import the FirebaseProvider from firekit
 import configureStore from './store';
 import { Root } from './containers/Root';
 import { addLocalizationData } from './locales';
@@ -157,7 +157,7 @@ Let us take a look on a simple component.
 import React, { Component }  from 'react';
 import {injectIntl, intlShape} from 'react-intl';
 import { Activity } from '../../containers/Activity';
-import { withFirebase } from 'firekit';
+import { withFirebase } from 'firekit-provider';
 
 class MyComponent extends Component {
 
@@ -201,7 +201,7 @@ The `FirebaseProvider` provides the `firebaseApp` trought the rect context and `
 import React, { Component }  from 'react';
 import {injectIntl, intlShape} from 'react-intl';
 import { Activity } from '../../containers/Activity';
-import { withFirebase } from 'firekit';
+import { withFirebase } from 'firekit-provider';
 
 class MyComponent extends Component {
 
@@ -239,7 +239,7 @@ Firebase has integrated a listener to observe the connection state to your fireb
 ```js
 import React, { Component }  from 'react';
 import { connect } from 'react-redux';
-import { withFirebase } from 'firekit';
+import { withFirebase } from 'firekit-provider';
 
 class MyComponent extends Component {
 
@@ -285,7 +285,7 @@ We can easely observe lists in the realtime database using the `watchList` and `
 ```js
 import React, { Component }  from 'react';
 import { connect } from 'react-redux';
-import { withFirebase } from 'firekit';
+import { withFirebase } from 'firekit-provider';
 import _ from 'lodash';
 
 class MyComponent extends Component {
@@ -413,6 +413,7 @@ And comes the cool thing. If you are in the Form working on fields and someone e
 //...
 
     <FireForm
+      firebaseApp={firebaseApp}
       name={'companie'}
       path={`${path}`}
       onSubmitSuccess={(values)=>{history.push('/companies');}}
@@ -447,6 +448,7 @@ Firebase offers a simple API for managing push notification messages. Firekit pr
 - [X] integrate firebase auth watcher
 - [X] integrate firebase queries watcher
 - [X] implement alias names (custom destination locations) for path and list watchers
+- [X] seperate firekit-provider and fireform in seperate projects
 - [ ] integrate selectors for lists
 - [ ] integrate error hanling
 - [ ] integrate loading indicators in redux state

diff --git a/src/components/FirebaseProvider.js → demo/firekit-provider/FirebaseProvider.js b/src/components/FirebaseProvider.js → demo/firekit-provider/FirebaseProvider.js
diff --git a/src/withFirebase.js → demo/firekit-provider/withFirebase.js b/src/withFirebase.js → demo/firekit-provider/withFirebase.js
@@ -1,11 +1,11 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { clearInitialization } from './store/initialization/actions'
-import { initConnection, unsubscribeConnection } from './store/connection/actions'
-import { watchAuth, authStateChanged, authError} from './store/auth/actions'
-import { watchList, unwatchList, destroyList, unwatchAllLists } from './store/lists/actions'
-import { watchPath, unwatchPath, destroyPath, unwatchAllPaths } from './store/paths/actions'
-import { initMessaging, clearMessage } from './store/messaging/actions'
+import { clearInitialization } from '../../src/store/initialization/actions'
+import { initConnection, unsubscribeConnection } from '../../src/store/connection/actions'
+import { watchAuth, authStateChanged, authError} from '../../src/store/auth/actions'
+import { watchList, unwatchList, destroyList, unwatchAllLists } from '../../src/store/lists/actions'
+import { watchPath, unwatchPath, destroyPath, unwatchAllPaths } from '../../src/store/paths/actions'
+import { initMessaging, clearMessage } from '../../src/store/messaging/actions'
 
 const withFirebase = (Component) => {
   const ChildComponent = (props, context) => {

diff --git a/demo/src/components/Drawer/DrawerContent.js b/demo/src/components/Drawer/DrawerContent.js
@@ -8,7 +8,7 @@ import allLocales from '../../locales';
 import firebase from 'firebase';
 import { injectIntl } from 'react-intl';
 import { withRouter } from 'react-router-dom';
-import { withFirebase } from '../../../../src';
+import withFirebase from '../../../firekit-provider/withFirebase';
 
 const DrawerContent = (props, context) => {
 

diff --git a/demo/src/components/Drawer/DrawerHeader.js b/demo/src/components/Drawer/DrawerHeader.js
@@ -9,7 +9,7 @@ import {RMWIcon} from '../Icons';
 import {injectIntl} from 'react-intl';
 import muiThemeable from 'material-ui/styles/muiThemeable';
 import CircularProgress from 'material-ui/CircularProgress';
-import { withFirebase } from '../../../../src';
+import withFirebase from '../../../firekit-provider/withFirebase';;
 
 const DrawerHeader = ({muiTheme, intl, auth, setAuthMenuOpen, fetchUser, dialogs, setDialogIsOpen, firebaseApp}) => {
   const styles={

diff --git a/demo/src/containers/About/About.js b/demo/src/containers/About/About.js
@@ -1,7 +1,7 @@
 import React, { Component }  from 'react';
 import {injectIntl, intlShape} from 'react-intl';
 import { Activity } from '../../containers/Activity';
-import { withFirebase } from '../../../../src';
+import withFirebase from '../../../firekit-provider/withFirebase';
 
 class About extends Component {
 

diff --git a/demo/src/containers/Companies/Companie.js b/demo/src/containers/Companies/Companie.js
@@ -9,7 +9,8 @@ import firebase from 'firebase';
 import FontIcon from 'material-ui/FontIcon';
 import FlatButton from 'material-ui/FlatButton';
 import Dialog from 'material-ui/Dialog';
-import { withFirebase, FireForm } from '../../../../src';
+import withFirebase from '../../../firekit-provider/withFirebase';
+import FireForm from 'fireform'
 
 const path='/companies/';
 
@@ -56,7 +57,7 @@ class Companie extends Component {
 
   render() {
 
-    const {history, intl, setDialogIsOpen, dialogs, match}=this.props;
+    const {history, intl, setDialogIsOpen, dialogs, match, firebaseApp}=this.props;
 
     const actions = [
       <FlatButton
@@ -86,6 +87,7 @@ class Companie extends Component {
         <div style={{margin: 15, display: 'flex'}}>
 
           <FireForm
+            firebaseApp={firebaseApp}
             name={'companie'}
             path={`${path}`}
             onSubmitSuccess={(values, key)=>{history.push('/companies');}}

diff --git a/demo/src/containers/Companies/Companies.js b/demo/src/containers/Companies/Companies.js
@@ -11,7 +11,7 @@ import FontIcon from 'material-ui/FontIcon';
 import FloatingActionButton from 'material-ui/FloatingActionButton';
 import {withRouter} from 'react-router-dom';
 import Avatar from 'material-ui/Avatar';
-import { withFirebase } from '../../../../src';
+import withFirebase from '../../../firekit-provider/withFirebase';
 
 class Vehicles extends Component {
 

diff --git a/demo/src/containers/MyAccount/Form.js b/demo/src/containers/MyAccount/Form.js
@@ -11,7 +11,7 @@ import { setDialogIsOpen } from '../../store/dialogs/actions';
 import { ImageCropDialog } from '../../containers/ImageCropDialog';
 import IconButton from 'material-ui/IconButton';
 import { withRouter } from 'react-router-dom';
-import { withFirebase } from '../../../../src';
+import withFirebase from '../../../firekit-provider/withFirebase';
 import {GoogleIcon, FacebookIcon, GitHubIcon, TwitterIcon} from '../../components/Icons';
 import muiThemeable from 'material-ui/styles/muiThemeable';
 import config from '../../config';

diff --git a/demo/src/containers/MyAccount/MyAccount.js b/demo/src/containers/MyAccount/MyAccount.js
@@ -10,7 +10,8 @@ import FlatButton from 'material-ui/FlatButton';
 import Dialog from 'material-ui/Dialog';
 import firebase from 'firebase';
 import {formValueSelector } from 'redux-form';
-import { withFirebase, FireForm } from '../../../../src';
+import withFirebase from '../../../firekit-provider/withFirebase';
+import FireForm from 'fireform'
 
 const path='/users/';
 
@@ -248,7 +249,7 @@ class MyAccount extends Component {
 
     render() {
 
-      const {history, intl, setDialogIsOpen, dialogs, match, auth}=this.props;
+      const {history, intl, setDialogIsOpen, dialogs, match, auth, firebaseApp}=this.props;
 
       const actions = [
         <FlatButton
@@ -277,6 +278,7 @@ class MyAccount extends Component {
           {auth.uid &&
             <div style={{margin: 15, display: 'flex'}}>
               <FireForm
+                firebaseApp={firebaseApp}
                 validate={this.validate}
                 name={'my_account'}
                 path={`${path}`}

diff --git a/demo/src/containers/Root/Root.js b/demo/src/containers/Root/Root.js
@@ -8,7 +8,7 @@ import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
 import { IntlProvider } from 'react-intl'
 import { Routes } from '../../components/Routes';
 import firebase from 'firebase';
-import { withFirebase } from '../../../../src';
+import withFirebase from '../../../firekit-provider/withFirebase';
 
 class Root extends Component {
 

diff --git a/demo/src/containers/SignIn/SignIn.js b/demo/src/containers/SignIn/SignIn.js
@@ -8,7 +8,7 @@ import firebaseui from 'firebaseui';
 import {firebaseAuth} from '../../firebase';
 import config from '../../config';
 import { withRouter } from 'react-router-dom';
-import { withFirebase } from '../../../../src';
+import withFirebase from '../../../firekit-provider/withFirebase';
 
 var authUi = new firebaseui.auth.AuthUI(firebaseAuth);
 

diff --git a/demo/src/containers/Tasks/Task.js b/demo/src/containers/Tasks/Task.js
@@ -10,7 +10,8 @@ import firebase from 'firebase';
 import FontIcon from 'material-ui/FontIcon';
 import FlatButton from 'material-ui/FlatButton';
 import Dialog from 'material-ui/Dialog';
-import { withFirebase, FireForm } from '../../../../src';
+import withFirebase from '../../../firekit-provider/withFirebase';
+import FireForm from 'fireform'
 
 const path='/public_tasks/';
 
@@ -57,7 +58,7 @@ class Task extends Component {
 
   render() {
 
-    const {history, intl, dialogs, match, setDialogIsOpen}=this.props;
+    const {history, intl, dialogs, match, setDialogIsOpen, firebaseApp}=this.props;
 
     const actions = [
       <FlatButton
@@ -85,6 +86,7 @@ class Task extends Component {
         title={intl.formatMessage({id: this.props.match.params.uid?'edit_task':'create_task'})}>
         <div style={{margin: 15, display: 'flex'}}>
           <FireForm
+            firebaseApp={firebaseApp}
             name={'task'}
             path={path}
             onSubmitSuccess={(values)=>{history.push('/tasks');}}

diff --git a/demo/src/containers/Tasks/Tasks.js b/demo/src/containers/Tasks/Tasks.js
@@ -19,7 +19,7 @@ import {BottomNavigation} from 'material-ui/BottomNavigation';
 import {withRouter} from 'react-router-dom';
 import FlatButton from 'material-ui/FlatButton';
 import Dialog from 'material-ui/Dialog';
-import { withFirebase } from '../../../../src';
+import withFirebase from '../../../firekit-provider/withFirebase';
 
 class Tasks extends Component {
 

diff --git a/demo/src/containers/Users/Users.js b/demo/src/containers/Users/Users.js
@@ -10,7 +10,7 @@ import Avatar from 'material-ui/Avatar';
 import FontIcon from 'material-ui/FontIcon';
 import {GoogleIcon, FacebookIcon, GitHubIcon, TwitterIcon} from '../../components/Icons';
 import IconButton from 'material-ui/IconButton';
-import { withFirebase } from '../../../../src';
+import withFirebase from '../../../firekit-provider/withFirebase';
 import ReactList from 'react-list';
 
 class Users extends Component {

diff --git a/demo/src/index.js b/demo/src/index.js
@@ -1,7 +1,7 @@
 import React, {Component} from 'react'
 import {render} from 'react-dom'
 import { Provider } from 'react-redux';
-import { FirebaseProvider } from '../../src';
+import FirebaseProvider from '../firekit-provider/FirebaseProvider';
 import configureStore from './store';
 import { Root } from './containers/Root';
 import { addLocalizationData } from './locales';

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "firekit",
-  "version": "0.1.31",
+  "version": "0.2.1",
   "description": "Firebase toolkit for sync with redux",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -20,14 +20,12 @@
     "test:watch": "nwb test-react --server"
   },
   "dependencies": {},
-  "peerDependencies": {
-    "react": "15.x || 16.x",
-    "firebase": "4.x",
-    "redux-form": "7.x"
-  },
+  "peerDependencies": {},
   "devDependencies": {
     "firebase": "^4.4.0",
     "firebaseui": "^2.3.0",
+    "fireform": "^0.2.1",
+    "firekit-provider": "^0.2.0",
     "github-markdown-css": "^2.8.0",
     "immutable": "^3.8.1",
     "intl": "^1.2.5",
@@ -65,9 +63,8 @@
   "license": "MIT",
   "repository": "https://github.com/TarikHuber/firekit",
   "keywords": [
-    "react-component",
     "firebase",
     "redux",
-    "react"
+    "sync"
   ]
 }