From a563dc8b379a45ccd7943078e6f8ae482bda7333 Mon Sep 17 00:00:00 2001 From: Scott Nonnenberg Date: Mon, 16 Apr 2018 18:17:38 -0700 Subject: [PATCH] Style Guide: Additional message examples, a few fixes to enable --- js/models/messages.js | 8 +- js/views/message_view.js | 6 +- test/styleguide/legacy_bridge.js | 8 + test/styleguide/legacy_templates.js | 7 + ts/components/conversation/Message.md | 235 +++++++++++++++++++++++++- ts/styleguide/StyleGuideUtil.ts | 15 ++ 6 files changed, 272 insertions(+), 7 deletions(-) diff --git a/js/models/messages.js b/js/models/messages.js index fbaada39a..b2800a1fc 100644 --- a/js/models/messages.js +++ b/js/models/messages.js @@ -207,12 +207,12 @@ return ConversationController.getUnsafe(this.get('conversationId')); }, getExpirationTimerUpdateSource() { - if (this.isExpirationTimerUpdate()) { - const conversationId = this.get('expirationTimerUpdate').source; - return ConversationController.getOrCreate(conversationId, 'private'); + if (!this.isExpirationTimerUpdate()) { + throw new Error('Message is not a timer update!'); } - return Promise.resolve(); + const conversationId = this.get('expirationTimerUpdate').source; + return ConversationController.getOrCreate(conversationId, 'private'); }, getContact() { let conversationId = this.get('source'); diff --git a/js/views/message_view.js b/js/views/message_view.js index f49189aac..760d7cfe7 100644 --- a/js/views/message_view.js +++ b/js/views/message_view.js @@ -45,8 +45,10 @@ tagName: 'span', className: 'some-failed', templateName: 'some-failed', - render_attributes: { - someFailed: i18n('someRecipientsFailed'), + render_attributes() { + return { + someFailed: i18n('someRecipientsFailed'), + }; }, }); const TimerView = Whisper.View.extend({ diff --git a/test/styleguide/legacy_bridge.js b/test/styleguide/legacy_bridge.js index b23b045c8..ff7373dbb 100644 --- a/test/styleguide/legacy_bridge.js +++ b/test/styleguide/legacy_bridge.js @@ -35,6 +35,14 @@ window.Signal.Migrations = { next(); }, version: 1, + }, { + migrate: (transaction, next) => { + console.log('migration version 2'); + const messages = transaction.db.createObjectStore('messages'); + messages.createIndex('expires_at', 'expireTimer', { unique: false }); + next(); + }, + version: 2, }], loadAttachmentData: attachment => Promise.resolve(attachment), }; diff --git a/test/styleguide/legacy_templates.js b/test/styleguide/legacy_templates.js index 92c651fac..63e3c0e00 100644 --- a/test/styleguide/legacy_templates.js +++ b/test/styleguide/legacy_templates.js @@ -63,4 +63,11 @@ window.Whisper.View.Templates = {
{{ fileSize }}
`, + 'error-icon': ` + + + {{ #message }} + {{message}} + {{ /message }} + `, }; diff --git a/ts/components/conversation/Message.md b/ts/components/conversation/Message.md index aeaa9e119..bf294bfb2 100644 --- a/ts/components/conversation/Message.md +++ b/ts/components/conversation/Message.md @@ -40,7 +40,7 @@ const View = Whisper.MessageView; const outgoing = new Whisper.Message({ type: 'outgoing', body: 'How are you doing this fine day?', - sent_at: Date.now() - 18000, + sent_at: Date.now() - 200000, }); const incoming = new Whisper.Message(Object.assign({}, outgoing.attributes, { source: '+12025550003', @@ -59,6 +59,239 @@ const View = Whisper.MessageView; ``` +### With an error + +#### General error + +```jsx +const error = new Error('Something went wrong!'); + +const outgoing = new Whisper.Message({ + type: 'outgoing', + body: "This message won't get through...", + sent_at: Date.now() - 200000, + errors: [error], +}); +const incoming = new Whisper.Message(Object.assign({}, outgoing.attributes, { + source: '+12025550003', + type: 'incoming', + body: null, +})); +const View = Whisper.MessageView; + + + + +``` + +#### Network error (outgoing only) + +```jsx +const error = new Error('Something went wrong!'); +error.name = 'MessageError'; + +const outgoing = new Whisper.Message({ + type: 'outgoing', + sent_at: Date.now() - 200000, + errors: [error], + body: "This message won't get through...", +}); +const View = Whisper.MessageView; + + + +``` + +#### Network error, partial send in group (outgoing only) + +```jsx +const error = new Error('Something went wrong!'); +error.name = 'MessageError'; + +const outgoing = new Whisper.Message({ + type: 'outgoing', + sent_at: Date.now() - 200000, + errors: [error], + conversationId: util.groupNumber, + body: "This message won't get through...", +}); +const View = Whisper.MessageView; + + + +``` + +### Disappearing + +```jsx +const outgoing = new Whisper.Message({ + type: 'outgoing', + sent_at: Date.now() - 200000, + expireTimer: 120, + expirationStartTimestamp: Date.now() - 1000, + body: 'This message will self-destruct in two minutes', +}); +const incoming = new Whisper.Message(Object.assign({}, outgoing.attributes, { + source: '+12025550003', + type: 'incoming', +})); + +const View = Whisper.MessageView; + + + + +``` + +### Notfications + +#### Timer change + +```jsx +const fromOther = new Whisper.Message({ + type: 'incoming', + flags: textsecure.protobuf.DataMessage.Flags.EXPIRATION_TIMER_UPDATE, + source: '+12025550003', + sent_at: Date.now() - 200000, + expireTimer: 120, + expirationStartTimestamp: Date.now() - 1000, + expirationTimerUpdate: { + source: '+12025550003', + } +}); +const fromUpdate = new Whisper.Message({ + type: 'incoming', + flags: textsecure.protobuf.DataMessage.Flags.EXPIRATION_TIMER_UPDATE, + source: util.ourNumber, + sent_at: Date.now() - 200000, + expireTimer: 120, + expirationStartTimestamp: Date.now() - 1000, + expirationTimerUpdate: { + fromSync: true, + source: util.ourNumber, + } +}); +const fromMe = new Whisper.Message({ + type: 'incoming', + flags: textsecure.protobuf.DataMessage.Flags.EXPIRATION_TIMER_UPDATE, + source: util.ourNumber, + sent_at: Date.now() - 200000, + expireTimer: 120, + expirationStartTimestamp: Date.now() - 1000, + expirationTimerUpdate: { + source: util.ourNumber, + } +}); +const View = Whisper.ExpirationTimerUpdateView; + + + + + +``` + +#### Safety number change + +```js +const incoming = new Whisper.Message({ + type: 'keychange', + sent_at: Date.now() - 200000, + key_changed: '+12025550003', +}); +const View = Whisper.KeyChangeView; + + + +``` + +#### Marking as verified + +```js +const fromPrimary = new Whisper.Message({ + type: 'verified-change', + sent_at: Date.now() - 200000, + verifiedChanged: '+12025550003', + verified: true, +}); +const local = new Whisper.Message({ + type: 'verified-change', + sent_at: Date.now() - 200000, + verifiedChanged: '+12025550003', + local: true, + verified: true, +}); + +const View = Whisper.VerifiedChangeView; + + + + +``` + +#### Marking as not verified + +```js +const fromPrimary = new Whisper.Message({ + type: 'verified-change', + sent_at: Date.now() - 200000, + verifiedChanged: '+12025550003', +}); +const local = new Whisper.Message({ + type: 'verified-change', + sent_at: Date.now() - 200000, + verifiedChanged: '+12025550003', + local: true, +}); + +const View = Whisper.VerifiedChangeView; + + + + +``` + ### With an attachment #### Image with caption diff --git a/ts/styleguide/StyleGuideUtil.ts b/ts/styleguide/StyleGuideUtil.ts index abd694822..f49cf62cd 100644 --- a/ts/styleguide/StyleGuideUtil.ts +++ b/ts/styleguide/StyleGuideUtil.ts @@ -66,6 +66,8 @@ function makeObjectUrl(data: ArrayBuffer, contentType: string): string { } const ourNumber = '+12025559999'; +const groupNumber = '+12025550099'; + export { mp3, @@ -87,6 +89,7 @@ export { portraitTeal, portraitTealObjectUrl, ourNumber, + groupNumber, }; @@ -180,10 +183,22 @@ const me = parent.ConversationController.dangerouslyCreateAndAdd({ color: 'light_blue', }); +const group = parent.ConversationController.dangerouslyCreateAndAdd({ + id: groupNumber, + name: 'A place for sharing cats', + type: 'group', +}); + +group.contactCollection.add(me); +group.contactCollection.add(CONTACTS[0]); +group.contactCollection.add(CONTACTS[1]); +group.contactCollection.add(CONTACTS[2]); + export { COLORS, CONTACTS, me, + group, }; parent.textsecure.storage.user.getNumber = () => ourNumber;