Skip to content

Instantly share code, notes, and snippets.

@acontreras89
Last active March 2, 2018 10:08
Show Gist options
  • Save acontreras89/7f71c33e048b50e0bfeddd36913d3e51 to your computer and use it in GitHub Desktop.
Save acontreras89/7f71c33e048b50e0bfeddd36913d3e51 to your computer and use it in GitHub Desktop.
git diff --ignore-all-space flag

Result using git diff without arguments:

diff --git a/src/index.js b/src/index.js
index 56a41c3..c2b401b 100644
--- a/src/index.js
+++ b/src/index.js
@@ -3,6 +3,7 @@ import React from 'react'
 import ReactDOM from 'react-dom'
 import { Router, Route, Switch } from 'react-router-dom'
 import { Provider } from 'react-redux'
+import { TransitionGroup, CSSTransition } from 'react-transition-group'
 import SpatialNavigation from './navigation'
 import App from './AppEnhanced'
 import NavigationSounds from './sounds'
@@ -33,25 +34,29 @@ ReactDOM.render(
   <Provider store={store}>
     <SpatialNavigation>
       <Router history={history}>
-        <Route>
+        <Route render={props => (
           <NavigationSounds>
-            <Switch>
-              <Route path='/miniguide' exact component={MiniGuide} />
-              <Route path='/mocks/:page' exact component={Mock} />
-              <Route path='/watch/:id' exact component={Watch} />
-              <Route>
-                <App>
-                  <Route path='/' exact component={Home} />
-                  <Route path='/grid/:id' exact component={Grid} />
-                  <Route path='/category/:id' exact component={Category} />
-                  <Route path='/sports/:id' exact component={Sports} />
-                  <Route path='/detail/:id' exact component={Detail} />
-                  <Route path='/detail/:id/:sub' exact component={Sports} />
-                </App>
-              </Route>
-            </Switch>
+            <TransitionGroup>
+              <CSSTransition key={props.location.pathname} classNames='fade' timeout={150}>
+                <Switch location={props.location}>
+                  <Route path='/miniguide' exact component={MiniGuide} />
+                  <Route path='/mocks/:page' exact component={Mock} />
+                  <Route path='/watch/:id' exact component={Watch} />
+                  <Route>
+                    <App>
+                      <Route path='/' exact component={Home} />
+                      <Route path='/grid/:id' exact component={Grid} />
+                      <Route path='/category/:id' exact component={Category} />
+                      <Route path='/sports/:id' exact component={Sports} />
+                      <Route path='/detail/:id' exact component={Detail} />
+                      <Route path='/detail/:id/:sub' exact component={Sports} />
+                    </App>
+                  </Route>
+                </Switch>
+              </CSSTransition>
+            </TransitionGroup>
           </NavigationSounds>
-        </Route>
+        )} />
       </Router>
     </SpatialNavigation>
   </Provider>,

Result using git diff -w:

diff --git a/src/index.js b/src/index.js
index 56a41c3..c2b401b 100644
--- a/src/index.js
+++ b/src/index.js
@@ -3,6 +3,7 @@ import React from 'react'
 import ReactDOM from 'react-dom'
 import { Router, Route, Switch } from 'react-router-dom'
 import { Provider } from 'react-redux'
+import { TransitionGroup, CSSTransition } from 'react-transition-group'
 import SpatialNavigation from './navigation'
 import App from './AppEnhanced'
 import NavigationSounds from './sounds'
@@ -33,9 +34,11 @@ ReactDOM.render(
   <Provider store={store}>
     <SpatialNavigation>
       <Router history={history}>
-        <Route>
+        <Route render={props => (
           <NavigationSounds>
-            <Switch>
+            <TransitionGroup>
+              <CSSTransition key={props.location.pathname} classNames='fade' timeout={150}>
+                <Switch location={props.location}>
                   <Route path='/miniguide' exact component={MiniGuide} />
                   <Route path='/mocks/:page' exact component={Mock} />
                   <Route path='/watch/:id' exact component={Watch} />
@@ -50,8 +53,10 @@ ReactDOM.render(
                     </App>
                   </Route>
                 </Switch>
+              </CSSTransition>
+            </TransitionGroup>
           </NavigationSounds>
-        </Route>
+        )} />
       </Router>
     </SpatialNavigation>
   </Provider>,
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment