From 788cb2a5fc5bb6ea50243467446488de2fabd88a Mon Sep 17 00:00:00 2001 From: Audric Ackermann Date: Thu, 3 Dec 2020 13:47:32 +1100 Subject: [PATCH] fetch theme for each dialog, as they are out of the themed tree for now --- js/modules/signal.js | 4 - js/views/app_view.js | 52 ++-- js/views/conversation_view.js | 5 - js/views/create_group_dialog_view.js | 4 + js/views/device_pairing_dialog_view.js | 2 + js/views/edit_profile_dialog_view.js | 4 +- js/views/invite_contacts_dialog_view.js | 3 +- js/views/member_list_view.js | 106 --------- js/views/moderators_add_dialog_view.js | 5 +- js/views/moderators_remove_dialog_view.js | 2 + js/views/seed_dialog_view.js | 4 +- js/views/user_details_dialog_view.js | 3 + ts/components/ConfirmDialog.tsx | 53 ++--- ts/components/EditProfileDialog.tsx | 6 - .../conversation/CreateGroupDialog.tsx | 225 ------------------ .../conversation/InviteContactsDialog.tsx | 3 +- .../conversation/ModeratorsAddDialog.tsx | 8 +- .../conversation/ModeratorsRemoveDialog.tsx | 6 - .../conversation/UpdateGroupMembersDialog.tsx | 1 + .../session/SessionClosableOverlay.tsx | 1 + .../session/SessionMemberListItem.tsx | 2 +- ts/components/session/icon/SessionIcon.tsx | 2 +- .../session/icon/SessionIconButton.tsx | 2 +- ts/state/ducks/SessionTheme.tsx | 3 + ts/window.d.ts | 3 + 25 files changed, 94 insertions(+), 415 deletions(-) delete mode 100644 js/views/member_list_view.js delete mode 100644 ts/components/conversation/CreateGroupDialog.tsx diff --git a/js/modules/signal.js b/js/modules/signal.js index 457a5e6a2..f6c9a41f0 100644 --- a/js/modules/signal.js +++ b/js/modules/signal.js @@ -30,9 +30,6 @@ const { Emojify } = require('../../ts/components/conversation/Emojify'); const { Lightbox } = require('../../ts/components/Lightbox'); const { LightboxGallery } = require('../../ts/components/LightboxGallery'); const { MemberList } = require('../../ts/components/conversation/MemberList'); -const { - CreateGroupDialog, -} = require('../../ts/components/conversation/CreateGroupDialog'); const { EditProfileDialog } = require('../../ts/components/EditProfileDialog'); const { UserDetailsDialog } = require('../../ts/components/UserDetailsDialog'); const { @@ -235,7 +232,6 @@ exports.setup = (options = {}) => { Lightbox, LightboxGallery, MemberList, - CreateGroupDialog, EditProfileDialog, UserDetailsDialog, DevicePairingDialog, diff --git a/js/views/app_view.js b/js/views/app_view.js index 717a252f4..3164cd193 100644 --- a/js/views/app_view.js +++ b/js/views/app_view.js @@ -122,60 +122,75 @@ window.focus(); // FIXME return Promise.resolve(); }, - onEmpty() { - // const view = this.inboxView; - // this.initialLoadComplete = true; - // if (view) { - // view.onEmpty(); - // } - }, - onProgress() { - // const view = this.inboxView; - // if (view) { - // view.onProgress(count); - // } - }, + onEmpty() {}, + onProgress() {}, showEditProfileDialog(options) { + // eslint-disable-next-line no-param-reassign + options.theme = this.getThemeObject(); const dialog = new Whisper.EditProfileDialogView(options); this.el.prepend(dialog.el); }, showUserDetailsDialog(options) { + // eslint-disable-next-line no-param-reassign + options.theme = this.getThemeObject(); const dialog = new Whisper.UserDetailsDialogView(options); this.el.prepend(dialog.el); }, showNicknameDialog({ pubKey, title, message, nickname, onOk, onCancel }) { const _title = title || `Change nickname for ${pubKey}`; + const dialog = new Whisper.NicknameDialogView({ title: _title, message, name: nickname, resolve: onOk, reject: onCancel, + theme: this.getThemeObject(), }); this.el.prepend(dialog.el); dialog.focusInput(); }, showPasswordDialog(options) { + // eslint-disable-next-line no-param-reassign + options.theme = this.getThemeObject(); const dialog = new Whisper.PasswordDialogView(options); this.el.prepend(dialog.el); }, showSeedDialog() { - const dialog = new Whisper.SeedDialogView(); + const dialog = new Whisper.SeedDialogView({ + theme: this.getThemeObject(), + }); this.el.prepend(dialog.el); }, + getThemeObject() { + const themeSettings = storage.get('theme-setting') || 'light'; + const theme = + themeSettings === 'light' ? window.lightTheme : window.darkTheme; + return theme; + }, showDevicePairingDialog(options) { + // eslint-disable-next-line no-param-reassign + options.theme = this.getThemeObject(); const dialog = new Whisper.DevicePairingDialogView(options); this.el.prepend(dialog.el); }, showDevicePairingWordsDialog() { - const dialog = new Whisper.DevicePairingWordsDialogView(); + const options = { theme: this.getThemeObject() }; + + const dialog = new Whisper.DevicePairingWordsDialogView(options); this.el.prepend(dialog.el); }, showUpdateGroupNameDialog(groupConvo) { + // eslint-disable-next-line no-param-reassign + groupConvo.theme = this.getThemeObject(); + const dialog = new Whisper.UpdateGroupNameDialogView(groupConvo); this.el.append(dialog.el); }, showUpdateGroupMembersDialog(groupConvo) { + // eslint-disable-next-line no-param-reassign + groupConvo.theme = this.getThemeObject(); + const dialog = new Whisper.UpdateGroupMembersDialogView(groupConvo); this.el.append(dialog.el); }, @@ -193,17 +208,24 @@ title, message, resolve: () => ConversationController.deleteContact(groupConvo.id), + theme: this.getThemeObject(), }); }, showInviteContactsDialog(groupConvo) { + // eslint-disable-next-line no-param-reassign + groupConvo.theme = this.getThemeObject(); const dialog = new Whisper.InviteContactsDialogView(groupConvo); this.el.append(dialog.el); }, showAddModeratorsDialog(groupConvo) { + // eslint-disable-next-line no-param-reassign + groupConvo.theme = this.getThemeObject(); const dialog = new Whisper.AddModeratorsDialogView(groupConvo); this.el.append(dialog.el); }, showRemoveModeratorsDialog(groupConvo) { + // eslint-disable-next-line no-param-reassign + groupConvo.theme = this.getThemeObject(); const dialog = new Whisper.RemoveModeratorsDialogView(groupConvo); this.el.append(dialog.el); }, diff --git a/js/views/conversation_view.js b/js/views/conversation_view.js index 280df4b8f..2145fbc9a 100644 --- a/js/views/conversation_view.js +++ b/js/views/conversation_view.js @@ -111,11 +111,6 @@ this.toggleMicrophone() ); - this.memberView = new Whisper.MemberListView({ - el: this.$('.member-list-container'), - onClicked: this.selectMember.bind(this), - }); - this.memberView.render(); this.$messageField = this.$('.send-message'); diff --git a/js/views/create_group_dialog_view.js b/js/views/create_group_dialog_view.js index 5257225c0..8bbb63ab9 100644 --- a/js/views/create_group_dialog_view.js +++ b/js/views/create_group_dialog_view.js @@ -20,6 +20,7 @@ this.groupId = groupConvo.id; this.members = groupConvo.get('members') || []; this.avatarPath = groupConvo.getAvatarPath(); + this.theme = groupConvo.theme; // any member can update a closed group name this.isAdmin = true; @@ -54,6 +55,7 @@ onSubmit: this.onSubmit, onClose: this.close, avatarPath: this.avatarPath, + theme: this.theme, }, }); @@ -84,6 +86,7 @@ this.isPublic = groupConvo.isPublic(); this.groupId = groupConvo.id; this.avatarPath = groupConvo.getAvatarPath(); + this.theme = groupConvo.theme; if (this.isPublic) { this.titleText = i18n('updateGroupDialogTitle', this.groupName); @@ -139,6 +142,7 @@ onClose: this.close, onSubmit: this.onSubmit, groupId: this.groupId, + theme: this.theme, }, }); diff --git a/js/views/device_pairing_dialog_view.js b/js/views/device_pairing_dialog_view.js index 8cb1ceabe..f76019f50 100644 --- a/js/views/device_pairing_dialog_view.js +++ b/js/views/device_pairing_dialog_view.js @@ -11,6 +11,7 @@ initialize(options) { this.close = this.close.bind(this); this.pubKeyToUnpair = options.pubKeyToUnpair; + this.theme = options.theme; this.render(); }, @@ -22,6 +23,7 @@ i18n, onClose: this.close, pubKeyToUnpair: this.pubKeyToUnpair, + theme: this.theme, }, }); diff --git a/js/views/edit_profile_dialog_view.js b/js/views/edit_profile_dialog_view.js index c646a17ef..2c7b3ade9 100644 --- a/js/views/edit_profile_dialog_view.js +++ b/js/views/edit_profile_dialog_view.js @@ -8,13 +8,14 @@ Whisper.EditProfileDialogView = Whisper.View.extend({ className: 'loki-dialog modal', - initialize({ profileName, avatarPath, pubkey, onOk }) { + initialize({ profileName, avatarPath, pubkey, onOk, theme }) { this.close = this.close.bind(this); this.profileName = profileName; this.pubkey = pubkey; this.avatarPath = avatarPath; this.onOk = onOk; + this.theme = theme; this.$el.focus(); this.render(); @@ -30,6 +31,7 @@ pubkey: this.pubkey, avatarPath: this.avatarPath, i18n, + theme: this.theme, }, }); diff --git a/js/views/invite_contacts_dialog_view.js b/js/views/invite_contacts_dialog_view.js index e35306587..128267203 100644 --- a/js/views/invite_contacts_dialog_view.js +++ b/js/views/invite_contacts_dialog_view.js @@ -11,7 +11,7 @@ initialize(convo) { this.close = this.close.bind(this); this.submit = this.submit.bind(this); - + this.theme = convo.theme; const convos = window.getConversations().models; this.contacts = convos.filter( @@ -45,6 +45,7 @@ onSubmit: this.submit, onClose: this.close, chatName: this.chatName, + theme: this.theme, }, }); diff --git a/js/views/member_list_view.js b/js/views/member_list_view.js deleted file mode 100644 index 7c78c0a5c..000000000 --- a/js/views/member_list_view.js +++ /dev/null @@ -1,106 +0,0 @@ -/* global _, Whisper, */ - -// eslint-disable-next-line func-names -(function() { - 'use strict'; - - window.Whisper = window.Whisper || {}; - - Whisper.MemberListView = Whisper.View.extend({ - initialize(options) { - this.member_list = []; - this.memberMapping = {}; - this.selected_idx = 0; - this.onClicked = options.onClicked; - this.render(); - }, - render() { - if (this.memberView) { - this.memberView.remove(); - this.memberView = null; - } - - this.memberView = new Whisper.ReactWrapperView({ - className: 'member-list', - Component: window.Signal.Components.MemberList, - props: { - members: this.member_list, - selected: this.selectedMember(), - onMemberClicked: this.handleMemberClicked.bind(this), - }, - }); - - this.$el.append(this.memberView.el); - return this; - }, - handleMemberClicked(member) { - this.onClicked(member); - }, - updateMembers(members) { - if (!_.isEqual(this.member_list, members)) { - // Whenever the list is updated, we reset the selection - this.selected_idx = 0; - this.member_list = members; - this.render(); - } - }, - replaceMentions(message) { - let result = message; - - // Sort keys from long to short, so we don't have to - // worry about one key being a substring of another - const keys = _.sortBy(_.keys(this.memberMapping), d => -d.length); - - keys.forEach(key => { - const pubkey = this.memberMapping[key]; - result = result.split(key).join(`@${pubkey}`); - }); - - return result; - }, - pendingMentions() { - return this.memberMapping; - }, - deleteMention(mention) { - if (mention) { - delete this.memberMapping[mention]; - } else { - // Delete all mentions if no argument is passed - this.memberMapping = {}; - } - }, - membersShown() { - return this.member_list.length !== 0; - }, - selectUp() { - this.selected_idx = Math.max(this.selected_idx - 1, 0); - this.render(); - }, - selectDown() { - this.selected_idx = Math.min( - this.selected_idx + 1, - this.member_list.length - 1 - ); - this.render(); - }, - selectedMember() { - return this.member_list[this.selected_idx]; - }, - addPubkeyMapping(name, pubkey) { - let handle = `@${name}`; - let chars = 4; - - while ( - _.has(this.memberMapping, handle) && - this.memberMapping[handle] !== pubkey - ) { - const shortenedPubkey = pubkey.substr(pubkey.length - chars); - handle = `@${name}(..${shortenedPubkey})`; - chars += 1; - } - - this.memberMapping[handle] = pubkey; - return handle; - }, - }); -})(); diff --git a/js/views/moderators_add_dialog_view.js b/js/views/moderators_add_dialog_view.js index 039baa87e..d2d777dce 100644 --- a/js/views/moderators_add_dialog_view.js +++ b/js/views/moderators_add_dialog_view.js @@ -19,10 +19,9 @@ // get current list of moderators this.channelAPI = await convo.getPublicSendData(); const modPubKeys = await this.channelAPI.getModerators(); - const convos = window.getConversations().models; // private contacts (not you) that aren't already moderators - const contacts = convos.filter( + const contacts = convo.filter( d => !!d && d.isPrivate() && @@ -32,6 +31,7 @@ ); this.contacts = contacts; + this.this.theme = convo.theme; this.$el.focus(); this.render(); @@ -45,6 +45,7 @@ chatName: this.chatName, onSubmit: this.onSubmit, onClose: this.close, + theme: this.theme, }, }); diff --git a/js/views/moderators_remove_dialog_view.js b/js/views/moderators_remove_dialog_view.js index 166d9f9dd..b868484f5 100644 --- a/js/views/moderators_remove_dialog_view.js +++ b/js/views/moderators_remove_dialog_view.js @@ -31,6 +31,7 @@ .filter(c => !!c); this.mods = moderators; + this.theme = convo.theme; this.$el.focus(); this.render(); @@ -44,6 +45,7 @@ onSubmit: this.onSubmit, onClose: this.close, chatName: this.chatName, + theme: this.theme, }, }); diff --git a/js/views/seed_dialog_view.js b/js/views/seed_dialog_view.js index 0ddeea06c..9355100a9 100644 --- a/js/views/seed_dialog_view.js +++ b/js/views/seed_dialog_view.js @@ -8,8 +8,9 @@ Whisper.SeedDialogView = Whisper.View.extend({ className: 'loki-dialog seed-dialog modal', - initialize() { + initialize(options) { this.close = this.close.bind(this); + this.theme = options.theme; this.render(); }, @@ -19,6 +20,7 @@ Component: window.Signal.Components.SessionSeedModal, props: { onClose: this.close, + theme: this.theme, }, }); diff --git a/js/views/user_details_dialog_view.js b/js/views/user_details_dialog_view.js index d86340cfb..77fae59fe 100644 --- a/js/views/user_details_dialog_view.js +++ b/js/views/user_details_dialog_view.js @@ -15,6 +15,7 @@ isRss, onOk, onStartConversation, + theme, }) { this.close = this.close.bind(this); @@ -24,6 +25,7 @@ this.avatarPath = avatarPath; this.onOk = onOk; this.onStartConversation = onStartConversation; + this.theme = theme; this.$el.focus(); this.render(); @@ -41,6 +43,7 @@ isRss: this.isRss, avatarPath: this.avatarPath, i18n, + theme: this.theme, }, }); diff --git a/ts/components/ConfirmDialog.tsx b/ts/components/ConfirmDialog.tsx index 2b7426e2a..c8e003243 100644 --- a/ts/components/ConfirmDialog.tsx +++ b/ts/components/ConfirmDialog.tsx @@ -3,8 +3,7 @@ import React from 'react'; import { SessionModal } from './session/SessionModal'; import { SessionButton } from './session/SessionButton'; import { DefaultTheme } from 'styled-components'; - -interface Props { +type Props = { titleText: string; messageText: string; okText: string; @@ -12,37 +11,25 @@ interface Props { onConfirm: any; onClose: any; theme: DefaultTheme; -} - -export class ConfirmDialog extends React.Component { - constructor(props: any) { - super(props); - } +}; - public render() { - return ( - null} - theme={this.props.theme} - > -
-

{this.props.messageText}

-
+export const ConfirmDialog = (props: Props) => { + return ( + null} + theme={props.theme} + > +
+

{props.messageText}

+
-
- +
+ - -
- - ); - } -} + +
+ + ); +}; diff --git a/ts/components/EditProfileDialog.tsx b/ts/components/EditProfileDialog.tsx index 7d86b65be..a58f3fda8 100644 --- a/ts/components/EditProfileDialog.tsx +++ b/ts/components/EditProfileDialog.tsx @@ -20,12 +20,6 @@ import { PillDivider } from './session/PillDivider'; import { ToastUtils } from '../session/utils'; import { DefaultTheme } from 'styled-components'; -declare global { - interface Window { - displayNameRegex: any; - } -} - interface Props { i18n: any; profileName: string; diff --git a/ts/components/conversation/CreateGroupDialog.tsx b/ts/components/conversation/CreateGroupDialog.tsx deleted file mode 100644 index c1cd99f22..000000000 --- a/ts/components/conversation/CreateGroupDialog.tsx +++ /dev/null @@ -1,225 +0,0 @@ -import React from 'react'; -import classNames from 'classnames'; -import { Contact, MemberList } from './MemberList'; - -import { SessionModal } from './../session/SessionModal'; -import { createLegacyGroup } from '../../session/medium_group'; -import { DefaultTheme, withTheme } from 'styled-components'; - -declare global { - interface Window { - Lodash: any; - MEDIUM_GROUP_SIZE_LIMIT: number; - } -} - -interface Props { - titleText: string; - okText: string; - cancelText: string; - contactList: Array; - i18n: any; - onClose: any; - theme: DefaultTheme; -} - -interface State { - contactList: Array; - groupName: string; - errorDisplayed: boolean; - errorMessage: string; -} - -class CreateGroupDialogInner extends React.Component { - constructor(props: any) { - super(props); - - this.onMemberClicked = this.onMemberClicked.bind(this); - this.onClickOK = this.onClickOK.bind(this); - this.onKeyUp = this.onKeyUp.bind(this); - this.closeDialog = this.closeDialog.bind(this); - this.onGroupNameChanged = this.onGroupNameChanged.bind(this); - - let contacts = this.props.contactList; - - contacts = contacts.map(d => { - const lokiProfile = d.getLokiProfile(); - const name = lokiProfile ? lokiProfile.displayName : 'Anonymous'; - - return { - id: d.id, - authorPhoneNumber: d.id, - authorProfileName: name, - selected: false, - authorName: name, // different from ProfileName? - checkmarked: false, - }; - }); - - this.state = { - contactList: contacts, - groupName: '', - errorDisplayed: false, - // if empty, the initial height is 0, which is not desirable - errorMessage: 'placeholder', - }; - - window.addEventListener('keyup', this.onKeyUp); - } - - public onClickOK() { - const members = this.state.contactList - .filter(d => d.checkmarked) - .map(d => d.id); - - if (!this.state.groupName.trim()) { - this.onShowError(this.props.i18n('emptyGroupNameError')); - - return; - } - - void createLegacyGroup(this.state.groupName, members); - - this.closeDialog(); - } - - public render() { - const checkMarkedCount = this.getMemberCount(); - - const titleText = `${this.props.titleText} (Members: ${checkMarkedCount})`; - const okText = this.props.okText; - const cancelText = this.props.cancelText; - - const errorMessageClasses = classNames( - 'error-message', - this.state.errorDisplayed ? 'error-shown' : 'error-faded' - ); - - return ( - null} - theme={this.props.theme} - > -
- - {this.state.errorDisplayed && ( -

{this.state.errorMessage}

- )} - -
- -
- -
- -
- - -
- - ); - } - - private onShowError(msg: string) { - if (this.state.errorDisplayed) { - return; - } - - this.setState({ - errorDisplayed: true, - errorMessage: msg, - }); - - setTimeout(() => { - this.setState({ - errorDisplayed: false, - }); - }, 3000); - } - - private onGroupNameChanged(event: any) { - event.persist(); - - this.setState(state => { - return { - ...state, - groupName: event.target.value, - }; - }); - } - - private onKeyUp(event: any) { - switch (event.key) { - case 'Enter': - this.onClickOK(); - break; - case 'Esc': - case 'Escape': - this.closeDialog(); - break; - default: - } - } - - private getMemberCount() { - // Add 1 to include yourself - return this.state.contactList.filter(d => d.checkmarked).length + 1; - } - - private closeDialog() { - window.removeEventListener('keyup', this.onKeyUp); - - this.props.onClose(); - } - - private onMemberClicked(selected: any) { - const updatedContacts = this.state.contactList.map(member => { - if (member.id === selected.id) { - return { ...member, checkmarked: !member.checkmarked }; - } else { - return member; - } - }); - - if ( - updatedContacts.filter(d => d.checkmarked).length > - window.CONSTANTS.MEDIUM_GROUP_SIZE_LIMIT - 1 - ) { - const msg = this.props.i18n('closedGroupMaxSize'); - this.onShowError(msg); - - return; - } - - this.setState(state => { - return { - ...state, - contactList: updatedContacts, - }; - }); - } -} - -export const CreateGroupDialog = withTheme(CreateGroupDialogInner); diff --git a/ts/components/conversation/InviteContactsDialog.tsx b/ts/components/conversation/InviteContactsDialog.tsx index c883578d2..6055568aa 100644 --- a/ts/components/conversation/InviteContactsDialog.tsx +++ b/ts/components/conversation/InviteContactsDialog.tsx @@ -126,6 +126,7 @@ class InviteContactsDialogInner extends React.Component { onUnselect={(selectedMember: ContactType) => { this.onMemberClicked(selectedMember); }} + theme={this.props.theme} /> )); } @@ -166,4 +167,4 @@ class InviteContactsDialogInner extends React.Component { } } -export const InviteContactsDialog = withTheme(InviteContactsDialogInner); +export const InviteContactsDialog = InviteContactsDialogInner; diff --git a/ts/components/conversation/ModeratorsAddDialog.tsx b/ts/components/conversation/ModeratorsAddDialog.tsx index c97b6a869..401244474 100644 --- a/ts/components/conversation/ModeratorsAddDialog.tsx +++ b/ts/components/conversation/ModeratorsAddDialog.tsx @@ -1,18 +1,14 @@ import React from 'react'; import { Contact, MemberList } from './MemberList'; import { cleanSearchTerm } from '../../util/cleanSearchTerm'; +import { DefaultTheme } from 'styled-components'; interface Props { contactList: Array; chatName: string; onSubmit: any; onClose: any; -} - -declare global { - interface Window { - i18n: any; - } + // theme: DefaultTheme; } interface State { diff --git a/ts/components/conversation/ModeratorsRemoveDialog.tsx b/ts/components/conversation/ModeratorsRemoveDialog.tsx index bc00b10d7..37b9cdda5 100644 --- a/ts/components/conversation/ModeratorsRemoveDialog.tsx +++ b/ts/components/conversation/ModeratorsRemoveDialog.tsx @@ -8,12 +8,6 @@ interface Props { onClose: any; } -declare global { - interface Window { - i18n: any; - } -} - interface State { modList: Array; } diff --git a/ts/components/conversation/UpdateGroupMembersDialog.tsx b/ts/components/conversation/UpdateGroupMembersDialog.tsx index 7bf1c20a7..b0a930208 100644 --- a/ts/components/conversation/UpdateGroupMembersDialog.tsx +++ b/ts/components/conversation/UpdateGroupMembersDialog.tsx @@ -160,6 +160,7 @@ export class UpdateGroupMembersDialog extends React.Component { onSelect={this.onMemberClicked} onUnselect={this.onMemberClicked} key={member.id} + theme={this.props.theme} /> )); } diff --git a/ts/components/session/SessionClosableOverlay.tsx b/ts/components/session/SessionClosableOverlay.tsx index a918b6e25..5b3ef484c 100644 --- a/ts/components/session/SessionClosableOverlay.tsx +++ b/ts/components/session/SessionClosableOverlay.tsx @@ -289,6 +289,7 @@ export class SessionClosableOverlay extends React.Component { onUnselect={(selectedMember: ContactType) => { this.handleUnselectMember(selectedMember); }} + theme={this.props.theme} /> )); } diff --git a/ts/components/session/SessionMemberListItem.tsx b/ts/components/session/SessionMemberListItem.tsx index 999829453..3862b6b20 100644 --- a/ts/components/session/SessionMemberListItem.tsx +++ b/ts/components/session/SessionMemberListItem.tsx @@ -135,4 +135,4 @@ class SessionMemberListItemInner extends React.Component { } } -export const SessionMemberListItem = withTheme(SessionMemberListItemInner); +export const SessionMemberListItem = SessionMemberListItemInner; diff --git a/ts/components/session/icon/SessionIcon.tsx b/ts/components/session/icon/SessionIcon.tsx index c45efd470..307a5c10f 100644 --- a/ts/components/session/icon/SessionIcon.tsx +++ b/ts/components/session/icon/SessionIcon.tsx @@ -73,7 +73,7 @@ export const SessionIcon = (props: SessionIconProps) => { // const themeContext = useContext(ThemeContext); if (!theme) { - debugger; + window.log.error('Missing theme props in SessionIcon'); } return ( diff --git a/ts/components/session/icon/SessionIconButton.tsx b/ts/components/session/icon/SessionIconButton.tsx index 051ca792a..f21b2e566 100644 --- a/ts/components/session/icon/SessionIconButton.tsx +++ b/ts/components/session/icon/SessionIconButton.tsx @@ -1,6 +1,6 @@ import React from 'react'; import classNames from 'classnames'; -import { SessionIconProps, SessionIcon } from '../icon'; +import { SessionIcon, SessionIconProps } from '../icon'; import { SessionNotificationCount } from '../SessionNotificationCount'; import { DefaultTheme } from 'styled-components'; diff --git a/ts/state/ducks/SessionTheme.tsx b/ts/state/ducks/SessionTheme.tsx index 24d1a3d09..b44754e4a 100644 --- a/ts/state/ducks/SessionTheme.tsx +++ b/ts/state/ducks/SessionTheme.tsx @@ -162,3 +162,6 @@ export const SessionTheme = ({ children: any; theme: DefaultTheme; }) => {children}; + +window.lightTheme = lightTheme; +window.darkTheme = darkTheme; diff --git a/ts/window.d.ts b/ts/window.d.ts index 477c80c95..8ef86a9d4 100644 --- a/ts/window.d.ts +++ b/ts/window.d.ts @@ -18,6 +18,7 @@ import { ConversationControllerType } from '../js/ConversationController'; import { any } from 'underscore'; import { Store } from 'redux'; import { MessageController } from './session/messages/MessageController'; +import { DefaultTheme } from 'styled-components'; /* We declare window stuff here instead of global.d.ts because we are importing other declarations. If you import anything in global.d.ts, the type system won't work correctly. @@ -119,5 +120,7 @@ declare global { expiredStatus: () => boolean; }; openUrl: (string) => void; + lightTheme: DefaultTheme; + darkTheme: DefaultTheme; } }