Move left pane entirely to React

This commit is contained in:
Scott Nonnenberg 2019-01-14 13:49:58 -08:00
parent bf904ddd12
commit b3ac1373fa
142 changed files with 5016 additions and 3428 deletions

View file

@ -1,12 +1,14 @@
/* global _: false */
/* global Backbone: false */
/* global libphonenumber: false */
/* global ConversationController: false */
/* global libsignal: false */
/* global storage: false */
/* global textsecure: false */
/* global Whisper: false */
/* global
_,
i18n,
Backbone,
libphonenumber,
ConversationController,
libsignal,
storage,
textsecure,
Whisper
*/
/* eslint-disable more/no-then */
@ -138,6 +140,13 @@
this.typingRefreshTimer = null;
this.typingPauseTimer = null;
// Keep props ready
const generateProps = () => {
this.cachedProps = this.getProps();
};
this.on('change', generateProps);
generateProps();
},
isMe() {
@ -292,40 +301,37 @@
},
format() {
return this.cachedProps;
},
getProps() {
const { format } = PhoneNumber;
const regionCode = storage.get('regionCode');
const color = this.getColor();
return {
phoneNumber: format(this.id, {
ourRegionCode: regionCode,
}),
color,
avatarPath: this.getAvatarPath(),
name: this.getName(),
profileName: this.getProfileName(),
title: this.getTitle(),
};
},
getPropsForListItem() {
const typingKeys = Object.keys(this.contactTypingTimers || {});
const result = {
...this.format(),
id: this.id,
activeAt: this.get('active_at'),
avatarPath: this.getAvatarPath(),
color,
type: this.isPrivate() ? 'direct' : 'group',
isMe: this.isMe(),
conversationType: this.isPrivate() ? 'direct' : 'group',
lastUpdated: this.get('timestamp'),
unreadCount: this.get('unreadCount') || 0,
isSelected: this.isSelected,
isTyping: typingKeys.length > 0,
lastUpdated: this.get('timestamp'),
name: this.getName(),
profileName: this.getProfileName(),
timestamp: this.get('timestamp'),
title: this.getTitle(),
unreadCount: this.get('unreadCount') || 0,
phoneNumber: format(this.id, {
ourRegionCode: regionCode,
}),
lastMessage: {
status: this.get('lastMessageStatus'),
text: this.get('lastMessage'),
},
onClick: () => this.trigger('select', this),
};
return result;
@ -572,8 +578,8 @@
onMemberVerifiedChange() {
// If the verified state of a member changes, our aggregate state changes.
// We trigger both events to replicate the behavior of Backbone.Model.set()
this.trigger('change:verified');
this.trigger('change');
this.trigger('change:verified', this);
this.trigger('change', this);
},
toggleVerified() {
if (this.isVerified()) {
@ -1798,7 +1804,7 @@
if (this.isPrivate()) {
return this.get('name');
}
return this.get('name') || 'Unknown group';
return this.get('name') || i18n('unknownGroup');
},
getTitle() {
@ -1990,14 +1996,14 @@
if (!record) {
// User was not previously typing before. State change!
this.trigger('typing-update');
this.trigger('change');
this.trigger('change', this);
}
} else {
delete this.contactTypingTimers[identifier];
if (record) {
// User was previously typing, and is no longer. State change!
this.trigger('typing-update');
this.trigger('change');
this.trigger('change', this);
}
}
},
@ -2012,7 +2018,7 @@
// User was previously typing, but timed out or we received message. State change!
this.trigger('typing-update');
this.trigger('change');
this.trigger('change', this);
}
},
});
@ -2034,21 +2040,6 @@
);
this.reset([]);
},
async search(providedQuery) {
let query = providedQuery.trim().toLowerCase();
query = query.replace(/[+-.()]*/g, '');
if (query.length === 0) {
return;
}
const collection = await window.Signal.Data.searchConversations(query, {
ConversationCollection: Whisper.ConversationCollection,
});
this.reset(collection.models);
},
});
Whisper.Conversation.COLORS = COLORS.concat(['grey', 'default']).join(' ');

View file

@ -83,6 +83,42 @@
this.on('unload', this.unload);
this.on('expired', this.onExpired);
this.setToExpire();
// Keep props ready
const generateProps = () => {
if (this.isExpirationTimerUpdate()) {
this.propsForTimerNotification = this.getPropsForTimerNotification();
} else if (this.isKeyChange()) {
this.propsForSafetyNumberNotification = this.getPropsForSafetyNumberNotification();
} else if (this.isVerifiedChange()) {
this.propsForVerificationNotification = this.getPropsForVerificationNotification();
} else if (this.isEndSession()) {
this.propsForResetSessionNotification = this.getPropsForResetSessionNotification();
} else if (this.isGroupUpdate()) {
this.propsForGroupNotification = this.getPropsForGroupNotification();
} else {
this.propsForSearchResult = this.getPropsForSearchResult();
this.propsForMessage = this.getPropsForMessage();
}
};
this.on('change', generateProps);
const applicableConversationChanges =
'change:color change:name change:number change:profileName change:profileAvatar';
const conversation = this.getConversation();
const fromContact = this.getIncomingContact();
this.listenTo(conversation, applicableConversationChanges, generateProps);
if (fromContact) {
this.listenTo(
fromContact,
applicableConversationChanges,
generateProps
);
}
generateProps();
},
idForLogging() {
return `${this.get('source')}.${this.get('sourceDevice')} ${this.get(
@ -387,6 +423,35 @@
return 'sending';
},
getPropsForSearchResult() {
const fromNumber = this.getSource();
const from = this.findAndFormatContact(fromNumber);
if (fromNumber === this.OUR_NUMBER) {
from.isMe = true;
}
const toNumber = this.get('conversationId');
let to = this.findAndFormatContact(toNumber);
if (toNumber === this.OUR_NUMBER) {
to.isMe = true;
} else if (fromNumber === toNumber) {
to = {
isMe: true,
};
}
return {
from,
to,
isSelected: this.isSelected,
id: this.id,
conversationId: this.get('conversationId'),
receivedAt: this.get('received_at'),
snippet: this.get('snippet'),
};
},
getPropsForMessage() {
const phoneNumber = this.getSource();
const contact = this.findAndFormatContact(phoneNumber);
@ -495,7 +560,7 @@
// Would be nice to do this before render, on initial load of message
if (!window.isSignalAccountCheckComplete(firstNumber)) {
window.checkForSignalAccount(firstNumber).then(() => {
this.trigger('change');
this.trigger('change', this);
});
}