diff --git a/app/containers/App.js b/app/containers/App.js index de8788b72..17cc07ece 100644 --- a/app/containers/App.js +++ b/app/containers/App.js @@ -10,6 +10,7 @@ import RequestPane from '../components/RequestPane' import ResponsePane from '../components/ResponsePane' import Sidebar from '../components/Sidebar' import {PREVIEW_MODE_FRIENDLY} from '../lib/previewModes' +import {MAX_PANE_WIDTH, MIN_PANE_WIDTH, MAX_SIDEBAR_REMS, MIN_SIDEBAR_REMS} from '../lib/constants' import * as GlobalActions from '../redux/modules/global' import * as RequestGroupActions from '../redux/modules/requestGroups' @@ -82,13 +83,14 @@ class App extends Component { const pixelOffset = e.clientX - requestPane.offsetLeft; let paneWidth = pixelOffset / (requestPaneWidth + responsePaneWidth); - paneWidth = Math.min(Math.max(paneWidth, 0.01), 0.99); + paneWidth = Math.min(Math.max(paneWidth, MIN_PANE_WIDTH), MAX_PANE_WIDTH); this.setState({paneWidth}); } else if (this.state.draggingSidebar) { const currentPixelWidth = ReactDOM.findDOMNode(this.refs.sidebar).offsetWidth; const ratio = e.clientX / currentPixelWidth; - const sidebarWidth = Math.max(Math.min(this.state.sidebarWidth * ratio, 25), 13); + const width = this.state.sidebarWidth * ratio; + const sidebarWidth = Math.max(Math.min(width, MAX_SIDEBAR_REMS), MIN_SIDEBAR_REMS); this.setState({sidebarWidth}) } }) diff --git a/app/lib/constants.js b/app/lib/constants.js index 8252022d4..6a7728743 100644 --- a/app/lib/constants.js +++ b/app/lib/constants.js @@ -2,6 +2,12 @@ export const LOCALSTORAGE_KEY = 'insomnia.state'; export const DB_PERSIST_INTERVAL = 1000; +// UI Stuff +export const MAX_SIDEBAR_REMS = 35; +export const MIN_SIDEBAR_REMS = 13; +export const MAX_PANE_WIDTH = 0.99; +export const MIN_PANE_WIDTH = 0.01; + // HTTP Methods export const METHOD_GET = 'GET'; export const METHOD_PUT = 'PUT'; diff --git a/package.json b/package.json index b333b47fc..a056b0ff6 100644 --- a/package.json +++ b/package.json @@ -14,10 +14,10 @@ "json-lint": "^0.1.0", "jsonschema": "^1.1.0", "nunjucks": "^1.3.4", - "react": "^0.14.7", - "react-dom": "^0.14.7", + "react": "^15.1.0", + "react-dom": "^15.1.0", "react-redux": "^4.4.1", - "react-tabs": "^0.5.3", + "react-tabs": "^0.5.4", "redux": "^3.3.1", "redux-logger": "^2.6.1", "redux-shortcuts": "0.0.1", @@ -43,7 +43,7 @@ "jest-cli": "^0.9.2", "json-loader": "^0.5.4", "node-sass": "^3.4.2", - "react-addons-test-utils": "^0.14.7", + "react-addons-test-utils": "^15.1.0", "react-hot-loader": "^1.3.0", "redux-mock-store": "^1.0.2", "sass-loader": "^3.2.0",