mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

Moves various panels out to ConversationView react

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

2
ts/components/CompositionArea.stories.tsx
View file

@ -92,7 +92,7 @@ const useProps = (overrideProps: Partial<Props> = {}): Props => ({
blessedPacks: [],
recentStickers: [],
clearInstalledStickerPack: action('clearInstalledStickerPack'),
onClickAddPack: action('onClickAddPack'),
pushPanelForConversation: action('pushPanelForConversation'),
sendStickerMessage: action('sendStickerMessage'),
clearShowIntroduction: action('clearShowIntroduction'),
showPickerHint: false,

16
ts/components/CompositionArea.tsx
View file

@ -42,6 +42,7 @@ import { AudioCapture } from './conversation/AudioCapture';
import { CompositionUpload } from './CompositionUpload';
import type {
ConversationType,
PushPanelForConversationActionType,
ShowConversationType,
} from '../state/ducks/conversations';
import type { EmojiPickDataType } from './emoji/EmojiPicker';
@ -61,6 +62,7 @@ import { MediaEditor } from './MediaEditor';
import { isImageTypeSupported } from '../util/GoogleChrome';
import * as KeyboardLayout from '../services/keyboardLayout';
import { usePrevious } from '../hooks/usePrevious';
import { PanelType } from '../types/Panels';
export type OwnProps = Readonly<{
acceptedMessageRequest?: boolean;
@ -162,15 +164,15 @@ export type Props = Pick<
| 'blessedPacks'
| 'recentStickers'
| 'clearInstalledStickerPack'
| 'onClickAddPack'
| 'clearShowIntroduction'
| 'showPickerHint'
| 'clearShowPickerHint'
> &
MessageRequestActionsProps &
Pick<GroupV1DisabledActionsPropsType, 'showGV2MigrationDialog'> &
Pick<GroupV2PendingApprovalActionsPropsType, 'onCancelJoinRequest'> &
OwnProps;
Pick<GroupV2PendingApprovalActionsPropsType, 'onCancelJoinRequest'> & {
pushPanelForConversation: PushPanelForConversationActionType;
} & OwnProps;
export function CompositionArea({
// Base props
@ -182,6 +184,7 @@ export function CompositionArea({
isDisabled,
isSignalConversation,
messageCompositionId,
pushPanelForConversation,
processAttachments,
removeAttachment,
sendMultiMediaMessage,
@ -232,7 +235,6 @@ export function CompositionArea({
blessedPacks,
recentStickers,
clearInstalledStickerPack,
onClickAddPack,
sendStickerMessage,
clearShowIntroduction,
showPickerHint,
@ -459,7 +461,11 @@ export function CompositionArea({
blessedPacks={blessedPacks}
recentStickers={recentStickers}
clearInstalledStickerPack={clearInstalledStickerPack}
onClickAddPack={onClickAddPack}
onClickAddPack={() =>
pushPanelForConversation(conversationId, {
type: PanelType.StickerManager,
})
}
onPickSticker={(packId, stickerId) =>
sendStickerMessage(conversationId, { packId, stickerId })
}

5
ts/components/StoryViewsNRepliesModal.tsx
View file

@ -56,16 +56,15 @@ const MESSAGE_DEFAULT_PROPS = {
markAttachmentAsCorrupted: shouldNeverBeCalled,
markViewed: shouldNeverBeCalled,
messageExpanded: shouldNeverBeCalled,
// Called when clicking mention, but shouldn't do anything.
showConversation: noop,
openGiftBadge: shouldNeverBeCalled,
openLink: shouldNeverBeCalled,
previews: [],
pushPanelForConversation: shouldNeverBeCalled,
renderAudioAttachment: () => <div />,
saveAttachment: shouldNeverBeCalled,
scrollToQuotedMessage: shouldNeverBeCalled,
showContactDetail: shouldNeverBeCalled,
showContactModal: shouldNeverBeCalled,
showConversation: noop,
showExpiredIncomingTapToViewToast: shouldNeverBeCalled,
showExpiredOutgoingTapToViewToast: shouldNeverBeCalled,
showLightbox: shouldNeverBeCalled,

2
ts/components/conversation/ConversationHeader.stories.tsx
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'),

16
ts/components/conversation/ConversationHeader.tsx
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}

33
ts/components/conversation/Message.tsx
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();

2
ts/components/conversation/MessageDetail.stories.tsx
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'

6
ts/components/conversation/MessageDetail.tsx
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

2
ts/components/conversation/Quote.stories.tsx
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'

2
ts/components/conversation/Timeline.stories.tsx
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'),

2
ts/components/conversation/Timeline.tsx
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',

2
ts/components/conversation/TimelineItem.stories.tsx
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'),

2
ts/components/conversation/TimelineMessage.stories.tsx
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'

6
ts/components/conversation/conversation-details/ConversationDetails.stories.tsx
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')();

32
ts/components/conversation/conversation-details/ConversationDetails.tsx
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>