function populateServerSelectionList() {
	const servers = localstorage_credentials.getServers();

	let nodes = [];
	for (let server of servers) {
		const li = document.createElement("li");
		const endpoint = humanReadableEndpoint(server.endpoint);
		li.innerText = `${server.login_id}@${endpoint} `;

		const logoutButton = document.createElement("button");
		logoutButton.className = "logout";
		logoutButton.innerText = "Log out";
		logoutButton.addEventListener("click", e => logOut(server.endpoint, e.currentTarget));

		li.appendChild(logoutButton);
		nodes.push(li);
	}
	byId("server_selection_list").innerHTML = "";
	byId("server_selection_list").append(...nodes);
}

function populateChannelList() {
	async function addChannelItems(client) {
		const teams = await client.myTeams();

		for (let team of teams) {
			let nodes = [];
			const channels = await client.myChannels(team.id);
			for (let channel of channels) {
				const li = document.createElement("li");
				const a = document.createElement("a");
				a.href = "javascript:void(0)";
				const titleAndElements = channelNameElements(team, channel);
				if (!titleAndElements) continue;
				a.title = titleAndElements[0];
				a.append(...titleAndElements[1]);

				a.addEventListener("click", () => switchToChannel(client, team, channel));

				li.appendChild(a);
				li.dataset["id"] = channel.id;
				nodes.push(li);
			}
			byId("channel_list").append(...nodes);
		}
	}

	byId("channel_list").innerHTML = "";
	const endpoints = localstorage_credentials.getServers().map(server => server.endpoint);
	for (let client of mm_client.getMultiple(endpoints)) {
		addChannelItems(client);
	}
}


pubsub.subscribe("MESSAGES_NEW", post => {
	const chan = currentChannel();
	if (!(post.endpoint === chan.endpoint && post.channel_id === chan.channel_id)) {
		// TODO mark channel unread
	}
});