diff --git a/browser/components/SideNavFilter.js b/browser/components/SideNavFilter.js
index d6bc7642..df019c7e 100644
--- a/browser/components/SideNavFilter.js
+++ b/browser/components/SideNavFilter.js
@@ -15,7 +15,8 @@ import styles from './SideNavFilter.styl'
*/
const SideNavFilter = ({
isFolded, isHomeActive, handleAllNotesButtonClick,
- isStarredActive, handleStarredButtonClick, isTrashedActive, handleTrashedButtonClick
+ isStarredActive, handleStarredButtonClick, isTrashedActive, handleTrashedButtonClick, counterDelNote,
+ counterTotalNote, counterStarredNote
}) => (
)
diff --git a/browser/components/SideNavFilter.styl b/browser/components/SideNavFilter.styl
index 3c1e2185..38a56c9b 100644
--- a/browser/components/SideNavFilter.styl
+++ b/browser/components/SideNavFilter.styl
@@ -10,6 +10,9 @@
text-align left
overflow ellipsis
+.counters
+ float right
+
.menu-button--active
@extend .menu-button
color #e74c3c
diff --git a/browser/main/SideNav/index.js b/browser/main/SideNav/index.js
index 1e78c058..aa124b50 100644
--- a/browser/main/SideNav/index.js
+++ b/browser/main/SideNav/index.js
@@ -72,6 +72,9 @@ class SideNav extends React.Component {
isTrashedActive={isTrashedActive}
handleStarredButtonClick={(e) => this.handleStarredButtonClick(e)}
handleTrashedButtonClick={(e) => this.handleTrashedButtonClick(e)}
+ counterTotalNote={data.noteMap._map.size}
+ counterStarredNote={data.starredSet._set.size}
+ counterDelNote={data.trashedSet._set.size}
/>