Updated Examples. String templating.

prescottprue · prescottprue · commit 985dc5c77914 · 2016-10-18T01:17:21.000-07:00
*  String templating used where possible to simplify query actions
* Updated examples to using react-redux-firebase over redux-firebasev3.
diff --git a/examples/decorators/package.json b/examples/decorators/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "redux-firebasev3-decorators-example",
+  "name": "react-redux-firebase-decorators-example",
   "version": "0.0.1",
   "private": true,
   "devDependencies": {
@@ -52,7 +52,7 @@
     "react-router": "^2.7.0",
     "react-router-redux": "^4.0.5",
     "redux": "^3.4.0",
-    "redux-firebasev3": "*"
+    "react-redux-firebase": "*"
   },
   "scripts": {
     "start": "node ./scripts/start.js",
diff --git a/examples/decorators/src/App.js b/examples/decorators/src/App.js
@@ -6,7 +6,7 @@ import TodoItem from './TodoItem'
 
 // redux/firebase
 import { connect } from 'react-redux'
-import { firebase, helpers } from 'redux-firebasev3'
+import { firebase, helpers } from 'react-redux-firebase'
 const { isLoaded, isEmpty, pathToJS, dataToJS } = helpers
 
 @firebase([
@@ -48,15 +48,15 @@ export default class App extends Component {
     return (
       <div className="App">
         <div className="App-header">
-          <h2>redux-firebasev3 demo</h2>
+          <h2>react-redux-firebase demo</h2>
           <img src={logo} className="App-logo" alt="logo" />
         </div>
         <div className="App-todos">
           <h4>
             Loaded From
             <span className="App-Url">
-              <a href="https://redux-firebasev3.firebaseio.com/">
-                redux-firebasev3.firebaseio.com
+              <a href="https://react-redux-firebase.firebaseio.com/">
+                react-redux-firebase.firebaseio.com
               </a>
             </span>
           </h4>
diff --git a/examples/decorators/src/TodoItem.js b/examples/decorators/src/TodoItem.js
@@ -1,5 +1,5 @@
 import React, { PropTypes, Component } from 'react'
-import { firebase } from 'redux-firebasev3'
+import { firebase } from 'react-redux-firebase'
 
 import './Todo.css'
 
diff --git a/examples/decorators/src/config.js b/examples/decorators/src/config.js
@@ -1,7 +1,7 @@
 export const firebase = {
   apiKey: 'AIzaSyCTUERDM-Pchn_UDTsfhVPiwM4TtNIxots',
-  authDomain: 'redux-firebasev3.firebaseapp.com',
-  databaseURL: 'https://redux-firebasev3.firebaseio.com'
+  authDomain: 'react-redux-firebase.firebaseapp.com',
+  databaseURL: 'https://react-redux-firebase.firebaseio.com'
 }
 
 export default { firebase }
diff --git a/examples/decorators/src/reducer.js b/examples/decorators/src/reducer.js
@@ -1,5 +1,5 @@
 import { combineReducers } from 'redux'
-import { firebaseStateReducer as firebase } from 'redux-firebasev3'
+import { firebaseStateReducer as firebase } from 'react-redux-firebase'
 
 const rootReducer = combineReducers({
   firebase
diff --git a/examples/decorators/src/store.js b/examples/decorators/src/store.js
@@ -1,7 +1,7 @@
 import { createStore, compose } from 'redux'
 import rootReducer from './reducer'
 import { firebase as fbConfig } from './config'
-import { reduxReactFirebase } from 'redux-firebasev3'
+import { reduxReactFirebase } from 'react-redux-firebase'
 // import { reduxFirebase } from 'redux-firebase' // >= v0.1.1
 
 export default function configureStore (initialState, history) {
diff --git a/examples/material/README.md b/examples/material/README.md
@@ -2,7 +2,7 @@
 
 ## Local Development
 
-1. Clone repo: `git@github.com:prescottprue/redux-firebasev3.git`
+1. Clone repo: `git@github.com:prescottprue/react-redux-firebase.git`
 2. Install dependencies: `npm install`
 3. Run dev server `npm start`
 
diff --git a/examples/material/index.html b/examples/material/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>redux-firebasev3-example</title>
+    <title>react-redux-firebase-example</title>
   </head>
   <body>
     <div id="root"></div>
diff --git a/examples/material/package.json b/examples/material/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "redux-firebasev3-material-example",
+  "name": "react-redux-firebase-material-example",
   "version": "0.0.1",
   "private": true,
   "devDependencies": {
@@ -58,7 +58,7 @@
     "react-router-redux": "3.0.0",
     "react-tap-event-plugin": "^1.0.0",
     "redux": "3.4.0",
-    "redux-firebasev3": "*"
+    "react-redux-firebase": "*"
   },
   "scripts": {
     "start": "node ./scripts/start.js",
diff --git a/examples/material/src/config.js b/examples/material/src/config.js
@@ -1,7 +1,7 @@
 export const firebase = {
   apiKey: 'AIzaSyCTUERDM-Pchn_UDTsfhVPiwM4TtNIxots',
-  authDomain: 'redux-firebasev3.firebaseapp.com',
-  databaseURL: 'https://redux-firebasev3.firebaseio.com'
+  authDomain: 'react-redux-firebase.firebaseapp.com',
+  databaseURL: 'https://react-redux-firebase.firebaseio.com'
 }
 
 export const fbPaths = {
diff --git a/examples/material/src/containers/Account/Account.js b/examples/material/src/containers/Account/Account.js
@@ -9,8 +9,8 @@ const textFieldStyle = { width: '60%' }
 const buttonStyle = { 'marginTop': '2rem', width: '20%' }
 const defaultUserImageUrl = 'https://s3.amazonaws.com/kyper-cdn/img/User.png'
 
-// redux-firebasev3
-import { firebase, helpers } from 'redux-firebasev3'
+// react-redux-firebase
+import { firebase, helpers } from 'react-redux-firebase'
 const { dataToJS, pathToJS } = helpers
 
 @firebase()
diff --git a/examples/material/src/containers/Home/Home.js b/examples/material/src/containers/Home/Home.js
@@ -10,7 +10,7 @@ import { List } from 'material-ui/List'
 import Paper from 'material-ui/Paper'
 import Subheader from 'material-ui/Subheader'
 
-import { firebase, helpers } from 'redux-firebasev3'
+import { firebase, helpers } from 'react-redux-firebase'
 const { isLoaded, pathToJS, dataToJS } = helpers
 
 @firebase([
@@ -73,8 +73,8 @@ export default class Home extends Component {
         <div className='Home-Info'>
           from
           <span className='Home-Url'>
-            <a href='https://redux-firebasev3.firebaseio.com/'>
-              redux-firebasev3.firebaseio.com
+            <a href='https://react-redux-firebase.firebaseio.com/'>
+              react-redux-firebase.firebaseio.com
             </a>
           </span>
         </div>
diff --git a/examples/material/src/containers/Login/Login.js b/examples/material/src/containers/Login/Login.js
@@ -13,7 +13,7 @@ import './Login.css'
 
 // redux/firebase
 import { connect } from 'react-redux'
-import { firebase, helpers } from 'redux-firebasev3'
+import { firebase, helpers } from 'react-redux-firebase'
 const { pathToJS } = helpers
 
 @firebase()
diff --git a/examples/material/src/containers/Navbar/Navbar.js b/examples/material/src/containers/Navbar/Navbar.js
@@ -15,7 +15,7 @@ const avatarSize = 50
 
 // redux/firebase
 import { connect } from 'react-redux'
-import { firebase, helpers } from 'redux-firebasev3'
+import { firebase, helpers } from 'react-redux-firebase'
 const { pathToJS } = helpers
 
 @firebase()
@@ -82,7 +82,7 @@ export default class Navbar extends Component {
       <AppBar
         title={
           <Link to='/' style={buttonStyle}>
-            redux-firebasev3
+            react-redux-firebase
           </Link>
         }
         className='Navbar'
diff --git a/examples/material/src/containers/Signup/Signup.js b/examples/material/src/containers/Signup/Signup.js
@@ -13,8 +13,8 @@ import RaisedButton from 'material-ui/RaisedButton'
 // Styles
 import './Signup.css'
 
-// redux-firebasev3
-import { firebase, helpers } from 'redux-firebasev3'
+// react-redux-firebase
+import { firebase, helpers } from 'react-redux-firebase'
 const { pathToJS } = helpers
 
 @firebase()
diff --git a/examples/material/src/reducers.js b/examples/material/src/reducers.js
@@ -1,6 +1,6 @@
 import { combineReducers } from 'redux'
 import { routeReducer as router } from 'react-router-redux'
-import { firebaseStateReducer as firebase } from 'redux-firebasev3'
+import { firebaseStateReducer as firebase } from 'react-redux-firebase'
 
 const rootReducer = combineReducers({
   firebase,
diff --git a/examples/material/src/store/configureStore.dev.js b/examples/material/src/store/configureStore.dev.js
@@ -2,7 +2,7 @@ import { createStore, applyMiddleware, compose } from 'redux'
 import rootReducer from '../reducers'
 import { firebase as fbConfig } from '../config'
 import { syncHistory } from 'react-router-redux'
-import { reduxFirebase } from 'redux-firebasev3' // >= v0.1.1
+import { reduxFirebase } from 'react-redux-firebase' // >= v0.1.1
 
 export default function configureStore (initialState, history) {
   const reduxRouterMiddleware = syncHistory(history)
diff --git a/examples/material/src/store/configureStore.prod.js b/examples/material/src/store/configureStore.prod.js
@@ -1,7 +1,7 @@
 import { createStore, compose } from 'redux'
 import rootReducer from '../reducers'
 import { firebase as fbConfig } from '../config'
-import { reduxReactFirebase } from 'redux-firebasev3' // >= v0.1.0
+import { reduxReactFirebase } from 'react-redux-firebase' // >= v0.1.0
 // import { reduxFirebase } from 'redux-firebase' // >= v0.1.1
 
 export default function configureStore (initialState, history) {
diff --git a/examples/simple/package.json b/examples/simple/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "redux-firebasev3-simple-example",
+  "name": "react-redux-firebase-simple-example",
   "version": "0.1.0",
   "private": true,
   "devDependencies": {
@@ -10,7 +10,7 @@
     "react-dom": "^15.3.1",
     "react-redux": "^4.4.5",
     "redux": "^3.6.0",
-    "redux-firebasev3": "*"
+    "react-redux-firebase": "*"
   },
   "scripts": {
     "start": "react-scripts start",
diff --git a/examples/simple/src/App.js b/examples/simple/src/App.js
@@ -5,7 +5,7 @@ import TodoItem from './TodoItem'
 
 // redux/firebase
 import { connect } from 'react-redux'
-import { firebase, helpers } from 'redux-firebasev3'
+import { firebase, helpers } from 'react-redux-firebase'
 const { isLoaded, isEmpty, pathToJS, dataToJS } = helpers
 
 class App extends Component {
@@ -34,15 +34,15 @@ class App extends Component {
     return (
       <div className='App'>
         <div className='App-header'>
-          <h2>redux-firebasev3 demo</h2>
+          <h2>react-redux-firebase demo</h2>
           <img src={logo} className='App-logo' alt='logo' />
         </div>
         <div className='App-todos'>
           <h4>
             Loaded From
             <span className='App-Url'>
-              <a href='https://redux-firebasev3.firebaseio.com/'>
-                redux-firebasev3.firebaseio.com
+              <a href='https://react-redux-firebase.firebaseio.com/'>
+                react-redux-firebase.firebaseio.com
               </a>
             </span>
           </h4>
diff --git a/examples/simple/src/TodoItem.js b/examples/simple/src/TodoItem.js
@@ -1,5 +1,5 @@
 import React, { PropTypes, Component } from 'react'
-import { firebase } from 'redux-firebasev3'
+import { firebase } from 'react-redux-firebase'
 
 import './Todo.css'
 
diff --git a/examples/simple/src/config.js b/examples/simple/src/config.js
@@ -1,7 +1,7 @@
 export const firebase = {
   apiKey: 'AIzaSyCTUERDM-Pchn_UDTsfhVPiwM4TtNIxots',
-  authDomain: 'redux-firebasev3.firebaseapp.com',
-  databaseURL: 'https://redux-firebasev3.firebaseio.com'
+  authDomain: 'react-redux-firebase.firebaseapp.com',
+  databaseURL: 'https://react-redux-firebase.firebaseio.com'
 }
 
 export default { firebase }
diff --git a/examples/simple/src/reducer.js b/examples/simple/src/reducer.js
@@ -1,5 +1,5 @@
 import { combineReducers } from 'redux'
-import { firebaseStateReducer as firebase } from 'redux-firebasev3'
+import { firebaseStateReducer as firebase } from 'react-redux-firebase'
 
 const rootReducer = combineReducers({
   firebase
diff --git a/examples/simple/src/store.js b/examples/simple/src/store.js
@@ -1,7 +1,7 @@
 import { createStore, compose } from 'redux'
 import rootReducer from './reducer'
 import { firebase as fbConfig } from './config'
-import { reduxFirebase } from 'redux-firebase'
+import { reduxFirebase } from 'react-redux-firebase'
 
 export default function configureStore (initialState, history) {
   const createStoreWithMiddleware = compose(
diff --git a/src/actions/query.js b/src/actions/query.js
@@ -6,7 +6,7 @@ import {
 import { map, filter, isString, isObject } from 'lodash'
 
 const getWatchPath = (event, path) =>
-  event + ':' + ((path.substring(0, 1) === '/') ? '' : '/') + path
+  `${event}:${((path.substring(0, 1) === '/') ? '' : '/')}${path}`
 
 /**
  * @description Set a new watcher
@@ -16,7 +16,7 @@ const getWatchPath = (event, path) =>
  * @param {String} queryId - Id of query
  */
 const setWatcher = (firebase, event, path, queryId = undefined) => {
-  const id = (queryId) ? event + ':/' + queryId : getWatchPath(event, path)
+  const id = queryId ? `${event}:/${queryId}` : getWatchPath(event, path)
 
   if (firebase._.watchers[id]) {
     firebase._.watchers[id]++
@@ -35,7 +35,7 @@ const setWatcher = (firebase, event, path, queryId = undefined) => {
  * @param {String} queryId - Id of query
  */
 const getWatcherCount = (firebase, event, path, queryId = undefined) => {
-  const id = (queryId) ? event + ':/' + queryId : getWatchPath(event, path)
+  const id = queryId ? `${event}:/${queryId}` : getWatchPath(event, path)
   return firebase._.watchers[id]
 }
 
@@ -108,7 +108,7 @@ export const watchEvent = (firebase, dispatch, event, path, dest, onlyLastEvent
     queryParams = pathSplitted[1].split('&')
   }
 
-  const watchPath = (!dest) ? path : `${path}@${dest}`
+  const watchPath = !dest ? path : `${path}@${dest}`
   const counter = getWatcherCount(firebase, event, watchPath, queryId)
 
   if (counter > 0) {
@@ -208,7 +208,7 @@ export const watchEvent = (firebase, dispatch, event, path, dest, onlyLastEvent
     // Handle all other queries
     q.on(e, snapshot => {
       let data = (e === 'child_removed') ? undefined : snapshot.val()
-      const resultPath = dest || (e === 'value') ? p : p + '/' + snapshot.key
+      const resultPath = dest || (e === 'value') ? p : `${p}/${snapshot.key}`
 
       if (dest && e !== 'child_removed') {
         data = {
@@ -314,14 +314,18 @@ export const unWatchEvent = (firebase, event, path, queryId = undefined) =>
  * @param {Array} events - List of events for which to add watchers
  */
 export const watchEvents = (firebase, dispatch, events) =>
-    events.forEach(event => watchEvent(firebase, dispatch, event.name, event.path))
+    events.forEach(event =>
+      watchEvent(firebase, dispatch, event.name, event.path)
+    )
 
 /**
  * @description Remove watchers from a list of events
  * @param {Object} firebase - Internal firebase object
  * @param {Array} events - List of events for which to remove watchers
  */
 export const unWatchEvents = (firebase, events) =>
-    events.forEach(event => unWatchEvent(firebase, event.name, event.path))
+    events.forEach(event =>
+      unWatchEvent(firebase, event.name, event.path)
+    )
 
 export default { watchEvents, unWatchEvents }

Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`export const firebase = {`
`2`	`2`	`apiKey: 'AIzaSyCTUERDM-Pchn_UDTsfhVPiwM4TtNIxots',`
`3`		`- authDomain: 'redux-firebasev3.firebaseapp.com',`
`4`		`- databaseURL: 'https://redux-firebasev3.firebaseio.com'`
	`3`	`+ authDomain: 'react-redux-firebase.firebaseapp.com',`
	`4`	`+ databaseURL: 'https://react-redux-firebase.firebaseio.com'`
`5`	`5`	`}`
`6`	`6`
`7`	`7`	`export default { firebase }`
-Original file line number
+Diff line change
 ## Local Development
 -1. Clone repo: `[email protected]:prescottprue/redux-firebasev3.git`
 +1. Clone repo: `[email protected]:prescottprue/react-redux-firebase.git`
 . Install dependencies: `npm install`
 . Run dev server `npm start`