From 3d0b3e759b198fdf13fd2da7cdcea7075b855354 Mon Sep 17 00:00:00 2001
From: cormoran <cormoran707@gmail.com>
Date: Mon, 27 Nov 2017 06:04:24 +0900
Subject: [PATCH] Fix surrogate pairs garbling on  folded SideNav

---
 browser/components/StorageItem.js   | 6 +++---
 browser/main/SideNav/StorageItem.js | 3 ++-
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/browser/components/StorageItem.js b/browser/components/StorageItem.js
index 7e8858e4..25be3c57 100644
--- a/browser/components/StorageItem.js
+++ b/browser/components/StorageItem.js
@@ -5,7 +5,7 @@ import PropTypes from 'prop-types'
 import React from 'react'
 import styles from './StorageItem.styl'
 import CSSModules from 'browser/lib/CSSModules'
-import { isNumber } from 'lodash'
+import _ from 'lodash'
 
 /**
  * @param {boolean} isActive
@@ -37,9 +37,9 @@ const StorageItem = ({
     <span styleName={isFolded
       ? 'folderList-item-name--folded' : 'folderList-item-name'
     }>
-      <text style={{color: folderColor, paddingRight: '10px'}}>{isActive ? <i className='fa fa-folder-open-o' /> : <i className='fa fa-folder-o' />}</text>{isFolded ? folderName.substring(0, 1) : folderName}
+      <text style={{color: folderColor, paddingRight: '10px'}}>{isActive ? <i className='fa fa-folder-open-o' /> : <i className='fa fa-folder-o' />}</text>{isFolded ? _.truncate(folderName, {length: 1, omission: ''}) : folderName}
     </span>
-    {(!isFolded && isNumber(noteCount)) &&
+    {(!isFolded && _.isNumber(noteCount)) &&
       <span styleName='folderList-item-noteCount'>{noteCount}</span>
     }
     {isFolded &&
diff --git a/browser/main/SideNav/StorageItem.js b/browser/main/SideNav/StorageItem.js
index 78257922..bb04cbac 100644
--- a/browser/main/SideNav/StorageItem.js
+++ b/browser/main/SideNav/StorageItem.js
@@ -9,6 +9,7 @@ import RenameFolderModal from 'browser/main/modals/RenameFolderModal'
 import dataApi from 'browser/main/lib/dataApi'
 import StorageItemChild from 'browser/components/StorageItem'
 import eventEmitter from 'browser/main/lib/eventEmitter'
+import _ from 'lodash'
 
 const { remote } = require('electron')
 const { Menu, MenuItem, dialog } = remote
@@ -246,7 +247,7 @@ class StorageItem extends React.Component {
             onClick={(e) => this.handleHeaderInfoClick(e)}
           >
             <span styleName='header-info-name'>
-              {isFolded ? storage.name.substring(0, 1) : storage.name}
+              {isFolded ? _.truncate(storage.name, {length: 1, omission: ''}) : storage.name}
             </span>
             {isFolded &&
               <span styleName='header-info--folded-tooltip'>