From 01b0c4d1400b806c24af4758dd3233d57bf5af4b Mon Sep 17 00:00:00 2001 From: github username Date: Mon, 23 Jul 2018 14:47:57 -0400 Subject: [PATCH] pre-setup for Mike Redux lecture --- src/App.js | 2 +- src/App.test.js | 9 --- src/{ => assets}/App.css | 0 src/{ => assets}/index.css | 0 src/components/Header.js | 3 +- src/components/Login.js | 2 +- src/components/Profile.js | 2 +- src/components/SearchBar.js | 2 +- src/containers/GodContainer.js | 2 +- src/containers/ResultsList.js | 3 +- src/index.js | 86 +++++++++++++----------- src/registerServiceWorker.js | 117 --------------------------------- 12 files changed, 55 insertions(+), 173 deletions(-) delete mode 100644 src/App.test.js rename src/{ => assets}/App.css (100%) rename src/{ => assets}/index.css (100%) delete mode 100644 src/registerServiceWorker.js diff --git a/src/App.js b/src/App.js index 84155b7..2df3aed 100644 --- a/src/App.js +++ b/src/App.js @@ -1,6 +1,6 @@ import React, { Component } from 'react'; import logo from './logo.svg'; -import './App.css'; +import './assets/App.css'; import GodContainer from './containers/GodContainer'; class App extends Component { diff --git a/src/App.test.js b/src/App.test.js deleted file mode 100644 index a754b20..0000000 --- a/src/App.test.js +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react'; -import ReactDOM from 'react-dom'; -import App from './App'; - -it('renders without crashing', () => { - const div = document.createElement('div'); - ReactDOM.render(, div); - ReactDOM.unmountComponentAtNode(div); -}); diff --git a/src/App.css b/src/assets/App.css similarity index 100% rename from src/App.css rename to src/assets/App.css diff --git a/src/index.css b/src/assets/index.css similarity index 100% rename from src/index.css rename to src/assets/index.css diff --git a/src/components/Header.js b/src/components/Header.js index 4ae3229..d285b3f 100644 --- a/src/components/Header.js +++ b/src/components/Header.js @@ -1,6 +1,5 @@ import React from 'react'; -import '../App.css'; - +import '../assets/App.css'; class Header extends React.Component { constructor(){ diff --git a/src/components/Login.js b/src/components/Login.js index b53b282..7d947bd 100644 --- a/src/components/Login.js +++ b/src/components/Login.js @@ -1,6 +1,6 @@ import React from 'react'; import { Button, Checkbox, Form } from 'semantic-ui-react' -import '../App.css'; +import '../assets/App.css'; class Login extends React.Component { constructor(){ diff --git a/src/components/Profile.js b/src/components/Profile.js index 2ef1c1e..7764218 100644 --- a/src/components/Profile.js +++ b/src/components/Profile.js @@ -1,5 +1,5 @@ import React from 'react'; -import '../App.css'; +import '../assets/App.css'; import { Container, Divider } from 'semantic-ui-react' diff --git a/src/components/SearchBar.js b/src/components/SearchBar.js index 75dcc93..0e95b30 100644 --- a/src/components/SearchBar.js +++ b/src/components/SearchBar.js @@ -1,5 +1,5 @@ import React from 'react'; -import '../App.css'; +import '../assets/App.css'; class SearchBar extends React.Component { constructor(){ diff --git a/src/containers/GodContainer.js b/src/containers/GodContainer.js index 857518a..d7af004 100644 --- a/src/containers/GodContainer.js +++ b/src/containers/GodContainer.js @@ -1,7 +1,7 @@ import React from 'react'; import Header from '../components/Header'; import DisplayContainer from '../containers/DisplayContainer'; -import '../App.css'; +import '../assets/App.css'; class GodContainer extends React.Component { constructor(){ diff --git a/src/containers/ResultsList.js b/src/containers/ResultsList.js index a82007d..07c4673 100644 --- a/src/containers/ResultsList.js +++ b/src/containers/ResultsList.js @@ -1,6 +1,5 @@ import React from 'react'; -import '../App.css'; - +import '../assets/App.css'; const ResultsList = (props) => { return( diff --git a/src/index.js b/src/index.js index 8eec0e2..449989b 100644 --- a/src/index.js +++ b/src/index.js @@ -1,48 +1,58 @@ import React from 'react'; import ReactDOM from 'react-dom'; -import './index.css'; +import './assets/index.css'; import App from './App'; -import registerServiceWorker from './registerServiceWorker'; import 'semantic-ui-css/semantic.min.css'; import { combineReducers, createStore } from 'redux'; -function usersReducer(state = [], action){ - return state; -} - -function teamsReducer(state = '', action){ - switch (action.type) { - case 'UPDATE_TEAM': - return action.payload; - } - return state; -} - -const allReducers = combineReducers({ - users: usersReducer, - teams: teamsReducer -}) -const store = createStore( - allReducers, - { - users: [{name: "Ian"}], - teams: "The Best Team" - }, - window.devToolsExtension && window.devToolsExtension() -); - -console.log(store.getState()); - -const updateTeamAction = { - type: 'UPDATE_TEAM', - payload: { - teams: "The Worst Team" - } -}; - -store.dispatch(updateTeamAction) ReactDOM.render(, document.getElementById('root')); -registerServiceWorker(); + + + + + + + + + + + + + + + +///////OLD REDUX SETUP///////// +// +// function usersReducer(state = [], action){ +// return state; +// } +// function teamsReducer(state = '', action){ +// switch (action.type) { +// case 'UPDATE_TEAM': +// return action.payload; +// } +// return state; +// } +// const allReducers = combineReducers({ +// users: usersReducer, +// teams: teamsReducer +// }) +// const store = createStore( +// allReducers, +// { +// users: [{name: "Ian"}], +// teams: "The Best Team" +// }, +// window.devToolsExtension && window.devToolsExtension() +// ); +// console.log(store.getState()); +// const updateTeamAction = { +// type: 'UPDATE_TEAM', +// payload: { +// teams: "The Worst Team" +// } +// }; +// store.dispatch(updateTeamAction) diff --git a/src/registerServiceWorker.js b/src/registerServiceWorker.js deleted file mode 100644 index a3e6c0c..0000000 --- a/src/registerServiceWorker.js +++ /dev/null @@ -1,117 +0,0 @@ -// 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}$/ - ) -); - -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; - } - - window.addEventListener('load', () => { - const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`; - - if (isLocalhost) { - // This is running on localhost. Lets check if a service worker still exists or not. - checkValidServiceWorker(swUrl); - - // Add some additional logging to localhost, pointing developers to the - // service worker/PWA documentation. - navigator.serviceWorker.ready.then(() => { - console.log( - 'This web app is being served cache-first by a service ' + - 'worker. To learn more, visit https://goo.gl/SC7cgQ' - ); - }); - } else { - // Is not local host. Just register service worker - registerValidSW(swUrl); - } - }); - } -} - -function registerValidSW(swUrl) { - navigator.serviceWorker - .register(swUrl) - .then(registration => { - registration.onupdatefound = () => { - const installingWorker = registration.installing; - 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.'); - } - } - }; - }; - }) - .catch(error => { - console.error('Error during service worker registration:', error); - }); -} - -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. - registerValidSW(swUrl); - } - }) - .catch(() => { - console.log( - 'No internet connection found. App is running in offline mode.' - ); - }); -} - -export function unregister() { - if ('serviceWorker' in navigator) { - navigator.serviceWorker.ready.then(registration => { - registration.unregister(); - }); - } -}