save heigt of down panel in local storage

storybookjs · Apr 4, 2017 · 3e38843 · 3e38843
1 parent dc8daec
commit 3e38843
Show file tree

Hide file tree

Showing 8 changed files with 946 additions and 918 deletions.
diff --git a/dist/modules/api/index.js b/dist/modules/api/index.js
@@ -19,7 +19,8 @@ exports.default = {
   defaultState: {
     uiOptions: {
       name: 'REACT STORYBOOK',
-      url: 'https://github.com/storybooks/react-storybook'
+      url: 'https://github.com/storybooks/react-storybook',
+      sortStoriesByKind: false
     }
   },
   load: function load(_ref, _actions) {
@@ -28,4 +29,4 @@ exports.default = {
 
     (0, _init_api2.default)(provider, clientStore, _actions);
   }
-};
+};
diff --git a/dist/modules/ui/components/layout/index.js b/dist/modules/ui/components/layout/index.js
@@ -137,6 +137,13 @@ var Layout = function (_React$Component) {
         downPanelDefaultSize = downPanelInRight ? 400 : 200;
       }
 
+      if (typeof localStorage !== 'undefined') {
+        var savedSize = localStorage.getItem('splitPos');
+        if (typeof savedSize !== 'undefined') {
+          downPanelDefaultSize = savedSize;
+        }
+      }
+
       return _react2.default.createElement(
         'div',
         { style: rootStyle },
@@ -164,7 +171,12 @@ var Layout = function (_React$Component) {
               defaultSize: downPanelDefaultSize,
               resizerChildren: downPanelInRight ? vsplit : hsplit,
               onDragStarted: onDragStart,
-              onDragFinished: onDragEnd
+              onDragFinished: onDragEnd,
+              onChange: function onChange(size) {
+                if (typeof localStorage !== 'undefined') {
+                  localStorage.setItem('splitPos', size);
+                }
+              }
             },
             _react2.default.createElement(
               'div',

diff --git a/dist/modules/ui/components/left_panel/header.js b/dist/modules/ui/components/left_panel/header.js
@@ -75,7 +75,7 @@ var Header = function Header(_ref) {
     ),
     _react2.default.createElement(
       'a',
-      { style: linkStyle, href: url, target: '_blank' },
+      { style: linkStyle, href: url, target: '_blank', rel: 'noopener noreferrer' },
       _react2.default.createElement(
         'h3',
         { style: headingStyle },

diff --git a/dist/modules/ui/containers/left_panel.js b/dist/modules/ui/containers/left_panel.js
@@ -34,10 +34,13 @@ var mapper = exports.mapper = function mapper(state, props, _ref) {
       selectedStory = state.selectedStory,
       uiOptions = state.uiOptions,
       storyFilter = state.storyFilter;
+  var name = uiOptions.name,
+      url = uiOptions.url,
+      sortStoriesByKind = uiOptions.sortStoriesByKind;
 
 
   var data = {
-    stories: filters.storyFilter(stories, storyFilter, selectedKind, selectedStory),
+    stories: filters.storyFilter(stories, storyFilter, selectedKind, sortStoriesByKind),
     selectedKind: selectedKind,
     selectedStory: selectedStory,
     onSelectStory: actionMap.api.selectStory,
@@ -46,8 +49,8 @@ var mapper = exports.mapper = function mapper(state, props, _ref) {
     onStoryFilter: actionMap.ui.setStoryFilter,
 
     openShortcutsHelp: actionMap.ui.toggleShortcutsHelp,
-    name: uiOptions.name,
-    url: uiOptions.url
+    name: name,
+    url: url
   };
 
   return data;

diff --git a/dist/modules/ui/libs/filters.js b/dist/modules/ui/libs/filters.js
@@ -9,13 +9,24 @@ var _fuzzysearch = require('fuzzysearch');
 
 var _fuzzysearch2 = _interopRequireDefault(_fuzzysearch);
 
+var _lodash = require('lodash.sortby');
+
+var _lodash2 = _interopRequireDefault(_lodash);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function storyFilter(stories, filter, selectedKind) {
+function sort(stories, sortStoriesByKind) {
+  if (!sortStoriesByKind) return stories;
+
+  return (0, _lodash2.default)(stories, ['kind']);
+}
+
+function storyFilter(stories, filter, selectedKind, sortStoriesByKind) {
   if (!stories) return null;
-  if (!filter) return stories;
+  var sorted = sort(stories, sortStoriesByKind);
+  if (!filter) return sorted;
 
-  return stories.filter(function (kindInfo) {
+  return sorted.filter(function (kindInfo) {
     if (kindInfo.kind === selectedKind) return true;
     var needle = filter.toLocaleLowerCase();
     var hstack = kindInfo.kind.toLocaleLowerCase();

diff --git a/src/modules/ui/components/layout/index.js b/src/modules/ui/components/layout/index.js
@@ -86,6 +86,13 @@ class Layout extends React.Component {
       downPanelDefaultSize = downPanelInRight ? 400 : 200;
     }
 
+    if(typeof localStorage !== 'undefined') {
+      const savedSize = localStorage.getItem('splitPos');
+      if(typeof savedSize !== 'undefined') {
+        downPanelDefaultSize = savedSize;
+      }
+    }
+
     return (
       <div style={rootStyle}>
         <SplitPane
@@ -108,6 +115,13 @@ class Layout extends React.Component {
             resizerChildren={downPanelInRight ? vsplit : hsplit}
             onDragStarted={onDragStart}
             onDragFinished={onDragEnd}
+            onChange={
+              size => {
+                if (typeof localStorage !== 'undefined') {
+                  localStorage.setItem('splitPos', size);
+                }
+              }
+            }
           >
             <div style={contentPanelStyle}>
               <div style={previewStyle}>

diff --git a/src/modules/ui/components/shortcuts_help.js b/src/modules/ui/components/shortcuts_help.js
@@ -113,7 +113,7 @@ export const ShortcutsHelp = ({ isOpen, onClose, platform }) => (
     isOpen = {isOpen}
     onRequestClose = {onClose}
     style = {modalStyles}
-    contentLabel = 'Shortcuts'
+    contentLabel = "Shortcuts"
   >
     <Shortcuts appShortcuts = {getShortcuts(platform)} />
   </ReactModal>