import React from 'react';
import { createSelector } from 'reselect';
import has from 'lodash/has';
import {
findBreakpoints,
messageHeight,
linkify,
timestamp,
isChannel,
formatDate,
unix
} from 'utils';
import stringToRGB from 'utils/color';
import colorify from 'utils/colorify';
import createReducer from 'utils/createReducer';
import { getApp } from './app';
import { getSelectedTab } from './tab';
import * as actions from './actions';
export const getMessages = state => state.messages;
export const getSelectedMessages = createSelector(
getSelectedTab,
getMessages,
(tab, messages) => {
const target = tab.name || tab.server;
if (has(messages, [tab.server, target])) {
return messages[tab.server][target];
}
return [];
}
);
export const getHasMoreMessages = createSelector(
getSelectedMessages,
messages => {
const first = messages[0];
return first && first.next;
}
);
function init(state, server, tab) {
if (!state[server]) {
state[server] = {};
}
if (!state[server][tab]) {
state[server][tab] = [];
}
}
const collapsedEvents = ['join', 'part', 'quit'];
function shouldCollapse(msg1, msg2) {
return (
msg1.events &&
msg2.events &&
collapsedEvents.indexOf(msg1.events[0].type) !== -1 &&
collapsedEvents.indexOf(msg2.events[0].type) !== -1
);
}
const eventVerbs = {
join: 'joined the channel',
part: 'left the channel',
quit: 'quit'
};
function renderNick(nick, type = '') {
const style = {
color: stringToRGB(nick),
fontWeight: 400
};
return (
{nick}
);
}
function renderMore(count, type) {
return (
{`${count} more`}
);
}
function renderEvent(event, type, nicks) {
const ending = eventVerbs[type];
if (nicks.length === 1) {
event.push(renderNick(nicks[0], type));
event.push(` ${ending}`);
}
if (nicks.length === 2) {
event.push(renderNick(nicks[0], type));
event.push(' and ');
event.push(renderNick(nicks[1], type));
event.push(` ${ending}`);
}
if (nicks.length > 2) {
event.push(renderNick(nicks[0], type));
event.push(', ');
event.push(renderNick(nicks[1], type));
event.push(' and ');
event.push(renderMore(nicks.length - 2, type));
event.push(` ${ending}`);
}
}
function renderEvents(events) {
const first = events[0];
if (first.type === 'nick') {
const [oldNick, newNick] = first.params;
return [renderNick(oldNick), ' changed nick to ', renderNick(newNick)];
}
if (first.type === 'topic') {
const [nick, newTopic] = first.params;
const topic = colorify(linkify(newTopic));
if (!topic) {
return [renderNick(nick), ' cleared the topic'];
}
const result = [renderNick(nick), ' changed the topic to: '];
if (Array.isArray(topic)) {
result.push(...topic);
} else {
result.push(topic);
}
return result;
}
const byType = {};
for (let i = events.length - 1; i >= 0; i--) {
const event = events[i];
const [nick] = event.params;
if (!byType[event.type]) {
byType[event.type] = [nick];
} else if (byType[event.type].indexOf(nick) === -1) {
byType[event.type].push(nick);
}
}
const result = [];
if (byType.join) {
renderEvent(result, 'join', byType.join);
}
if (byType.part) {
if (result.length > 1) {
result[result.length - 1] += ', ';
}
renderEvent(result, 'part', byType.part);
}
if (byType.quit) {
if (result.length > 1) {
result[result.length - 1] += ', ';
}
renderEvent(result, 'quit', byType.quit);
}
return result;
}
let nextID = 0;
function initMessage(
state,
message,
server,
tab,
wrapWidth,
charWidth,
windowWidth,
prepend
) {
const messages = state[server][tab];
if (messages.length > 0 && !prepend) {
const lastMessage = messages[messages.length - 1];
if (shouldCollapse(lastMessage, message)) {
lastMessage.events.push(message.events[0]);
lastMessage.content = renderEvents(lastMessage.events);
[lastMessage.breakpoints, lastMessage.length] = findBreakpoints(
lastMessage.content
);
lastMessage.height = messageHeight(
lastMessage,
wrapWidth,
charWidth,
6 * charWidth,
windowWidth
);
return false;
}
}
if (message.time) {
message.date = new Date(message.time * 1000);
} else {
message.date = new Date();
}
message.time = timestamp(message.date);
if (!message.id) {
message.id = nextID;
nextID++;
}
if (tab.charAt(0) === '#') {
message.channel = true;
}
if (message.events) {
message.type = 'info';
message.content = renderEvents(message.events);
} else {
message.content = message.content || '';
// Collapse multiple adjacent spaces into a single one
message.content = message.content.replace(/\s\s+/g, ' ');
if (message.content.indexOf('\x01ACTION') === 0) {
const { from } = message;
message.from = null;
message.type = 'action';
message.content = from + message.content.slice(7, -1);
}
}
if (!message.events) {
message.content = colorify(linkify(message.content));
}
[message.breakpoints, message.length] = findBreakpoints(message.content);
message.height = messageHeight(
message,
wrapWidth,
charWidth,
6 * charWidth,
windowWidth
);
message.indent = 6 * charWidth;
return true;
}
function createDateMessage(date) {
const message = {
id: nextID,
type: 'date',
content: formatDate(date),
height: 40
};
nextID++;
return message;
}
function isSameDay(d1, d2) {
return (
d1.getDate() === d2.getDate() &&
d1.getMonth() === d2.getMonth() &&
d1.getFullYear() === d2.getFullYear()
);
}
function reducerPrependMessages(
state,
messages,
server,
tab,
wrapWidth,
charWidth,
windowWidth
) {
const msgs = [];
for (let i = 0; i < messages.length; i++) {
const message = messages[i];
initMessage(
state,
message,
server,
tab,
wrapWidth,
charWidth,
windowWidth,
true
);
if (i > 0 && !isSameDay(messages[i - 1].date, message.date)) {
msgs.push(createDateMessage(message.date));
}
msgs.push(message);
}
const m = state[server][tab];
if (m.length > 0) {
const lastNewMessage = msgs[msgs.length - 1];
const firstMessage = m[0];
if (
firstMessage.date &&
!isSameDay(firstMessage.date, lastNewMessage.date)
) {
msgs.push(createDateMessage(firstMessage.date));
}
}
m.unshift(...msgs);
}
function reducerAddMessage(message, server, tab, state) {
const messages = state[server][tab];
if (messages.length > 0) {
const lastMessage = messages[messages.length - 1];
if (lastMessage.date && !isSameDay(lastMessage.date, message.date)) {
messages.push(createDateMessage(message.date));
}
}
messages.push(message);
}
export default createReducer(
{},
{
[actions.ADD_MESSAGE](
state,
{ server, tab, message, wrapWidth, charWidth, windowWidth }
) {
init(state, server, tab);
const shouldAdd = initMessage(
state,
message,
server,
tab,
wrapWidth,
charWidth,
windowWidth
);
if (shouldAdd) {
reducerAddMessage(message, server, tab, state);
}
},
[actions.ADD_MESSAGES](
state,
{ server, tab, messages, prepend, wrapWidth, charWidth, windowWidth }
) {
if (prepend) {
init(state, server, tab);
reducerPrependMessages(
state,
messages,
server,
tab,
wrapWidth,
charWidth,
windowWidth
);
} else {
if (!messages[0].tab) {
init(state, server, tab);
}
messages.forEach(message => {
if (message.tab) {
init(state, server, message.tab);
}
const shouldAdd = initMessage(
state,
message,
server,
message.tab || tab,
wrapWidth,
charWidth,
windowWidth
);
if (shouldAdd) {
reducerAddMessage(message, server, message.tab || tab, state);
}
});
}
},
[actions.DISCONNECT](state, { server }) {
delete state[server];
},
[actions.PART](state, { server, channels }) {
channels.forEach(channel => delete state[server][channel]);
},
[actions.CLOSE_PRIVATE_CHAT](state, { server, nick }) {
delete state[server][nick];
},
[actions.socket.CHANNEL_FORWARD](state, { server, old }) {
if (state[server]) {
delete state[server][old];
}
},
[actions.UPDATE_MESSAGE_HEIGHT](
state,
{ wrapWidth, charWidth, windowWidth }
) {
Object.keys(state).forEach(server =>
Object.keys(state[server]).forEach(target =>
state[server][target].forEach(message => {
if (message.type === 'date') {
return;
}
message.height = messageHeight(
message,
wrapWidth,
charWidth,
6 * charWidth,
windowWidth
);
})
)
);
},
[actions.socket.SERVERS](state, { data }) {
if (data) {
data.forEach(({ host }) => {
state[host] = {};
});
}
}
}
);
export function getMessageTab(server, to) {
if (!to || to === '*' || (!isChannel(to) && to.indexOf('.') !== -1)) {
return server;
}
return to;
}
export function fetchMessages() {
return (dispatch, getState) => {
const state = getState();
const first = getSelectedMessages(state)[0];
if (!first) {
return;
}
const tab = state.tab.selected;
if (tab.name) {
dispatch({
type: actions.FETCH_MESSAGES,
socket: {
type: 'fetch_messages',
data: {
server: tab.server,
channel: tab.name,
next: first.id
}
}
});
}
};
}
export function addFetchedMessages(server, tab) {
return {
type: actions.ADD_FETCHED_MESSAGES,
server,
tab
};
}
export function updateMessageHeight(wrapWidth, charWidth, windowWidth) {
return {
type: actions.UPDATE_MESSAGE_HEIGHT,
wrapWidth,
charWidth,
windowWidth
};
}
export function sendMessage(content, to, server) {
return (dispatch, getState) => {
const state = getState();
const { wrapWidth, charWidth, windowWidth } = getApp(state);
dispatch({
type: actions.ADD_MESSAGE,
server,
tab: to,
message: {
from: state.servers[server].nick,
content
},
wrapWidth,
charWidth,
windowWidth,
socket: {
type: 'message',
data: { content, to, server }
}
});
};
}
export function addMessage(message, server, to) {
const tab = getMessageTab(server, to);
return (dispatch, getState) => {
const { wrapWidth, charWidth, windowWidth } = getApp(getState());
dispatch({
type: actions.ADD_MESSAGE,
server,
tab,
message,
wrapWidth,
charWidth,
windowWidth
});
};
}
export function addMessages(messages, server, to, prepend, next) {
const tab = getMessageTab(server, to);
return (dispatch, getState) => {
const state = getState();
if (next) {
messages[0].id = next;
messages[0].next = true;
}
const { wrapWidth, charWidth, windowWidth } = getApp(state);
dispatch({
type: actions.ADD_MESSAGES,
server,
tab,
messages,
prepend,
wrapWidth,
charWidth,
windowWidth
});
};
}
export function addEvent(server, tab, type, ...params) {
return addMessage(
{
type: 'info',
events: [
{
type,
params,
time: unix()
}
]
},
server,
tab
);
}
export function broadcastEvent(server, channels, type, ...params) {
const now = unix();
return addMessages(
channels.map(channel => ({
type: 'info',
tab: channel,
events: [
{
type,
params,
time: now
}
]
})),
server
);
}
export function broadcast(message, server, channels) {
return addMessages(
channels.map(channel => ({
tab: channel,
content: message,
type: 'info'
})),
server
);
}
export function print(message, server, channel, type) {
if (Array.isArray(message)) {
return addMessages(
message.map(line => ({
content: line,
type
})),
server,
channel
);
}
return addMessage(
{
content: message,
type
},
server,
channel
);
}
export function inform(message, server, channel) {
return print(message, server, channel, 'info');
}
export function runCommand(command, channel, server) {
return {
type: actions.COMMAND,
command,
channel,
server
};
}
export function raw(message, server) {
return {
type: actions.RAW,
message,
server,
socket: {
type: 'raw',
data: { message, server }
}
};
}