// @flow
import {
	UI_OPEN_SIDEBAR,
	UI_CLOSE_SIDEBAR,
	UI_WINDOW_RESIZE
} from 'actions/layout'
import {LOCATION_CHANGE, APPLICATION_INIT} from 'actions/common'
//
import type {LOCATION_CHANGE_TYPE, APPLICATION_INIT_TYPE} from 'actions/common'
import type {
	UI_OPEN_SIDEBAR_TYPE,
	UI_CLOSE_SIDEBAR_TYPE,
	UI_WINDOW_RESIZE_TYPE
} from 'actions/layout'

export type State = {
	sidebarOpened: boolean,
	isMobile: boolean,
	isMobileXS: boolean,
	isMobileSM: boolean
}

type Action =
	| UI_OPEN_SIDEBAR_TYPE
	| UI_CLOSE_SIDEBAR_TYPE
	| UI_WINDOW_RESIZE_TYPE
	| LOCATION_CHANGE_TYPE
	| APPLICATION_INIT_TYPE

export const initialState: State = {
	sidebarOpened: false,
	isMobile: false,
	isMobileXS: false,
	isMobileSM: false
}

export function layout (state: State = initialState, action: Action): State {
	const computeMobileStatuses = (innerWidth: number) => {
		const isMobile: boolean = innerWidth < 1025 // 1024px - is the main breakpoint in ui
		const isMobileXS: boolean = innerWidth < 481
		const isMobileSM: boolean = innerWidth > 480 && innerWidth < 767
		return {isMobileSM, isMobileXS, isMobile}
	}
	switch (action.type) {
	case APPLICATION_INIT:
	case UI_WINDOW_RESIZE:
		return {
			...state,
			...computeMobileStatuses(action.payload.innerWidth)
		}
	case UI_OPEN_SIDEBAR:
		return {
			...state,
			sidebarOpened: true
		}
	case LOCATION_CHANGE:
	case UI_CLOSE_SIDEBAR:
		return {
			...state,
			sidebarOpened: false
		}
	default:
		return state
	}
}

@@ -113,34 +113,16 @@
 N_CHANGE
-, APPLICATION_INIT
 %7D from '
@@ -1111,32 +1111,8 @@
 ) %7B%0A
-%09case APPLICATION_INIT:%0A
 %09cas
@@ -1134,89 +1134,153 @@
 IZE:
+ %7B
 %0A%09%09
-return %7B%0A%09%09%09...state,%0A%09%09%09...computeMobileStatuses(action.payload.innerWidth)%0A%09
+const %7BinnerWidth%7D = action.payload%0A%09%09const mobileStates = computeMobileStatuses(innerWidth)%0A%09%09return %7B%0A%09%09%09...state,%0A%09%09%09...mobileStates%0A%09%09%7D%0A
 %09%7D%0A%09

remove APPLICATION_INIT handling