-
-
Welcome to React
+
+
+
Bag It Up!
-
- To get started, edit src/App.js and save to reload.
-
+
+ { user
+ ?
+
+ }
+
+ :
+ }
+
+
);
}
diff --git a/src/CurrentUser.js b/src/CurrentUser.js
new file mode 100644
index 0000000..fd7afcd
--- /dev/null
+++ b/src/CurrentUser.js
@@ -0,0 +1,24 @@
+import React, { PropTypes } from 'react';
+import { auth } from './firebase';
+
+const CurrentUser = ({ user }) => {
+ return (
+
+ { user.displayName } auth.signOut() }>
+ Sign Out
+
+
+ );
+}
+
+CurrentUser.propTypes = {
+ user: PropTypes.shape({
+ displayName: PropTypes.string,
+ email: PropTypes.string,
+ photoURL: PropTypes.string,
+ uid: PropTypes.string.isRequired
+ })
+}
+
+export default CurrentUser;
\ No newline at end of file
diff --git a/src/Item.js b/src/Item.js
new file mode 100644
index 0000000..38fa550
--- /dev/null
+++ b/src/Item.js
@@ -0,0 +1,16 @@
+import React, { Component, PropTypes } from 'react';
+
+class Item extends Component {
+ constructor(props) {
+ super(props);
+ }
+ render () {
+ return (
+
+ );
+ }
+}
+
+export default Item;
diff --git a/src/NewListItem.js b/src/NewListItem.js
new file mode 100644
index 0000000..50abdc5
--- /dev/null
+++ b/src/NewListItem.js
@@ -0,0 +1,44 @@
+import React, { Component, PropTypes } from 'react';
+import { database } from './firebase';
+
+class NewListItem extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ itemName: this.props.itemName
+ };
+ this.listItemRef = database.ref('/shopping_list').child(this.props.user.uid).child(this.props.appendTo);
+
+ this.handleSubmit = this.handleSubmit.bind(this);
+ }
+
+ handleSubmit(event) {
+ event.preventDefault();
+ if (!this.props.content.includes(this.state.itemName)) {
+ this.listItemRef.push({ itemName: this.state.itemName });
+ }
+ }
+
+ render() {
+ const { itemName } = this.state;
+ return (
+
+ );
+ }
+}
+
+NewListItem.propTypes = {
+ shoppingListRef: PropTypes.object
+};
+
+export default NewListItem;
diff --git a/src/NewShoppingList.js b/src/NewShoppingList.js
new file mode 100644
index 0000000..ee1b163
--- /dev/null
+++ b/src/NewShoppingList.js
@@ -0,0 +1,44 @@
+import React, { Component, PropTypes } from 'react';
+import { database } from './firebase';
+
+class NewShoppingList extends Component {
+ constructor() {
+ super();
+ this.state = {
+ name: ''
+ };
+ this.shoppingListRef = database.ref('/shopping_list');
+ this.handleSubmit = this.handleSubmit.bind(this);
+ }
+
+ handleSubmit(event) {
+ event.preventDefault();
+ this.shoppingListRef.child(this.props.user.uid).push({name: this.state.name });
+ }
+
+ render() {
+ const { name } = this.state;
+ return (
+
+ );
+ }
+}
+
+NewShoppingList.propTypes = {
+ shoppingListRef: PropTypes.object
+};
+
+export default NewShoppingList;
diff --git a/src/ShoppingList.js b/src/ShoppingList.js
new file mode 100644
index 0000000..b4238e5
--- /dev/null
+++ b/src/ShoppingList.js
@@ -0,0 +1,63 @@
+import React, { Component, PropTypes } from 'react';
+import ShowItems from './ShowItems';
+import { database } from './firebase';
+
+class ShoppingList extends Component {
+ constructor(props){
+ super(props);
+ this.state = {
+ childVisible: false,
+ newlyAppendedListItems: [],
+ currentListName: ""
+ }
+ this.clicked = this.clicked.bind(this);
+ }
+ display(storeItemsArray, ref){
+ var itemsToBeAdded = [];
+ ref.on("value", function(snapshot){
+ for(var i=0; i
+ { name }
+ Delete
+ this.clicked(appendTo, name)}> Select
+ {
+ this.state.childVisible ?
+
+ {map(shoppingLists, (shoppingList, key) => (
+
+ this.toggleItems(key,shoppingList.name)}
+ handleDelete={ () => this.handleDelete(key)}
+ {...shoppingList}
+ />
+ ))}
+
+ );
+ }
+}
+
+ShoppingLists.propTypes = {
+ user: PropTypes.object,
+ shoppingListsRef: PropTypes.object.isRequired,
+ shoppingLists: PropTypes.object,
+ itemsListedRef:PropTypes.object
+};
+
+export default ShoppingLists;
diff --git a/src/ShowHide.js b/src/ShowHide.js
new file mode 100644
index 0000000..ea705ce
--- /dev/null
+++ b/src/ShowHide.js
@@ -0,0 +1,28 @@
+import React, { Component, PropTypes } from 'react';
+
+class ShowHide extends Component {
+ getInitialState(){
+ return {
+ childVisible: false
+ }
+ }
+ onClick() {
+ this.setState({childVisible: !this.state.childVisible});
+ }
+ render () {
+ return (
+
+
+ Parent - click me to show/hide my child
+
+ {
+ this.state.childVisible
+ ?
+ : null
+ }
+
+
+
+ {
+ map(itemsArray, item =>(
+ {item}
+ ))
+ }
+
+
+ auth.signInWithRedirect(githubAuthProvider)}>
+ Sign In with Github
+
+ auth.signInAnonymously() }>
+ Sign In as a guest
+
+ auth.signInWithRedirect(googleAuthProvider)}>
+ Sign In with Google
+
+
+ )
+ }
+}
+
+export default SignIn;
\ No newline at end of file
diff --git a/src/firebase.js b/src/firebase.js
new file mode 100644
index 0000000..feccdb9
--- /dev/null
+++ b/src/firebase.js
@@ -0,0 +1,19 @@
+import firebase from 'firebase';
+
+const config = {
+ apiKey: "AIzaSyAJDuGvzzynalAwH23Lxh8F9tYBZnFjXu0",
+ authDomain: "bag-it-up-49697.firebaseapp.com",
+ databaseURL: "https://bag-it-up-49697.firebaseio.com",
+ projectId: "bag-it-up-49697",
+ storageBucket: "",
+ messagingSenderId: "484536466087"
+};
+firebase.initializeApp(config);
+
+export default firebase;
+
+export const database = firebase.database();
+export const auth = firebase.auth();
+export const googleAuthProvider = new firebase.auth.GoogleAuthProvider();
+export const githubAuthProvider = new firebase.auth.GithubAuthProvider();
+
diff --git a/src/registerServiceWorker.js b/src/registerServiceWorker.js
index 4a3ccf0..e15f436 100644
--- a/src/registerServiceWorker.js
+++ b/src/registerServiceWorker.js
@@ -1,18 +1,6 @@
-// In production, we register a service worker to serve assets from local cache.
-
-// This lets the app load faster on subsequent visits in production, and gives
-// it offline capabilities. However, it also means that developers (and users)
-// will only see deployed updates on the "N+1" visit to a page, since previously
-// cached resources are updated in the background.
-
-// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
-// This link also includes instructions on opting out of this behavior.
-
const isLocalhost = Boolean(
window.location.hostname === 'localhost' ||
- // [::1] is the IPv6 localhost address.
window.location.hostname === '[::1]' ||
- // 127.0.0.1/8 is considered localhost for IPv4.
window.location.hostname.match(
/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
)
@@ -20,12 +8,8 @@ const isLocalhost = Boolean(
export default function register() {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
- // The URL constructor is available in all browsers that support SW.
const publicUrl = new URL(process.env.PUBLIC_URL, window.location);
if (publicUrl.origin !== window.location.origin) {
- // Our service worker won't work if PUBLIC_URL is on a different origin
- // from what our page is served on. This might happen if a CDN is used to
- // serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374
return;
}
@@ -33,10 +17,8 @@ export default function register() {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
if (!isLocalhost) {
- // Is not local host. Just register service worker
registerValidSW(swUrl);
} else {
- // This is running on localhost. Lets check if a service worker still exists or not.
checkValidServiceWorker(swUrl);
}
});
@@ -52,15 +34,8 @@ function registerValidSW(swUrl) {
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
- // At this point, the old content will have been purged and
- // the fresh content will have been added to the cache.
- // It's the perfect time to display a "New content is
- // available; please refresh." message in your web app.
console.log('New content is available; please refresh.');
} else {
- // At this point, everything has been precached.
- // It's the perfect time to display a
- // "Content is cached for offline use." message.
console.log('Content is cached for offline use.');
}
}
@@ -73,22 +48,18 @@ function registerValidSW(swUrl) {
}
function checkValidServiceWorker(swUrl) {
- // Check if the service worker can be found. If it can't reload the page.
fetch(swUrl)
.then(response => {
- // Ensure service worker exists, and that we really are getting a JS file.
if (
response.status === 404 ||
response.headers.get('content-type').indexOf('javascript') === -1
) {
- // No service worker found. Probably a different app. Reload the page.
navigator.serviceWorker.ready.then(registration => {
registration.unregister().then(() => {
window.location.reload();
});
});
- } else {
- // Service worker found. Proceed as normal.
+ } else {
registerValidSW(swUrl);
}
})