SESSION
+
+ {
clearSearch={clearSearch}
/>
);
+
+ // Render Message View Also!
}
private renderContactSection() {
@@ -240,8 +244,6 @@ export class LeftPane extends React.Component {
}
private renderSettingSection() {
- const {} = this.props;
-
return ;
}
}
diff --git a/ts/components/MainViewController.tsx b/ts/components/MainViewController.tsx
new file mode 100644
index 000000000..172feb7f3
--- /dev/null
+++ b/ts/components/MainViewController.tsx
@@ -0,0 +1,60 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+
+import { SessionSettingListItem } from './session/settings/SessionSettingListItem';
+
+// interface State {
+// }
+
+// interface Props {
+
+// }
+
+// export class LeftPane extends React.Component {
+// public state = {
+// };
+
+// public constructor(props: any) {
+// super(props);
+// }
+
+
+// public render(): JSX.Element {
+// return (
+// {
}
public render(): JSX.Element {
+
+ MainViewController.renderMessageView();
+
return (
+
diff --git a/js/views/inbox_view.js b/js/views/inbox_view.js
index 879fc4ef2..162b71024 100644
--- a/js/views/inbox_view.js
+++ b/js/views/inbox_view.js
@@ -47,11 +47,10 @@
}
},
showToast({ message }) {
- const toast = new Whisper.MessageToastView({
- message,
+ window.pushToast({
+ title: message,
+ type: 'success',
});
- toast.$el.appendTo(this.$el);
- toast.render();
},
showConfirmationDialog({ title, message, onOk, onCancel }) {
window.confirmationDialog({
diff --git a/stylesheets/_session.scss b/stylesheets/_session.scss
index ef02cc2db..eb1dffaa3 100644
--- a/stylesheets/_session.scss
+++ b/stylesheets/_session.scss
@@ -192,6 +192,20 @@ $session_message-container-border-radius: 5px;
z-index: 1;
}
+
+#main-view {
+ height: 100vh;
+ display: flex;
+ flex-grow: 1;
+
+ .conversation-stack {
+ display: block;
+ width: 100%;
+ }
+}
+
+
+
.button-group > div {
margin-left: 5px;
margin-right: 5px;
@@ -898,6 +912,41 @@ label {
}
}
+.session-settings {
+ &-list{
+ width: 100%;
+ }
+
+ &-item {
+ font-size: 15px;
+ font-weight: bold;
+ color: $session-color-white;
+
+ height: 90px;
+ padding: 0px 15px;
+
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ &__info {
+ background-color: $session-shade-1;
+ }
+
+ &__description {
+ font-size: 13px;
+ @include session-color-subtle($session-color-white);
+ }
+
+ &:not(:last-child){
+ border-bottom: 1px solid $session-shade-3;
+ }
+ }
+
+}
+
+
+
#qr svg {
width: $session-modal-size-sm;
height: $session-modal-size-sm;
diff --git a/ts/components/LeftPane.tsx b/ts/components/LeftPane.tsx
index c41c6c11d..d163911f7 100644
--- a/ts/components/LeftPane.tsx
+++ b/ts/components/LeftPane.tsx
@@ -1,5 +1,7 @@
import React from 'react';
+import { MainViewController } from './MainViewController';
+
import { ActionsPanel, SectionType } from './session/ActionsPanel';
import { LeftPaneMessageSection } from './session/LeftPaneMessageSection';
@@ -209,6 +211,8 @@ export class LeftPane extends React.Component
+
+
+
+
+
SESSION
+
+// Lorem ipsum dolor sit amet consectetur, adipisicing elit. Debitis, pariatur dicta placeat corporis similique modi quod veritatis voluptatum impedit tempore voluptas nostrum magni aspernatur iure, labore ipsam odit possimus exercitationem?
+//
+// );
+// }
+
+// }
+
+export class MainViewController {
+ public static renderMessageView() {
+ const element = (
+
+
+ );
+
+ ReactDOM.render(element, document.getElementById('main-view'));
+ }
+
+ public static renderSettingsView() {
+ const element = (
+
+
+
+
+
+
+
+
+ SESSION
+
+
+
+ );
+
+ ReactDOM.render(element, document.getElementById('main-view'));
+ }
+}
\ No newline at end of file
diff --git a/ts/components/session/LeftPaneMessageSection.tsx b/ts/components/session/LeftPaneMessageSection.tsx
index b6a5f398e..0f82c73bf 100644
--- a/ts/components/session/LeftPaneMessageSection.tsx
+++ b/ts/components/session/LeftPaneMessageSection.tsx
@@ -1,6 +1,8 @@
import React from 'react';
+
import { AutoSizer, List } from 'react-virtualized';
+import { MainViewController } from '../MainViewController';
import {
ConversationListItem,
PropsData as ConversationListItemPropsType,
@@ -155,6 +157,9 @@ export class LeftPaneMessageSection extends React.Component
{this.renderHeader()}
diff --git a/ts/components/session/LeftPaneSettingSection.tsx b/ts/components/session/LeftPaneSettingSection.tsx
index 1e9efc888..839646ad4 100644
--- a/ts/components/session/LeftPaneSettingSection.tsx
+++ b/ts/components/session/LeftPaneSettingSection.tsx
@@ -3,6 +3,8 @@ import classNames from 'classnames';
import { LeftPane } from '../LeftPane';
+import { MainViewController } from '../MainViewController';
+
import {
SessionButton,
SessionButtonColor,
@@ -11,8 +13,6 @@ import {
import { SessionIcon, SessionIconSize, SessionIconType } from './icon';
import { SessionSearchInput } from './SessionSearchInput';
-import { Session } from 'inspector';
-
export enum SessionSettingCategory {
Account = 'account',
@@ -35,7 +35,7 @@ export class LeftPaneSettingSection extends React.Component {
super(props);
this.state = {
- settingCategory: SessionSettingCategory.Privacy,
+ settingCategory: SessionSettingCategory.Account,
searchQuery: '',
};
@@ -46,10 +46,11 @@ export class LeftPaneSettingSection extends React.Component {
}
public render(): JSX.Element {
+ MainViewController.renderSettingsView();
+
return (
{
title: window.i18n('copiedMnemonic'),
type: 'success',
id: 'copySeedToast',
- shouldFade: false,
});
}
diff --git a/ts/components/session/settings/SessionSettingListItem.tsx b/ts/components/session/settings/SessionSettingListItem.tsx
new file mode 100644
index 000000000..cc8f58740
--- /dev/null
+++ b/ts/components/session/settings/SessionSettingListItem.tsx
@@ -0,0 +1,47 @@
+import React from 'react';
+import { SessionToggle } from '../SessionToggle';
+
+interface Props {
+}
+
+
+// export settings = {
+// id
+// category
+// name
+// description
+// type (toggle, dropdown, etc)
+// }
+
+
+export class SessionSettingListItem extends React.Component {
+ public constructor(props: Props) {
+ super(props);
+ this.state = {
+ };
+ }
+
+
+
+ public render(): JSX.Element {
+ return (
+
{this.renderHeader()}
-
{this.renderSettings()}
);
diff --git a/ts/components/session/SessionSeedModal.tsx b/ts/components/session/SessionSeedModal.tsx
index 3b0bbb149..38208a0ce 100644
--- a/ts/components/session/SessionSeedModal.tsx
+++ b/ts/components/session/SessionSeedModal.tsx
@@ -213,7 +213,6 @@ export class SessionSeedModal extends React.Component
+
+ );
+ }
+
+}
+
+
+
+ Typing indicators
+
+
+
+ This is the description of the super usper awesome setting item
+
+
+
+
+
+