Minor things

app/components/Sidebar.js

@@ -98,13 +98,13 @@ class Sidebar extends Component {
           {this._renderChildren(children)}
         </ul>
 
-        {/*<footer className="sidebar__footer form-control form-control--underlined">*/}
-          {/*<Input*/}
-            {/*type="text"*/}
-            {/*placeholder="Filter Requests"*/}
-            {/*value={filter}*/}
-            {/*onChange={this._onFilterChange.bind(this)}/>*/}
-        {/*</footer>*/}
+        <footer className="sidebar__footer form-control form-control--underlined">
+          <Input
+            type="text"
+            placeholder="Filter Requests"
+            value={filter}
+            onChange={this._onFilterChange.bind(this)}/>
+        </footer>
       </aside>
     )
   }
@@ -119,7 +119,6 @@ Sidebar.propTypes = {
 
   // Other
   children: PropTypes.array.isRequired,
-  workspaceId: PropTypes.string.isRequired,
 
   // Optional
   filter: PropTypes.string,

app/components/SidebarRequestGroupRow.js

@@ -13,7 +13,7 @@ const SidebarRequestGroupRow = ({
   addRequestToRequestGroup,
 }) => {
   let folderIconClass = 'fa-folder';
-  let expanded = !requestGroup.collapsed;
+  let expanded = !requestGroup.meta.collapsed;
   folderIconClass += !expanded ? '' : '-open';
   folderIconClass += isActive ? '' : '-o';
 

app/containers/App.js

@@ -1,5 +1,6 @@
 import React, {Component, PropTypes} from 'react';
-import ReactDOM from 'react-dom'
+import ReactDOM from 'react-dom';
+import classnames from 'classnames';
 import {connect} from 'react-redux'
 import {bindActionCreators} from 'redux';
 import Mousetrap from '../lib/mousetrap';
@@ -37,8 +38,8 @@ class App extends Component {
       activeRequest: null,
       draggingSidebar: false,
       draggingPane: false,
-      sidebarWidth: workspace.sidebarWidth || DEFAULT_SIDEBAR_WIDTH, // rem
-      paneWidth: workspace.paneWidth || DEFAULT_PANE_WIDTH // % (fr)
+      sidebarWidth: workspace.meta.sidebarWidth || DEFAULT_SIDEBAR_WIDTH, // rem
+      paneWidth: workspace.meta.paneWidth || DEFAULT_PANE_WIDTH // % (fr)
     };
 
     this.globalKeyMap = {
@@ -168,12 +169,12 @@ class App extends Component {
 
   _savePaneWidth () {
     const {paneWidth} = this.state;
-    db.workspaceUpdate(this._getActiveWorkspace(), {paneWidth});
+    db.workspaceUpdateMeta(this._getActiveWorkspace(), {paneWidth});
   }
 
   _saveSidebarWidth () {
     const {sidebarWidth} = this.state;
-    db.workspaceUpdate(this._getActiveWorkspace(), {sidebarWidth});
+    db.workspaceUpdateMeta(this._getActiveWorkspace(), {sidebarWidth});
   }
 
   _getActiveWorkspace (props) {
@@ -191,7 +192,7 @@ class App extends Component {
   _getActiveRequest (props) {
     props = props || this.props;
     const {entities} = props;
-    let activeRequestId = this._getActiveWorkspace(props).activeRequestId;
+    let activeRequestId = this._getActiveWorkspace(props).meta.activeRequestId;
     return activeRequestId ? entities.requests[activeRequestId] : null;
   }
 
@@ -254,7 +255,7 @@ class App extends Component {
   }
 
   componentWillReceiveProps (nextProps) {
-    const sidebarWidth = this._getActiveWorkspace(nextProps).sidebarWidth;
+    const sidebarWidth = this._getActiveWorkspace(nextProps).meta.sidebarWidth;
     this.setState({sidebarWidth});
   }
 
@@ -287,7 +288,7 @@ class App extends Component {
 
     const workspace = this._getActiveWorkspace();
 
-    const activeRequest = this._getActiveRequest()
+    const activeRequest = this._getActiveRequest();
     const activeRequestId = activeRequest ? activeRequest._id : null;
 
     const responses = Object.keys(entities.responses).map(id => entities.responses[id]);
@@ -306,15 +307,15 @@ class App extends Component {
     const {sidebarWidth, paneWidth} = this.state;
     const gridTemplateColumns = `${sidebarWidth}rem 0 ${paneWidth}fr 0 ${1 - paneWidth}fr`;
 
+    const classes = classnames('wrapper', {'wrapper--sidebar-hidden': !workspace.meta.sidebarVisible});
     return (
-      <div id="wrapper" className="wrapper" style={{gridTemplateColumns: gridTemplateColumns}}>
+      <div id="wrapper" className={classes} style={{gridTemplateColumns: gridTemplateColumns}}>
         <Sidebar
           ref="sidebar"
-          workspaceId={workspace._id}
-          activateRequest={r => db.workspaceUpdate(workspace, {activeRequestId: r._id})}
+          activateRequest={r => db.workspaceUpdateMeta(workspace, {activeRequestId: r._id})}
           changeFilter={filter => db.workspaceUpdate(workspace, {filter})}
           addRequestToRequestGroup={requestGroup => db.requestCreate({parentId: requestGroup._id})}
-          toggleRequestGroup={requestGroup => db.requestGroupUpdate(requestGroup, {collapsed: !requestGroup.collapsed})}
+          toggleRequestGroup={requestGroup => db.requestGroupUpdateMeta(requestGroup, {collapsed: !requestGroup.meta.collapsed})}
           activeRequestId={activeRequest ? activeRequest._id : null}
           filter={workspace.filter || ''}
           children={children}
@@ -348,8 +349,8 @@ class App extends Component {
           ref="responsePane"
           response={activeResponse}
           request={activeRequest}
-          previewMode={activeRequest ? activeRequest.previewMode : PREVIEW_MODE_FRIENDLY}
-          updatePreviewMode={previewMode => db.requestUpdate(activeRequest, {previewMode})}
+          previewMode={activeRequest ? activeRequest.meta.previewMode : PREVIEW_MODE_FRIENDLY}
+          updatePreviewMode={previewMode => db.requestUpdateMeta(activeRequest, {previewMode})}
           loadingRequests={requests.loadingRequests}
         />
 

app/containers/WorkspaceDropdown.js

@@ -101,6 +101,11 @@ class WorkspaceDropdown extends Component {
 
           <DropdownDivider name="Insomnia"/>
 
+          <li>
+            <button onClick={e => SettingsModal.show()}>
+              <i className="fa fa-share"></i> Import/Export
+            </button>
+          </li>
           <li>
             <button onClick={e => SettingsModal.show()}>
               <i className="fa fa-cog"></i> Settings

app/css/components/sidebar.scss

@@ -176,7 +176,7 @@
   // Sidebar Footer //
   // ~~~~~~~~~~~~~~ //
 
-  footer.sidebar__footer {
+  .sidebar__footer {
     position: absolute;
     bottom: 0;
     left: 0;

app/database/index.js

@@ -20,7 +20,6 @@ const TYPES = [
 ];
 
 let db = null;
-global.db = db;
 
 function getDBFilePath () {
   const basePath = electron.remote.app.getPath('userData');
@@ -41,7 +40,7 @@ export function initDB () {
   return new Promise(resolve => {
     const dbPath = getDBFilePath();
 
-    db = {
+    global.db = db = {
       created: Date.now(),
       entities: {}
     };
@@ -187,24 +186,30 @@ const MODEL_DEFAULTS = {
     url: '',
     name: 'New Request',
     method: methods.METHOD_GET,
-    previewMode: PREVIEW_MODE_SOURCE,
     contentType: CONTENT_TYPE_TEXT,
     body: '',
     parameters: [],
     headers: [],
-    authentication: {}
+    authentication: {},
+    meta: {
+      previewMode: PREVIEW_MODE_SOURCE
+    }
   },
   [TYPE_REQUEST_GROUP]: {
-    collapsed: false,
     name: 'New Request Group',
-    environment: {}
+    environment: {},
+    meta: {
+      collapsed: false
+    }
   },
   [TYPE_WORKSPACE]: {
     name: 'New Workspace',
-    activeRequestId: null,
     environments: [],
-    sidebarWidth: DEFAULT_SIDEBAR_WIDTH,
-    filter: ''
+    filter: '',
+    meta: {
+      sidebarWidth: DEFAULT_SIDEBAR_WIDTH,
+      activeRequestId: null
+    }
   },
   [TYPE_RESPONSE]: {
     statusCode: 0,
@@ -215,7 +220,10 @@ const MODEL_DEFAULTS = {
     millis: 0,
     headers: [],
     body: '',
-    error: ''
+    error: '',
+    meta: {
+      // Nothing yet
+    }
   }
 };
 
@@ -237,9 +245,16 @@ function docUpdate (originalDoc, patch = {}) {
   return new Promise(resolve => resolve(finalDoc));
 }
 
+function docUpdateMeta (originalDoc, metaPatch = {}) {
+  const meta = Object.assign({}, originalDoc.meta, metaPatch);
+  const finalDoc = docUpdate(originalDoc, {meta});
+  return new Promise(resolve => resolve(finalDoc));
+}
+
 function docCreate (type, idPrefix, patch = {}) {
   const baseDefaults = {
-    parentId: null
+    parentId: null,
+    meta: {}
   };
 
   const modelDefaults = MODEL_DEFAULTS[type];
@@ -252,8 +267,6 @@ function docCreate (type, idPrefix, patch = {}) {
     // Required Generated Fields
     {
       _id: generateId(idPrefix),
-      $loki: undefined,
-      meta: undefined,
       type: type,
       created: Date.now(),
       modified: Date.now()
@@ -292,6 +305,10 @@ export function requestUpdate (request, patch) {
   return docUpdate(request, patch);
 }
 
+export function requestUpdateMeta (request, patch) {
+  return docUpdateMeta(request, patch);
+}
+
 export function requestCopy (request) {
   const name = `${request.name} (Copy)`;
   return requestCreate(Object.assign({}, request, {name}));
@@ -318,6 +335,10 @@ export function requestGroupUpdate (requestGroup, patch) {
   return docUpdate(requestGroup, patch);
 }
 
+export function requestGroupUpdateMeta (requestGroup, patch) {
+  return docUpdateMeta(requestGroup, patch);
+}
+
 export function requestGroupById (id) {
   return get(TYPE_REQUEST_GROUP, id);
 }
@@ -366,6 +387,10 @@ export function workspaceUpdate (workspace, patch) {
   return docUpdate(workspace, patch);
 }
 
+export function workspaceUpdateMeta (workspace, patch) {
+  return docUpdateMeta(workspace, patch);
+}
+
 export function workspaceRemove (workspace) {
   return remove(workspace);
 }

app/lib/constants.js

@@ -7,7 +7,7 @@ export const REQUEST_TIME_TO_SHOW_COUNTER = 1; // Seconds
 
 // UI Stuff
 export const MAX_SIDEBAR_REMS = 35;
-export const MIN_SIDEBAR_REMS = 10;
+export const MIN_SIDEBAR_REMS = 0.75;
 export const MAX_PANE_WIDTH = 0.99;
 export const MIN_PANE_WIDTH = 0.01;
 export const DEFAULT_PANE_WIDTH = 0.5;

app/lib/export/database.js

@@ -175,7 +175,6 @@ export function exportJSON () {
         url: r.url,
         name: r.name,
         method: r.method,
-        previewMode: r.previewMode,
         contentType: r.contentType,
         body: r.body,
         parameters: r.parameters,