save and clear SessionStorage called from SendformActions

src/js/actions/SelectedAccountActions.js

@@ -42,9 +42,9 @@ export const updateSelectedValues = (prevState: State, action: Action): AsyncAct
 
         // reset form to default
         if (action.type === SEND.TX_COMPLETE) {
-            dispatch( SendFormActions.init() );
+            // dispatch( SendFormActions.init() );
             // linear action
-            SessionStorageActions.clear(location.pathname);
+            // SessionStorageActions.clear(location.pathname);
         }
 
         // handle devices state change (from trezor-connect events or location change)
@@ -57,14 +57,6 @@ export const updateSelectedValues = (prevState: State, action: Action): AsyncAct
 
 
             if (locationChange) {
-
-                if (prevLocation) {
-                    // save form data to session storage
-                    // TODO: move to state.sendForm on change event
-                    if (prevLocation.state.send) {
-                        SessionStorageActions.save(prevState.router.location.pathname, state.sendForm);
-                    }
-                }
                 // dispose current account view
                 dispatch( dispose() );
             }
@@ -101,7 +93,7 @@ export const updateSelectedValues = (prevState: State, action: Action): AsyncAct
 
                 // initialize SendFormReducer
                 if (location.state.send && getState().sendForm.currency === "") {
-                    dispatch( SendFormActions.init( SessionStorageActions.load(location.pathname) ) );
+                    dispatch( SendFormActions.init() );
                 }
             }
         }

src/js/actions/SendFormActions.js

@@ -4,6 +4,8 @@
 import * as SEND from './constants/send';
 import * as NOTIFICATION from './constants/notification';
 
+import * as SessionStorageActions from './SessionStorageActions';
+
 import { estimateGas, getGasPrice, pushTx } from './Web3Actions';
 
 import EthereumjsUtil from 'ethereumjs-util';
@@ -150,7 +152,6 @@ export const calculateMaxAmount = (balance: BigNumber, gasPrice: string, gasLimi
 }
 
 export const calculate = (prevProps: Props, props: Props) => {
-
     const {
         account,
         tokens,
@@ -236,7 +237,7 @@ export const getFeeLevels = (symbol: string, gasPrice: BigNumber | string, gasLi
 
 
 // initialize component
-export const init = (stateFromStorage: ?State): ThunkAction => {
+export const init = (): ThunkAction => {
     return (dispatch: Dispatch, getState: GetState): void => {
 
         const {
@@ -247,6 +248,7 @@ export const init = (stateFromStorage: ?State): ThunkAction => {
 
         if (!account || !network || !web3) return;
 
+       const stateFromStorage = SessionStorageActions.load( getState().router.location.pathname );
         if (stateFromStorage) {
             dispatch({
                 type: SEND.INIT,
@@ -855,7 +857,7 @@ export const onSend = (): AsyncAction => {
         const pendingNonce: number = stateUtils.getPendingNonce(pending);
         const nonce = pendingNonce >= account.nonce ? pendingNonce + 1 : account.nonce;
 
-        console.warn("NONCEE", nonce, account.nonce, stateUtils.getPendingNonce(pending))
+        console.warn("NONCE", nonce, account.nonce, stateUtils.getPendingNonce(pending))
 
         const txData = {
             address_n,
@@ -930,6 +932,13 @@ export const onSend = (): AsyncAction => {
                 txData,
             });
 
+            // clear session storage
+            dispatch( SessionStorageActions.clear() );
+
+            // reset form
+            dispatch( init() );
+
+
             dispatch({
                 type: NOTIFICATION.ADD,
                 payload: {

src/js/actions/SessionStorageActions.js

@@ -2,18 +2,26 @@
 'use strict';
 
 import type { State as SendFormState } from '../reducers/SendFormReducer';
+import type {
+    ThunkAction,
+    GetState, 
+    Dispatch,
+} from '~/flowtype';
 
 const PREFIX: string = 'trezor:draft-tx:';
 
-export const save = (location: string, state: SendFormState): void => {
+export const save = (): ThunkAction => {
-
+    return (dispatch: Dispatch, getState: GetState): void => {
-    if (typeof window.localStorage === 'undefined') return;
+        if (typeof window.localStorage === 'undefined') return;
-
+
-    if (!state.untouched) {
+        const location = getState().router.location.pathname;
-        try {
+        const state = getState().sendForm;
-            window.sessionStorage.setItem(`${PREFIX}${location}`, JSON.stringify(state) );
+        if (!state.untouched) {
-        } catch (error) {
+            try {
-            console.error("Saving sessionStorage error: " + error)
+                window.sessionStorage.setItem(`${PREFIX}${location}`, JSON.stringify(state) );
+            } catch (error) {
+                console.error("Saving sessionStorage error: " + error)
+            }
         }
     }
 }
@@ -24,7 +32,12 @@ export const load = (location: string): ?SendFormState => {
 
     try {
         const value: string = window.sessionStorage.getItem(`${PREFIX}${location}`);
-        return JSON.parse(value);
+        const state: ?SendFormState = JSON.parse(value);
+        if (state && state.address === '' && (state.amount === '' || state.amount === '0')) {
+            window.sessionStorage.removeItem(`${PREFIX}${location}`);
+            return;
+        }
+        return state;
     } catch (error) {
         console.error("Loading sessionStorage error: " + error)
     }
@@ -32,12 +45,14 @@ export const load = (location: string): ?SendFormState => {
     return;
 }
 
-export const clear = (location: string) => {
+export const clear = (): ThunkAction => {
-    if (typeof window.localStorage === 'undefined') return;
+    return (dispatch: Dispatch, getState: GetState): void => {
-
+        if (typeof window.localStorage === 'undefined') return;
-    try {
+        const location = getState().router.location.pathname;
-        window.sessionStorage.removeItem(`${PREFIX}${location}`);
+        try {
-    } catch (error) {
+            window.sessionStorage.removeItem(`${PREFIX}${location}`);
-        console.error("Clearing sessionStorage error: " + error)
+        } catch (error) {
+            console.error("Clearing sessionStorage error: " + error)
+        }
     }
 }

src/js/components/wallet/account/send/SendForm.js

@@ -21,6 +21,8 @@ export default class SendContainer extends Component<Props> {
     componentWillReceiveProps(newProps: Props) {
         calculate(this.props, newProps);
         validation(newProps);
+
+        this.props.saveSessionStorage();
     }
 
     render() {

src/js/components/wallet/account/send/index.js

@@ -6,6 +6,7 @@ import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 
 import { default as SendFormActions } from '~/js/actions/SendFormActions';
+import * as SessionStorageActions from '~/js/actions/SessionStorageActions';
 import SendForm from './SendForm';
 
 import type { MapStateToProps, MapDispatchToProps } from 'react-redux';
@@ -22,7 +23,8 @@ export type StateProps = BaseStateProps & {
 }
 
 export type DispatchProps = BaseDispatchProps & {
-    sendFormActions: typeof SendFormActions
+    sendFormActions: typeof SendFormActions,
+    saveSessionStorage: typeof SessionStorageActions.save
 }
 
 export type Props = StateProps & BaseStateProps & DispatchProps & BaseDispatchProps;
@@ -42,6 +44,7 @@ const mapStateToProps: MapStateToProps<State, OwnProps, StateProps> = (state: St
 const mapDispatchToProps: MapDispatchToProps<Dispatch, OwnProps, DispatchProps> = (dispatch: Dispatch): DispatchProps => {
     return {
         sendFormActions: bindActionCreators(SendFormActions, dispatch),
+        saveSessionStorage: bindActionCreators(SessionStorageActions.save, dispatch),
     };
 }