user details modal refactor functioning.
This commit is contained in:
parent
e8d06e86b5
commit
7c82ccb3e9
|
@ -139,10 +139,10 @@
|
|||
|
||||
<!-- DIALOGS-->
|
||||
<!-- <script type='text/javascript' src='js/views/update_group_dialog_view.js'></script> -->
|
||||
<script type='text/javascript' src='js/views/invite_contacts_dialog_view.js'></script>
|
||||
<script type='text/javascript' src='js/views/admin_leave_closed_group_dialog_view.js'></script>
|
||||
<!-- <script type='text/javascript' src='js/views/invite_contacts_dialog_view.js'></script> -->
|
||||
<!-- <script type='text/javascript' src='js/views/admin_leave_closed_group_dialog_view.js'></script> -->
|
||||
|
||||
<script type='text/javascript' src='js/views/user_details_dialog_view.js'></script>
|
||||
<!-- <script type='text/javascript' src='js/views/user_details_dialog_view.js'></script> -->
|
||||
<script type='text/javascript' src='js/views/session_id_reset_view.js'></script>
|
||||
|
||||
<!-- CRYPTO -->
|
||||
|
|
|
@ -448,11 +448,11 @@
|
|||
// }
|
||||
// });
|
||||
|
||||
Whisper.events.on('leaveClosedGroup', async groupConvo => {
|
||||
if (appView) {
|
||||
appView.showLeaveGroupDialog(groupConvo);
|
||||
}
|
||||
});
|
||||
// Whisper.events.on('leaveClosedGroup', async groupConvo => {
|
||||
// if (appView) {
|
||||
// appView.showLeaveGroupDialog(groupConvo);
|
||||
// }
|
||||
// });
|
||||
|
||||
Whisper.Notifications.on('click', (id, messageId) => {
|
||||
window.showWindow();
|
||||
|
@ -471,28 +471,28 @@
|
|||
});
|
||||
});
|
||||
|
||||
Whisper.events.on('onShowUserDetails', async ({ userPubKey }) => {
|
||||
const conversation = await window
|
||||
.getConversationController()
|
||||
.getOrCreateAndWait(userPubKey, 'private');
|
||||
// Whisper.events.on('onShowUserDetails', async ({ userPubKey }) => {
|
||||
// const conversation = await window
|
||||
// .getConversationController()
|
||||
// .getOrCreateAndWait(userPubKey, 'private');
|
||||
|
||||
const avatarPath = conversation.getAvatarPath();
|
||||
const profile = conversation.getLokiProfile();
|
||||
const displayName = profile && profile.displayName;
|
||||
// const avatarPath = conversation.getAvatarPath();
|
||||
// const profile = conversation.getLokiProfile();
|
||||
// const displayName = profile && profile.displayName;
|
||||
|
||||
if (appView) {
|
||||
appView.showUserDetailsDialog({
|
||||
profileName: displayName,
|
||||
pubkey: userPubKey,
|
||||
avatarPath,
|
||||
onStartConversation: () => {
|
||||
window.inboxStore.dispatch(
|
||||
window.actionsCreators.openConversationExternal(conversation.id)
|
||||
);
|
||||
},
|
||||
});
|
||||
}
|
||||
});
|
||||
// if (appView) {
|
||||
// appView.showUserDetailsDialog({
|
||||
// profileName: displayName,
|
||||
// pubkey: userPubKey,
|
||||
// avatarPath,
|
||||
// onStartConversation: () => {
|
||||
// window.inboxStore.dispatch(
|
||||
// window.actionsCreators.openConversationExternal(conversation.id)
|
||||
// );
|
||||
// },
|
||||
// });
|
||||
// }
|
||||
// });
|
||||
|
||||
|
||||
Whisper.events.on('password-updated', () => {
|
||||
|
|
|
@ -117,12 +117,12 @@
|
|||
|
||||
this.el.prepend(resetSessionIDDialog.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);
|
||||
},
|
||||
// showUserDetailsDialog(options) {
|
||||
// // eslint-disable-next-line no-param-reassign
|
||||
// options.theme = this.getThemeObject();
|
||||
// const dialog = new Whisper.UserDetailsDialogView(options);
|
||||
// this.el.prepend(dialog.el);
|
||||
// },
|
||||
getThemeObject() {
|
||||
const themeSettings = storage.get('theme-setting') || 'light';
|
||||
const theme = themeSettings === 'light' ? window.lightTheme : window.darkTheme;
|
||||
|
|
|
@ -5,6 +5,10 @@ import { SessionModal } from './session/SessionModal';
|
|||
import { SessionButton, SessionButtonColor, SessionButtonType } from './session/SessionButton';
|
||||
import { SessionIdEditable } from './session/SessionIdEditable';
|
||||
import { DefaultTheme } from 'styled-components';
|
||||
import { ConversationController } from '../session/conversations';
|
||||
import { ConversationTypeEnum } from '../models/conversation';
|
||||
import { Session } from 'electron';
|
||||
import { SessionWrapperModal } from './session/SessionWrapperModal';
|
||||
|
||||
interface Props {
|
||||
i18n: any;
|
||||
|
@ -12,7 +16,7 @@ interface Props {
|
|||
avatarPath: string;
|
||||
pubkey: string;
|
||||
onClose: any;
|
||||
onStartConversation: any;
|
||||
// onStartConversation: any;
|
||||
theme: DefaultTheme;
|
||||
}
|
||||
|
||||
|
@ -35,7 +39,7 @@ export class UserDetailsDialog extends React.Component<Props, State> {
|
|||
const { i18n } = this.props;
|
||||
|
||||
return (
|
||||
<SessionModal
|
||||
<SessionWrapperModal
|
||||
title={this.props.profileName}
|
||||
onClose={this.closeDialog}
|
||||
theme={this.props.theme}
|
||||
|
@ -43,6 +47,8 @@ export class UserDetailsDialog extends React.Component<Props, State> {
|
|||
<div className="avatar-center">
|
||||
<div className="avatar-center-inner">{this.renderAvatar()}</div>
|
||||
</div>
|
||||
|
||||
<div className="spacer-md"></div>
|
||||
<SessionIdEditable editable={false} text={this.props.pubkey} />
|
||||
|
||||
<div className="session-modal__button-group__center">
|
||||
|
@ -53,7 +59,7 @@ export class UserDetailsDialog extends React.Component<Props, State> {
|
|||
onClick={this.onClickStartConversation}
|
||||
/>
|
||||
</div>
|
||||
</SessionModal>
|
||||
</SessionWrapperModal>
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -95,8 +101,14 @@ export class UserDetailsDialog extends React.Component<Props, State> {
|
|||
this.props.onClose();
|
||||
}
|
||||
|
||||
private onClickStartConversation() {
|
||||
this.props.onStartConversation();
|
||||
private async onClickStartConversation() {
|
||||
// this.props.onStartConversation();
|
||||
const conversation = await ConversationController.getInstance().getOrCreateAndWait(this.props.pubkey, ConversationTypeEnum.PRIVATE);
|
||||
|
||||
window.inboxStore?.dispatch(
|
||||
window.actionsCreators.openConversationExternal(conversation.id)
|
||||
);
|
||||
|
||||
this.closeDialog();
|
||||
}
|
||||
}
|
||||
|
|
|
@ -71,10 +71,10 @@ import { useTheme, withTheme } from 'styled-components';
|
|||
import { MessageMetadata } from './message/MessageMetadata';
|
||||
import { PubKey } from '../../session/types';
|
||||
import { ToastUtils, UserUtils } from '../../session/utils';
|
||||
import { ConversationController } from '../../session/conversations';
|
||||
import { MessageRegularProps } from '../../models/messageType';
|
||||
import { useEncryptedFileFetch } from '../../hooks/useEncryptedFileFetch';
|
||||
import { addSenderAsModerator, removeSenderFromModerator } from '../../interactions/message';
|
||||
import { UserDetailsDialog } from '../UserDetailsDialog';
|
||||
|
||||
// Same as MIN_WIDTH in ImageGrid.tsx
|
||||
const MINIMUM_LINK_PREVIEW_IMAGE_WIDTH = 200;
|
||||
|
@ -467,8 +467,8 @@ class MessageInner extends React.PureComponent<MessageRegularProps, State> {
|
|||
conversationType,
|
||||
direction,
|
||||
isPublic,
|
||||
onShowUserDetails,
|
||||
firstMessageOfSeries,
|
||||
updateSessionConversationModal
|
||||
} = this.props;
|
||||
|
||||
if (collapseMetadata || conversationType !== 'group' || direction === 'outgoing') {
|
||||
|
@ -480,15 +480,24 @@ class MessageInner extends React.PureComponent<MessageRegularProps, State> {
|
|||
return <div style={{ marginInlineEnd: '60px' }} />;
|
||||
}
|
||||
|
||||
const onAvatarClick = () => {
|
||||
updateSessionConversationModal(<UserDetailsDialog
|
||||
i18n={window.i18n}
|
||||
profileName={userName}
|
||||
avatarPath={authorAvatarPath || ''}
|
||||
pubkey={authorPhoneNumber}
|
||||
onClose={() => updateSessionConversationModal(null)}
|
||||
theme={this.props.theme}
|
||||
/>)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="module-message__author-avatar">
|
||||
<Avatar
|
||||
avatarPath={authorAvatarPath}
|
||||
name={userName}
|
||||
size={AvatarSize.S}
|
||||
onAvatarClick={() => {
|
||||
onShowUserDetails(authorPhoneNumber);
|
||||
}}
|
||||
onAvatarClick={onAvatarClick}
|
||||
pubkey={authorPhoneNumber}
|
||||
/>
|
||||
{isPublic && isAdmin && (
|
||||
|
|
|
@ -451,9 +451,22 @@ export class SessionConversation extends React.Component<Props, State> {
|
|||
onDownloadAttachment: this.saveAttachment,
|
||||
messageContainerRef: this.messageContainerRef,
|
||||
onDeleteSelectedMessages: this.deleteSelectedMessages,
|
||||
updateSessionConversationModal: this.updateSessionConversationModal
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Setting this to a JSX element that will be rendered if non-null.
|
||||
* @param update Value to set the modal state to
|
||||
*/
|
||||
private updateSessionConversationModal (update: JSX.Element | null) {
|
||||
this.setState({
|
||||
...this.state,
|
||||
modal: update
|
||||
})
|
||||
}
|
||||
|
||||
public getRightPanelProps() {
|
||||
const { selectedConversationKey } = this.props;
|
||||
const conversation = ConversationController.getInstance().getOrThrow(selectedConversationKey);
|
||||
|
|
|
@ -47,6 +47,7 @@ interface Props {
|
|||
onClickAttachment: (attachment: any, message: any) => void;
|
||||
onDownloadAttachment: ({ attachment }: { attachment: any }) => void;
|
||||
onDeleteSelectedMessages: () => Promise<void>;
|
||||
updateSessionConversationModal: (modal: JSX.Element | null) => any;
|
||||
}
|
||||
|
||||
export class SessionMessagesList extends React.Component<Props, State> {
|
||||
|
@ -320,6 +321,8 @@ export class SessionMessagesList extends React.Component<Props, State> {
|
|||
};
|
||||
}
|
||||
|
||||
messageProps.updateSessionConversationModal = this.props.updateSessionConversationModal
|
||||
|
||||
return <Message {...messageProps} key={messageProps.id} />;
|
||||
}
|
||||
|
||||
|
|
|
@ -228,6 +228,8 @@ export interface MessageRegularProps {
|
|||
onCopyPubKey?: () => void;
|
||||
onBanUser?: () => void;
|
||||
onUnbanUser?: () => void;
|
||||
// setModal?: any;
|
||||
updateSessionConversationModal: (modal: JSX.Element | null) => any;
|
||||
|
||||
onShowDetail: () => void;
|
||||
onShowUserDetails: (userPubKey: string) => void;
|
||||
|
|
Loading…
Reference in New Issue