Add the ability to close for functional tabs.

app/renderer/js/components/functional-tab.js

@@ -9,12 +9,39 @@ class FunctionalTab extends Tab {
 
 	template() {
 		return `<div class="tab">
-					<div class="server-tab-badge"></div>
+					<div class="server-tab-badge close-button">
+						<i class="material-icons">close</i>
+					</div>
 					<div class="server-tab functional-tab">
-						<i class="material-icons md-48">${this.props.materialIcon}</i>
+						<i class="material-icons">${this.props.materialIcon}</i>
 					</div>
 				</div>`;
 	}
+	
+	init() {
+		this.$el = this.generateNodeFromTemplate(this.template());
+		this.props.$root.appendChild(this.$el);
+
+		this.$closeButton = this.$el.getElementsByClassName('server-tab-badge')[0];
+		this.registerListeners();
+	}
+
+	registerListeners() {
+		super.registerListeners();
+
+		this.$el.addEventListener('mouseover', () => {
+			this.$closeButton.classList.add('active');
+		});
+
+		this.$el.addEventListener('mouseout', () => {
+			this.$closeButton.classList.remove('active');
+		});
+
+		this.$closeButton.addEventListener('click', (e) => {
+			this.props.onDestroy();
+			e.stopPropagation();
+		});
+	}
 }
 
 module.exports = FunctionalTab;

app/renderer/js/components/server-tab.js

@@ -13,6 +13,23 @@ class ServerTab extends Tab {
 					<div class="server-tab" style="background-image: url(${this.props.icon});"></div>
 				</div>`;
 	}
+
+	init() {
+		super.init();
+
+		this.$badge = this.$el.getElementsByClassName('server-tab-badge')[0];
+	}
+
+	updateBadge(count) {
+		if (count > 0) {
+			const formattedCount = count > 999 ? '1K+' : count;
+
+			this.$badge.innerHTML = formattedCount;
+			this.$badge.classList.add('active');
+		} else {
+			this.$badge.classList.remove('active');
+		}
+	}
 }
 
 module.exports = ServerTab;

app/renderer/js/components/tab.js

@@ -13,23 +13,11 @@ class Tab extends BaseComponent {
 
 	init() {
 		this.$el = this.generateNodeFromTemplate(this.template());
-		this.$badge = this.$el.getElementsByClassName('server-tab-badge')[0];
 		this.props.$root.appendChild(this.$el);
 
 		this.registerListeners();
 	}
 
-	updateBadge(count) {
-		if (count > 0) {
-			const formattedCount = count > 999 ? '1K+' : count;
-
-			this.$badge.innerHTML = formattedCount;
-			this.$badge.classList.add('active');
-		} else {
-			this.$badge.classList.remove('active');
-		}
-	}
-
 	registerListeners() {
 		this.$el.addEventListener('click', this.props.onClick);
 	}

app/renderer/js/components/webview.js

@@ -21,7 +21,6 @@ class WebView extends BaseComponent {
 
 	template() {
 		return `<webview
-					id="webview-${this.props.index}"
 					class="disabled"
 					src="${this.props.url}"
 					${this.props.nodeIntegration ? 'nodeIntegration' : ''}