Feature(toasts): make toast short lived by default

common/app/redux/actions.js

@@ -5,20 +5,6 @@ import types from './types';
 // updateTitle(title: String) => Action
 export const updateTitle = createAction(types.updateTitle);
 
-let id = 0;
-// makeToast({ type?: String, message: String, title: String }) => Action
-export const makeToast = createAction(
-  types.makeToast,
-  toast => {
-    id += 1;
-    return {
-      ...toast,
-      id,
-      type: toast.type || 'info'
-    };
-  }
-);
-
 // fetchUser() => Action
 // used in combination with fetch-user-saga
 export const fetchUser = createAction(types.fetchUser);

common/app/routes/challenges/components/classic/Tool-Panel.jsx

@@ -18,7 +18,8 @@ export default class ToolPanel extends PureComponent {
 
   makeHint() {
     this.props.makeToast({
-      message: this.props.hint
+      message: this.props.hint,
+      timeout: 4000
     });
     this.props.updateHint();
   }
@@ -27,7 +28,8 @@ export default class ToolPanel extends PureComponent {
     this.props.makeToast({
       message: 'This will restore your code editor to its original state.',
       action: 'clear my code',
-      actionCreator: 'resetChallenge'
+      actionCreator: 'resetChallenge',
+      timeout: 4000
     });
   }
 

common/app/routes/challenges/redux/answer-saga.js

@@ -55,7 +55,10 @@ export default function answerSaga(action$, getState) {
       if (answer !== finalAnswer) {
         let infoAction;
         if (info) {
-          infoAction = makeToast({ message: info });
+          infoAction = makeToast({
+            message: info,
+            timeout: 5000
+          });
         }
 
         return Observable

common/app/routes/challenges/redux/completion-saga.js

@@ -9,28 +9,18 @@ import {
 import { makeToast } from '../../../toasts/redux/actions';
 
 import { challengeSelector } from './selectors';
-import { backEndProject } from '../../../utils/challengeTypes';
 import { randomCompliment } from '../../../utils/get-words';
+import { backEndProject } from '../../../utils/challengeTypes';
 import { postJSON$ } from '../../../../utils/ajax-stream';
 
 function postChallenge(url, body, username) {
   const saveChallenge$ = postJSON$(url, body)
     .retry(3)
-    .flatMap(({ alreadyCompleted, points }) => {
+    .map(({ points }) => {
-      return Observable.of(
+      return updateUserPoints(username, points);
-        makeToast({
-          message: randomCompliment() +
-            (alreadyCompleted ? '!' : '! First time Completed!')
-        }),
-        updateUserPoints(username, points)
-      );
     })
     .catch(createErrorObservable);
-
+  const challengeCompleted$ = Observable.of(moveToNextChallenge());
-  const challengeCompleted$ = Observable.of(
-    moveToNextChallenge(),
-    username ? makeToast({ message: ' Saving...' }) : null
-  );
   return Observable.merge(saveChallenge$, challengeCompleted$);
 }
 
@@ -40,9 +30,10 @@ function submitModern(type, state) {
     if (type === types.checkChallenge) {
       return Observable.of(
         makeToast({
-          message: 'Go to my next challenge.',
+          message: `${randomCompliment()} Go to next challenge.`,
           action: 'Submit',
-          actionCreator: 'submitChallenge'
+          actionCreator: 'submitChallenge',
+          timeout: 10000
         })
       );
     }
@@ -61,9 +52,7 @@ function submitModern(type, state) {
       return postChallenge('/modern-challenge-completed', body, user);
     }
   }
-  return Observable.just(makeToast({
+  return Observable.just(makeToast({ message: 'Not quite there, yet.' }));
-    message: 'Not all tests are passing, yet.'
-  }));
 }
 
 function submitProject(type, state, { solution, githubLink }) {

common/app/toasts/redux/actions.js

@@ -9,7 +9,7 @@ export const makeToast = createAction(
     // assign current value of key to new toast
     // and then increment key value
     key: key++,
-    dismissAfter: timeout || 10000,
+    dismissAfter: timeout || 2000,
     position: rest.position === 'left' ? 'left' : 'right'
   })
 );