diff --git a/stylesheets/_modules.scss b/stylesheets/_modules.scss index 31f2aa42d..348979368 100644 --- a/stylesheets/_modules.scss +++ b/stylesheets/_modules.scss @@ -366,27 +366,6 @@ } } -.module-conversation-header__expiration { - display: flex; - flex-direction: row; - align-items: center; - padding-inline-start: 8px; - padding-inline-end: 8px; - flex-shrink: 0; -} - -.module-conversation-header__expiration__clock-icon { - @include color-svg('../images/timer.svg', var(--button-icon-stroke-color)); - height: 20px; - width: 20px; - display: inline-block; -} - -.module-conversation-header__expiration__setting { - margin-inline-start: 5px; - text-align: center; -} - // Module: Message Detail .module-message-detail { diff --git a/ts/components/conversation/ConversationHeader.tsx b/ts/components/conversation/ConversationHeader.tsx index f1176994b..d96f29833 100644 --- a/ts/components/conversation/ConversationHeader.tsx +++ b/ts/components/conversation/ConversationHeader.tsx @@ -33,12 +33,7 @@ import { } from '../../state/ducks/conversations'; import { callRecipient } from '../../interactions/conversationInteractions'; import { getHasIncomingCall, getHasOngoingCall } from '../../state/selectors/call'; -import { - useConversationUsername, - useExpireTimer, - useIsKickedFromGroup, - useIsRequest, -} from '../../hooks/useParamSelector'; +import { useConversationUsername, useIsRequest } from '../../hooks/useParamSelector'; import { SessionButton, SessionButtonColor, @@ -52,6 +47,7 @@ import { DisappearingMessageConversationType, ExpirationTimerOptions, } from '../../util/expiringMessages'; +import { setRightOverlayMode } from '../../state/ducks/section'; export interface TimerOption { name: string; @@ -171,26 +167,6 @@ const TripleDotsMenu = (props: { triggerId: string; showBackButton: boolean }) = ); }; -const ExpirationLength = (props: { expirationSettingName?: string }) => { - const { expirationSettingName } = props; - - if (!expirationSettingName) { - return null; - } - - return ( -
-
-
- {expirationSettingName} -
-
- ); -}; - const AvatarHeader = (props: { pubkey: string; showBackButton: boolean; @@ -417,13 +393,18 @@ const ConversationHeaderTitle = () => { return (
{ - // if (isRightPanelOn) { - // dispatch(closeRightPanel()); - // } else { - // dispatch(openRightPanel()); - // } - // }} + onClick={() => { + if (isRightPanelOn) { + dispatch(closeRightPanel()); + } else { + if (visibleTitleIndex === 2) { + dispatch(setRightOverlayMode('disappearing-messages')); + } else { + dispatch(setRightOverlayMode('panel-settings')); + } + dispatch(openRightPanel()); + } + }} role="button" > @@ -491,12 +472,6 @@ export const ConversationHeaderWithDetails = () => { return null; } - const isKickedFromGroup = useIsKickedFromGroup(selectedConvoKey); - const expireTimerSetting = useExpireTimer(selectedConvoKey); - const expirationSettingName = expireTimerSetting - ? ExpirationTimerOptions.getName(expireTimerSetting || 0) - : undefined; - const triggerId = 'conversation-header'; return ( @@ -524,9 +499,6 @@ export const ConversationHeaderWithDetails = () => { flexGrow={0} flexShrink={0} > - {!isKickedFromGroup && ( - - )} {