sidebar: Update domains on tab drag.

app/renderer/js/main.ts

@@ -94,6 +94,7 @@ class ServerManagerView {
 	$fullscreenEscapeKey: string;
 	loading: AnyObject;
 	activeTabIndex: number;
+	servers: ServerOrFunctionalTab[];
 	tabs: ServerOrFunctionalTab[];
 	functionalTabs: AnyObject;
 	tabIndex: number;
@@ -134,6 +135,7 @@ class ServerManagerView {
 
 		this.loading = {};
 		this.activeTabIndex = -1;
+		this.servers = [];
 		this.tabs = [];
 		this.presetOrgs = [];
 		this.functionalTabs = {};
@@ -241,10 +243,32 @@ class ServerManagerView {
 		}
 	}
 
+	onEnd(): void {
+		const newServers: any[] | ServerOrFunctionalTab[] = [];
+		const tabMap: any = {};
+		const tabElements = document.querySelectorAll('#tabs-container .tab');
+		tabElements.forEach((el, index) => {
+			const oldIndex = Number(el.getAttribute('data-tab-id')) % this.servers.length;
+			tabMap[index] = oldIndex;
+			newServers.push(this.servers[index]);
+			el.setAttribute('data-tab-id', index.toString());
+		});
+
+		for (let server = 0; server < newServers.length; ++server) {
+			DomainUtil.updateDomain(server, newServers[tabMap[server]]);
+		}
+
+		this.reloadView();
+	}
+
 	initSidebar(): void {
 		const showSidebar = ConfigUtil.getConfigItem('showSidebar', true);
 		this.toggleSidebar(showSidebar);
-		this.$sortable = sortable.create(this.$drag, {});
+		// Allow dragging of server tabs and update the data-tab-id
+		this.$sortable = sortable.create(this.$drag, {
+			dataIdAttr: 'data-sortable-id',
+			onEnd: this.onEnd.bind(this)
+		});
 	}
 
 	async queueDomain(domain: any): Promise<boolean> {
@@ -314,6 +338,7 @@ class ServerManagerView {
 
 	initTabs(): void {
 		const servers = DomainUtil.getDomains();
+		this.servers = servers;
 		if (servers.length > 0) {
 			for (let i = 0; i < servers.length; i++) {
 				this.initServer(servers[i], i);