Everything is immutable

client/src/js/components/App.jsx

@@ -6,9 +6,11 @@ var Navigation = Router.Navigation;
 
 var TabList = require('./TabList.jsx');
 var routeActions = require('../actions/route');
+var PureMixin = require('../mixins/pure');
 
 var App = React.createClass({
 	mixins: [
+		PureMixin,
 		Navigation,
 		Reflux.listenTo(routeActions.navigate, 'navigate')
 	],

client/src/js/components/ChatTitle.jsx

@@ -7,9 +7,11 @@ var serverActions = require('../actions/server');
 var channelActions = require('../actions/channel');
 var searchActions = require('../actions/search');
 var privateChatActions = require('../actions/privateChat');
+var PureMixin = require('../mixins/pure');
 
 var ChatTitle = React.createClass({
     mixins: [
+        PureMixin,
         Reflux.listenTo(channelStore, 'channelsChanged'),
         Reflux.listenTo(selectedTabStore, 'selectedTabChanged')
     ],

client/src/js/components/Connect.jsx

@@ -3,8 +3,11 @@ var _ = require('lodash');
 
 var serverActions = require('../actions/server');
 var channelActions = require('../actions/channel');
+var PureMixin = require('../mixins/pure');
 
 var Connect = React.createClass({
+	mixins: [PureMixin],
+
 	getInitialState() {
 		return {
 			showOptionals: false

client/src/js/components/TabList.jsx

@@ -7,9 +7,11 @@ var channelStore = require('../stores/channel');
 var privateChatStore = require('../stores/privateChat');
 var serverStore = require('../stores/server');
 var routeActions = require('../actions/route');
+var PureMixin = require('../mixins/pure');
 
 var TabList = React.createClass({
 	mixins: [
+		PureMixin,
 		Reflux.connect(serverStore, 'servers'),
 		Reflux.connect(channelStore, 'channels'),
 		Reflux.connect(privateChatStore, 'privateChats')
@@ -32,36 +34,41 @@ var TabList = React.createClass({
 	},
 
 	render() {
-		var tabs = this.state.channels.map((server, address) => {
-			var serverTabs = server.map((channel, name) => {
-				return (
-					<TabListItem 
+		var tabs = [];
+
+		this.state.channels.forEach((server, address) => {
+			tabs.push(
+				<TabListItem 
+					key={address}
+					server={address} 
+					channel={null}
+					name={this.state.servers.getIn([address, 'name'])}>
+				</TabListItem>
+			);
+
+			server.forEach((channel, name) => {
+				tabs.push(
+					<TabListItem
+						key={address + name} 
 						server={address} 
 						channel={name}
 						name={name}>
 					</TabListItem>
 				);
-			}).toArray();
-
-			_.each(this.state.privateChats[address], (chat, nick) => {
-				serverTabs.push(
-					<TabListItem 
-						server={address} 
-						channel={nick}
-						name={nick}>
-					</TabListItem>
-				);	
 			});
 
-			serverTabs.unshift(
-				<TabListItem 
-					server={address} 
-					channel={null}
-					name={serverStore.getName(address)}>
-				</TabListItem>
-			);
-
-			return serverTabs;
+			if (this.state.privateChats.has(address)) {
+				this.state.privateChats.get(address).forEach(nick => {
+					tabs.push(
+						<TabListItem 
+							key={address + nick}
+							server={address} 
+							channel={nick}
+							name={nick}>
+						</TabListItem>
+					);
+				});
+			}
 		});
 
 		return (

client/src/js/components/UserList.jsx

@@ -6,9 +6,11 @@ var Infinite = require('react-infinite');
 var UserListItem = require('./UserListItem.jsx');
 var channelStore = require('../stores/channel');
 var selectedTabStore = require('../stores/selectedTab');
+var PureMixin = require('../mixins/pure');
 
 var UserList = React.createClass({
 	mixins: [
+		PureMixin,
 		Reflux.listenTo(channelStore, 'channelsChanged'),
 		Reflux.listenTo(selectedTabStore, 'selectedTabChanged')
 	],
@@ -61,7 +63,7 @@ var UserList = React.createClass({
 			}).toArray(); // React Infinite uses .length
 		}
 
-		if (users.length !== 1) {
+		if (users.length > 1) {
 			return (
 				<div className="userlist" style={style}>
 					<Infinite containerHeight={this.state.height} elementHeight={24}>

client/src/js/components/UserListItem.jsx

@@ -3,8 +3,11 @@ var React = require('react');
 var selectedTabStore = require('../stores/selectedTab');
 var privateChatActions = require('../actions/privateChat');
 var tabActions = require('../actions/tab');
+var PureMixin = require('../mixins/pure');
 
 var UserListItem = React.createClass({
+    mixins: [PureMixin],
+    
 	handleClick() {
 		var server = selectedTabStore.getServer();
 

client/src/js/stores/channel.js

@@ -39,13 +39,15 @@ function loadUser(nick) {
 }
 
 function updateRenderName(user) {
+	var name = user.nick;
+
 	if (user.mode.indexOf('o') !== -1) {
-		return user.set('renderName', '@' + user.nick);
+		name = '@' + name;
 	} else if (user.mode.indexOf('v') !== -1) {
-		return user.set('renderName', '+' + user.nick);
-	} else {
-		return user.set('renderName', user.nick);
+		name = '+' + name;
 	}
+
+	return user.set('renderName', name);
 }
 
 function sortUsers(a, b) {
@@ -188,7 +190,7 @@ var channelStore = Reflux.createStore({
 	},
 
 	getTopic(server, channel) {
-		return channels.getIn([server, channel, 'topic']) || null;
+		return channels.getIn([server, channel, 'topic']);
 	},
 
 	getState() {

client/src/js/stores/privateChat.js

@@ -1,24 +1,12 @@
 var Reflux = require('reflux');
+var Immutable = require('immutable');
 
 var actions = require('../actions/privateChat');
 var messageActions = require('../actions/message');
 var serverActions = require('../actions/server');
 
-var privateChats = {};
-
-function initChat(server, nick) {
-	if (!(server in privateChats)) {
-		privateChats[server] = {};
-		privateChats[server][nick] = {};
-
-		return true;
-	} else if (!(nick in privateChats[server])) {
-		privateChats[server][nick] = {};
-
-		return true;
-	}
-	return false;
-}
+var privateChats = Immutable.Map();
+var empty = Immutable.List();
 
 var privateChatStore = Reflux.createStore({
 	init() {
@@ -28,13 +16,12 @@ var privateChatStore = Reflux.createStore({
 	},
 
 	open(server, nick) {
-		if (initChat(server, nick)) {
-			this.trigger(privateChats);
-		}
+		privateChats = privateChats.update(server, empty, chats => chats.push(nick));
+		this.trigger(privateChats);
 	},
 
 	close(server, nick) {
-		delete privateChats[server][nick];
+		privateChats = privateChats.update(server, chats => chats.delete(chats.indexOf(nick)));
 		this.trigger(privateChats);
 	},
 
@@ -45,7 +32,7 @@ var privateChatStore = Reflux.createStore({
 	},
 
 	disconnect(server) {
-		delete privateChats[server];
+		privateChats = privateChats.delete(server);
 		this.trigger(privateChats);
 	},
 

client/src/js/stores/search.js

@@ -3,28 +3,30 @@ var Immutable = require('immutable');
 
 var actions = require('../actions/search');
 
-var state = Immutable.Map({
+var Search = Immutable.Record({
 	show: false,
 	results: Immutable.List()
 });
 
+var search = new Search();
+
 var searchStore = Reflux.createStore({
 	init() {
 		this.listenToMany(actions);
 	},
 
 	searchDone(results) {
-		state = state.set('results', Immutable.List(results));
-		this.trigger(state);
+		search = search.set('results', Immutable.List(results));
+		this.trigger(search);
 	},
 
 	toggle() {
-		state = state.update('show', show => !show);
-		this.trigger(state);
+		search = search.set('show', !search.show);
+		this.trigger(search);
 	},
 
 	getState() {
-		return state;
+		return search;
 	}
 });
 

client/src/js/stores/server.js

@@ -1,10 +1,15 @@
 var Reflux = require('reflux');
+var Immutable = require('immutable');
 var _ = require('lodash');
 
 var actions = require('../actions/server');
 var tabActions = require('../actions/tab');
 
-var servers = {};
+var servers = Immutable.Map();
+var Server = Immutable.Record({
+	nick: null,
+	name: null
+});
 
 var serverStore = Reflux.createStore({
 	init() {
@@ -17,45 +22,38 @@ var serverStore = Reflux.createStore({
 			server = server.slice(0, i);
 		}
 
-		servers[server] = {
-			address: server,
+		servers = servers.set(server, new Server({
 			nick: nick,
 			name: opts.name || server
-		};
+		}));
 
 		this.trigger(servers);
 		tabActions.select(server);
 	},
 
 	disconnect(server) {
-		delete servers[server];
+		servers = servers.delete(server);
 		this.trigger(servers);
 	},
 
 	setNick(nick, server) {
-		servers[server].nick = nick;
+		servers = servers.update(server, s => s.set('nick', nick));
 		this.trigger(servers);
 	},
 
 	load(storedServers) {
 		_.each(storedServers, function(server) {
-			servers[server.address] = server;
+			servers = servers.set(server.address, new Server(server));
 		});
 		this.trigger(servers);
 	},
 
 	getNick(server) {
-		if (servers[server]) {
-			return servers[server].nick;
-		}
-		return null;
+		return servers.getIn([server, 'nick']);
 	},
 
 	getName(server) {
-		if (servers[server]) {
-			return servers[server].name;
-		}
-		return null;
+		return servers.getIn([server, 'name']);
 	},
 
 	getState() {