Moves various panels out to ConversationView react

This commit is contained in:
Josh Perez 2022-12-14 20:10:09 -05:00 committed by GitHub
parent 15efbde23d
commit e142cb47f5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
32 changed files with 287 additions and 473 deletions

View file

@ -49,12 +49,12 @@ const commonProps = {
),
onShowAllMedia: action('onShowAllMedia'),
onShowGroupMembers: action('onShowGroupMembers'),
onGoBack: action('onGoBack'),
onArchive: action('onArchive'),
onMarkUnread: action('onMarkUnread'),
onMoveToInbox: action('onMoveToInbox'),
pushPanelForConversation: action('pushPanelForConversation'),
setMuteExpiration: action('onSetMuteNotifications'),
setPinned: action('setPinned'),
viewUserStories: action('viewUserStories'),

View file

@ -18,7 +18,10 @@ import { Avatar, AvatarSize } from '../Avatar';
import { InContactsIcon } from '../InContactsIcon';
import type { LocalizerType, ThemeType } from '../../types/Util';
import type { ConversationType } from '../../state/ducks/conversations';
import type {
ConversationType,
PushPanelForConversationActionType,
} from '../../state/ducks/conversations';
import type { BadgeType } from '../../badges/types';
import type { HasStories } from '../../types/Stories';
import type { ViewUserStoriesActionCreatorType } from '../../state/ducks/stories';
@ -34,6 +37,7 @@ import {
useStartCallShortcuts,
useKeyboardShortcuts,
} from '../../hooks/useKeyboardShortcuts';
import { PanelType } from '../../types/Panels';
export enum OutgoingCallButtonStyle {
None,
@ -90,7 +94,7 @@ export type PropsActionsType = {
onSearchInConversation: () => void;
onShowAllMedia: () => void;
onShowConversationDetails: () => void;
onShowGroupMembers: () => void;
pushPanelForConversation: PushPanelForConversationActionType;
setDisappearingMessages: (
conversationId: string,
seconds: DurationInSeconds
@ -349,7 +353,7 @@ export class ConversationHeader extends React.Component<PropsType, StateType> {
onMoveToInbox,
onShowAllMedia,
onShowConversationDetails,
onShowGroupMembers,
pushPanelForConversation,
setDisappearingMessages,
setMuteExpiration,
setPinned,
@ -478,7 +482,11 @@ export class ConversationHeader extends React.Component<PropsType, StateType> {
</MenuItem>
) : null}
{isGroup && !hasGV2AdminEnabled ? (
<MenuItem onClick={onShowGroupMembers}>
<MenuItem
onClick={() =>
pushPanelForConversation(id, { type: PanelType.GroupV1Members })
}
>
{i18n('showMembers')}
</MenuItem>
) : null}

View file

@ -14,6 +14,7 @@ import type {
ConversationType,
ConversationTypeType,
InteractionModeType,
PushPanelForConversationActionType,
SaveAttachmentActionCreatorType,
ShowConversationType,
} from '../../state/ducks/conversations';
@ -89,6 +90,7 @@ import { PaymentEventKind } from '../../types/Payment';
import type { AnyPaymentEvent } from '../../types/Payment';
import { Emojify } from './Emojify';
import { getPaymentEventDescription } from '../../messages/helpers';
import { PanelType } from '../../types/Panels';
const GUESS_METADATA_WIDTH_TIMESTAMP_SIZE = 10;
const GUESS_METADATA_WIDTH_EXPIRE_TIMER_SIZE = 18;
@ -302,13 +304,7 @@ export type PropsActions = {
startConversation: (e164: string, uuid: UUIDStringType) => void;
showConversation: ShowConversationType;
openGiftBadge: (messageId: string) => void;
showContactDetail: (options: {
contact: EmbeddedContactType;
signalAccount?: {
phoneNumber: string;
uuid: UUIDStringType;
};
}) => void;
pushPanelForConversation: PushPanelForConversationActionType;
showContactModal: (contactId: string, conversationId?: string) => void;
kickOffAttachmentDownload: (options: {
@ -1566,10 +1562,11 @@ export class Message extends React.PureComponent<Props, State> {
public renderEmbeddedContact(): JSX.Element | null {
const {
contact,
conversationId,
conversationType,
direction,
i18n,
showContactDetail,
pushPanelForConversation,
text,
} = this.props;
if (!contact) {
@ -1601,9 +1598,12 @@ export class Message extends React.PureComponent<Props, State> {
}
: undefined;
showContactDetail({
contact,
signalAccount,
pushPanelForConversation(conversationId, {
type: PanelType.ContactDetails,
args: {
contact,
signalAccount,
},
});
}}
withContentAbove={withContentAbove}
@ -2238,6 +2238,7 @@ export class Message extends React.PureComponent<Props, State> {
const {
attachments,
contact,
conversationId,
showLightboxForViewOnceMedia,
direction,
giftBadge,
@ -2247,7 +2248,7 @@ export class Message extends React.PureComponent<Props, State> {
kickOffAttachmentDownload,
startConversation,
openGiftBadge,
showContactDetail,
pushPanelForConversation,
showLightbox,
showExpiredIncomingTapToViewToast,
showExpiredOutgoingTapToViewToast,
@ -2374,7 +2375,13 @@ export class Message extends React.PureComponent<Props, State> {
uuid: contact.uuid,
}
: undefined;
showContactDetail({ contact, signalAccount });
pushPanelForConversation(conversationId, {
type: PanelType.ContactDetails,
args: {
contact,
signalAccount,
},
});
event.preventDefault();
event.stopPropagation();

View file

@ -83,7 +83,7 @@ const createProps = (overrideProps: Partial<Props> = {}): Props => ({
openLink: action('openLink'),
renderAudioAttachment: () => <div>*AudioAttachment*</div>,
saveAttachment: action('saveAttachment'),
showContactDetail: action('showContactDetail'),
pushPanelForConversation: action('pushPanelForConversation'),
showContactModal: action('showContactModal'),
showExpiredIncomingTapToViewToast: action(
'showExpiredIncomingTapToViewToast'

View file

@ -84,7 +84,6 @@ export type PropsBackboneActions = Pick<
| 'openGiftBadge'
| 'openLink'
| 'renderAudioAttachment'
| 'showContactDetail'
| 'showExpiredIncomingTapToViewToast'
| 'showExpiredOutgoingTapToViewToast'
| 'startConversation'
@ -95,6 +94,7 @@ export type PropsReduxActions = Pick<
| 'checkForAccount'
| 'clearSelectedMessage'
| 'doubleCheckMissingQuoteReference'
| 'pushPanelForConversation'
| 'saveAttachment'
| 'showContactModal'
| 'showConversation'
@ -292,9 +292,9 @@ export class MessageDetail extends React.Component<Props> {
markViewed,
openGiftBadge,
openLink,
pushPanelForConversation,
renderAudioAttachment,
saveAttachment,
showContactDetail,
showContactModal,
showConversation,
showExpiredIncomingTapToViewToast,
@ -339,6 +339,7 @@ export class MessageDetail extends React.Component<Props> {
showConversation={showConversation}
openGiftBadge={openGiftBadge}
openLink={openLink}
pushPanelForConversation={pushPanelForConversation}
renderAudioAttachment={renderAudioAttachment}
saveAttachment={saveAttachment}
shouldCollapseAbove={false}
@ -347,7 +348,6 @@ export class MessageDetail extends React.Component<Props> {
scrollToQuotedMessage={() => {
log.warn('MessageDetail: scrollToQuotedMessage called!');
}}
showContactDetail={showContactDetail}
showContactModal={showContactModal}
showExpiredIncomingTapToViewToast={
showExpiredIncomingTapToViewToast

View file

@ -130,7 +130,7 @@ const defaultMessageProps: TimelineMessagesProps = {
shouldCollapseAbove: false,
shouldCollapseBelow: false,
shouldHideMetadata: false,
showContactDetail: action('default--showContactDetail'),
pushPanelForConversation: action('default--pushPanelForConversation'),
showContactModal: action('default--showContactModal'),
showExpiredIncomingTapToViewToast: action(
'showExpiredIncomingTapToViewToast'

View file

@ -283,7 +283,7 @@ const actions = () => ({
deleteMessageForEveryone: action('deleteMessageForEveryone'),
showMessageDetail: action('showMessageDetail'),
saveAttachment: action('saveAttachment'),
showContactDetail: action('showContactDetail'),
pushPanelForConversation: action('pushPanelForConversation'),
showContactModal: action('showContactModal'),
showConversation: action('showConversation'),
kickOffAttachmentDownload: action('kickOffAttachmentDownload'),

View file

@ -248,7 +248,6 @@ const getActions = createSelector(
'showMessageDetail',
'openGiftBadge',
'setQuoteByMessageId',
'showContactDetail',
'showContactModal',
'kickOffAttachmentDownload',
'markAttachmentAsCorrupted',
@ -257,6 +256,7 @@ const getActions = createSelector(
'showLightbox',
'showLightboxForViewOnceMedia',
'openLink',
'pushPanelForConversation',
'scrollToQuotedMessage',
'showExpiredIncomingTapToViewToast',
'showExpiredOutgoingTapToViewToast',

View file

@ -81,7 +81,7 @@ const getDefaultProps = () => ({
showConversation: action('showConversation'),
openGiftBadge: action('openGiftBadge'),
saveAttachment: action('saveAttachment'),
showContactDetail: action('showContactDetail'),
pushPanelForConversation: action('pushPanelForConversation'),
showContactModal: action('showContactModal'),
showLightbox: action('showLightbox'),
toggleForwardMessageModal: action('toggleForwardMessageModal'),

View file

@ -308,7 +308,7 @@ const createProps = (overrideProps: Partial<Props> = {}): Props => ({
shouldHideMetadata: isBoolean(overrideProps.shouldHideMetadata)
? overrideProps.shouldHideMetadata
: false,
showContactDetail: action('showContactDetail'),
pushPanelForConversation: action('pushPanelForConversation'),
showContactModal: action('showContactModal'),
showExpiredIncomingTapToViewToast: action(
'showExpiredIncomingTapToViewToast'

View file

@ -81,13 +81,7 @@ const createProps = (
showAllMedia: action('showAllMedia'),
showContactModal: action('showContactModal'),
pushPanelForConversation: action('pushPanelForConversation'),
showGroupLinkManagement: action('showGroupLinkManagement'),
showGroupV2Permissions: action('showGroupV2Permissions'),
showConversationNotificationsSettings: action(
'showConversationNotificationsSettings'
),
showConversation: action('showConversation'),
showPendingInvites: action('showPendingInvites'),
showLightboxWithMedia: action('showLightboxWithMedia'),
updateGroupAttributes: async () => {
action('updateGroupAttributes')();

View file

@ -82,10 +82,6 @@ export type StateProps = {
pendingApprovalMemberships: ReadonlyArray<GroupV2RequestingMembership>;
pendingMemberships: ReadonlyArray<GroupV2PendingMembership>;
showAllMedia: () => void;
showGroupLinkManagement: () => void;
showGroupV2Permissions: () => void;
showPendingInvites: () => void;
showConversationNotificationsSettings: () => void;
updateGroupAttributes: (
_: Readonly<{
avatar?: undefined | Uint8Array;
@ -161,12 +157,8 @@ export function ConversationDetails({
setMuteExpiration,
showAllMedia,
showContactModal,
showConversationNotificationsSettings,
showConversation,
showGroupLinkManagement,
showGroupV2Permissions,
showLightboxWithMedia,
showPendingInvites,
theme,
toggleSafetyNumberModal,
toggleAddUserToAnotherGroupModal,
@ -451,7 +443,11 @@ export function ConversationDetails({
/>
}
label={i18n('ConversationDetails--notifications')}
onClick={showConversationNotificationsSettings}
onClick={() =>
pushPanelForConversation(conversation.id, {
type: PanelType.NotificationSettings,
})
}
right={
conversation.muteExpiresAt
? getMutedUntilText(conversation.muteExpiresAt, i18n)
@ -503,7 +499,11 @@ export function ConversationDetails({
/>
}
label={i18n('ConversationDetails--group-link')}
onClick={showGroupLinkManagement}
onClick={() =>
pushPanelForConversation(conversation.id, {
type: PanelType.GroupLinkManagement,
})
}
right={hasGroupLink ? i18n('on') : i18n('off')}
/>
) : null}
@ -515,7 +515,11 @@ export function ConversationDetails({
/>
}
label={i18n('ConversationDetails--requests-and-invites')}
onClick={showPendingInvites}
onClick={() =>
pushPanelForConversation(conversation.id, {
type: PanelType.GroupInvites,
})
}
right={invitesCount}
/>
{isAdmin ? (
@ -527,7 +531,11 @@ export function ConversationDetails({
/>
}
label={i18n('permissions')}
onClick={showGroupV2Permissions}
onClick={() =>
pushPanelForConversation(conversation.id, {
type: PanelType.GroupPermissions,
})
}
/>
) : null}
</PanelSection>