diff --git a/background.html b/background.html
index d035f7b37..5391da3f5 100644
--- a/background.html
+++ b/background.html
@@ -35,10 +35,6 @@
+
@@ -621,9 +618,6 @@
-
-

-
SESSION
diff --git a/js/modules/signal.js b/js/modules/signal.js
index 2e2946858..b5f158f06 100644
--- a/js/modules/signal.js
+++ b/js/modules/signal.js
@@ -18,6 +18,9 @@ const LinkPreviews = require('./link_previews');
const AttachmentDownloads = require('./attachment_downloads');
// Components
+const {
+ ConversationLoadingScreen,
+} = require('../../ts/components/ConversationLoadingScreen');
const {
AttachmentList,
} = require('../../ts/components/conversation/AttachmentList');
@@ -245,6 +248,7 @@ exports.setup = (options = {}) => {
});
const Components = {
+ ConversationLoadingScreen,
AttachmentList,
CaptionEditor,
ContactDetail,
diff --git a/js/views/conversation_loading_view.js b/js/views/conversation_loading_view.js
new file mode 100644
index 000000000..c93b26f13
--- /dev/null
+++ b/js/views/conversation_loading_view.js
@@ -0,0 +1,25 @@
+/* global Whisper */
+
+// eslint-disable-next-line func-names
+(function() {
+ 'use strict';
+
+ window.Whisper = window.Whisper || {};
+
+ Whisper.ConversationLoadingScreen = Whisper.View.extend({
+ initialize() {
+ },
+
+ render() {
+ this.toastView = new Whisper.ReactWrapperView({
+ className: 'app-loading-wrapper',
+ Component: window.Signal.Components.ConversationLoadingScreen,
+ props: this.props,
+ });
+
+ this.$el.append(this.toastView.el);
+ },
+
+ });
+ })();
+
\ No newline at end of file
diff --git a/js/views/conversation_view.js b/js/views/conversation_view.js
index 17e15899b..1e583ca86 100644
--- a/js/views/conversation_view.js
+++ b/js/views/conversation_view.js
@@ -46,11 +46,6 @@
},
});
- Whisper.ConversationLoadingScreen = Whisper.View.extend({
- templateName: 'conversation-loading-screen',
- className: 'conversation-loading-screen',
- });
-
Whisper.ConversationView = Whisper.View.extend({
className() {
return ['conversation', this.model.get('type')].join(' ');
@@ -148,6 +143,7 @@
this.loadingScreen.render();
this.loadingScreen.$el.prependTo(this.$('.discussion-container'));
+
this.window = options.window;
this.fileInput = new Whisper.FileInputView({
el: this.$('.attachment-list'),
diff --git a/js/views/inbox_view.js b/js/views/inbox_view.js
index 23b978249..27889902e 100644
--- a/js/views/inbox_view.js
+++ b/js/views/inbox_view.js
@@ -23,17 +23,31 @@
open(conversation) {
const id = `conversation-${conversation.cid}`;
const container = $('#main-view .conversation-stack');
- const conversationOpened = container.children()[0].id === id
+
+ // Has been opened since app sart, but not focussed
+ const conversationExists = container.children(`#${id}`).length > 0;
+ // Is focussed
+ const conversationOpened = container.children().first().id === id
// To limit the size of the DOM for speed
- const maxNumConversations = 5;
+ const maxNumConversations = 10;
const numConversations = container.children().not('.conversation.placeholder').length;
- const shouldRemoveConversation = numConversations > maxNumConversations;
+ const shouldTrimConversations = numConversations > maxNumConversations;
- if (shouldRemoveConversation){
+ if (shouldTrimConversations){
+ // Removes conversation which has been hidden the longest
container.children()[numConversations - 1].remove();
}
+ if (conversationExists) {
+ // User opened conversation, move it to top of stack, rather than re-rendering
+ const conversations = container.children().not('.conversation.placeholder');
+ container.children(`#${id}`).first().insertBefore(conversations.first());
+ conversation.trigger('opened');
+
+ return;
+ }
+
if (! conversationOpened) {
this.$el
.first()
@@ -88,6 +102,7 @@
message: i18n('loading'),
},
});
+
Whisper.InboxView = Whisper.View.extend({
templateName: 'two-column',
diff --git a/stylesheets/_session.scss b/stylesheets/_session.scss
index 83f19eec5..3d7abde01 100644
--- a/stylesheets/_session.scss
+++ b/stylesheets/_session.scss
@@ -854,6 +854,19 @@ label {
margin-left: 75px;
}
+
+.conversation-loader {
+ height: 100%;
+ margin-top: 45vh;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ &>div{
+ display: block;
+ }
+}
+
.session-loader {
display: inline-block;
position: relative;
diff --git a/ts/components/ConversationLoadingScreen.tsx b/ts/components/ConversationLoadingScreen.tsx
new file mode 100644
index 000000000..869301023
--- /dev/null
+++ b/ts/components/ConversationLoadingScreen.tsx
@@ -0,0 +1,19 @@
+import React from 'react';
+
+import { SessionSpinner } from './session/SessionSpinner';
+
+
+export class ConversationLoadingScreen extends React.PureComponent {
+ constructor(props: any) {
+ super(props);
+ }
+
+ public render() {
+
+ return (
+
+
+
+ );
+ }
+}