Add CollapseButton component.

app/renderer/css/main.css

@@ -254,4 +254,8 @@ webview:focus {
     height: 100%;
     width: 100%;
     position: relative;
+}
+
+.hidden {
+    display: none !important;
 }

app/renderer/js/components/collapse-button.js

@@ -0,0 +1,37 @@
+'use strict';
+
+const BaseComponent = require(__dirname + '/../components/base.js');
+
+class CollapseButton extends BaseComponent {
+	constructor(props) {
+		super();
+		this.init();
+	}
+
+	init() {
+        this.sidebarShown = true;
+
+        this.$sidebar = document.getElementById('sidebar');
+        this.$el = document.getElementById('collapse-button');
+        this.$icon = this.$el.querySelector('i');
+
+		this.registerListeners();
+	}
+
+	registerListeners() {
+		this.$el.addEventListener('click', this.toggleSidebar.bind(this));
+	}
+
+    toggleSidebar() {
+        if (this.sidebarShown) {
+            this.$sidebar.classList.add('hidden');
+            this.$icon.innerHTML = 'keyboard_arrow_right';
+        } else {
+            this.$sidebar.classList.remove('hidden');
+            this.$icon.innerHTML = 'keyboard_arrow_left';
+        }
+        this.sidebarShown = !this.sidebarShown;
+    }
+}
+
+module.exports = CollapseButton;

app/renderer/js/main.js

@@ -5,6 +5,7 @@ const {ipcRenderer} = require('electron');
 
 const DomainUtil = require(__dirname + '/js/utils/domain-util.js');
 const WebView = require(__dirname + '/js/components/webview.js');
+const CollapseButton = require(__dirname + '/js/components/collapse-button.js');
 const ServerTab = require(__dirname + '/js/components/server-tab.js');
 const FunctionalTab = require(__dirname + '/js/components/functional-tab.js');
 
@@ -27,6 +28,8 @@ class ServerManagerView {
 	}
 
 	init() {
+		new CollapseButton();
+
 		this.initTabs();
 		this.initActions();
 		this.registerIpcs();