Skip to content

Commit 7a6e3e9

Browse files
BilbBilb
authored
Merge pull request #1568 from session-foundation/more-pro-badges-fixes
fix: more pro badges fixes
2 parents f3091a2 + 2026495 commit 7a6e3e9

File tree

18 files changed

+98
-39
lines changed

18 files changed

+98
-39
lines changed

‎ts/components/AboutView.tsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { switchThemeTo } from '../themes/switchTheme';
77
import { SessionToastContainer } from './SessionToastContainer';
88
import { Flex } from './basic/Flex';
99
import { themeStore } from '../state/theme/store';
10-
import { SessionButton, SessionButtonType } from './basic/SessionButton';
10+
import { SessionButton, SessionButtonColor, SessionButtonType } from './basic/SessionButton';
1111
import { Localizer } from './basic/Localizer';
1212
import { CopyToClipboardButton } from './buttons';
1313
import { tr } from '../localization/localeTools';
@@ -102,6 +102,7 @@ export const AboutView = () => {
102102
className="version"
103103
text={versionInfo}
104104
buttonType={SessionButtonType.Simple}
105+
buttonColor={SessionButtonColor.TextPrimary}
105106
/>
106107
<SessionButton
107108
buttonType={SessionButtonType.Simple}
@@ -119,17 +120,20 @@ export const AboutView = () => {
119120
className="os"
120121
text={systemInfo}
121122
buttonType={SessionButtonType.Simple}
123+
buttonColor={SessionButtonColor.TextPrimary}
122124
/>
123125
<CopyToClipboardButton
124126
className="commitHash"
125127
text={commitInfo}
126128
buttonType={SessionButtonType.Simple}
129+
buttonColor={SessionButtonColor.TextPrimary}
127130
/>
128131
{environmentStates.length ? (
129132
<CopyToClipboardButton
130133
className="environment"
131134
text={environmentStates.join(' - ')}
132135
buttonType={SessionButtonType.Simple}
136+
buttonColor={SessionButtonColor.TextPrimary}
133137
/>
134138
) : null}
135139
<a href="https://getsession.org" style={{ margin: '0 0 var(--margins-lg) 0' }}>

‎ts/components/SessionWrapperModal.tsx‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -190,20 +190,23 @@ export function ModalBottomButtonWithBorder({
190190
onClick,
191191
buttonColor,
192192
dataTestId,
193+
buttonType,
193194
disabled,
194195
}: {
195196
text: string;
196197
onClick: () => void | Promise<void>;
197198
disabled?: boolean;
198199
buttonColor?: SessionButtonColor;
199200
dataTestId?: SessionDataTestId;
201+
buttonType?: SessionButtonType;
200202
}) {
201203
return (
202204
<SessionButton
203205
text={text}
204206
onClick={onClick}
205207
disabled={disabled}
206208
buttonColor={buttonColor}
209+
buttonType={buttonType}
207210
dataTestId={dataTestId}
208211
style={{ minWidth: 'var(--modal-actions-outline-min-width)' }}
209212
/>

‎ts/components/basic/SessionButton.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,7 @@ export enum SessionButtonColor {
2424
Purple = 'purple',
2525
Orange = 'orange',
2626
Red = 'red',
27-
White = 'white',
28-
Black = 'black',
27+
TextPrimary = 'text-primary',
2928
Grey = 'gray',
3029
Primary = 'primary',
3130
Tertiary = 'background-tertiary',

‎ts/components/buttons/CopyToClipboardButton.tsx‎

Lines changed: 18 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import useTimeoutFn from 'react-use/lib/useTimeoutFn';
55

66
import { useHotkey } from '../../hooks/useHotkey';
77
import { ToastUtils } from '../../session/utils';
8-
import { SessionButtonProps } from '../basic/SessionButton';
8+
import { SessionButtonProps, type SessionButtonColor } from '../basic/SessionButton';
99
import { SessionIconButtonProps, SessionLucideIconButton } from '../icon/SessionIconButton';
1010
import { LUCIDE_ICONS_UNICODE } from '../icon/lucide';
1111
import type { SessionIconSize } from '../icon';
@@ -17,12 +17,22 @@ type CopyProps = {
1717
copyContent?: string;
1818
onCopyComplete?: (copiedValue: string | undefined) => void;
1919
hotkey?: boolean;
20-
};
20+
} & { buttonColor: SessionButtonColor };
2121

22-
type CopyToClipboardButtonProps = Omit<SessionButtonProps, 'children' | 'onClick'> & CopyProps;
22+
type CopyToClipboardButtonProps = Omit<SessionButtonProps, 'children' | 'onClick' | 'buttonColor'> &
23+
CopyProps;
2324

2425
export const CopyToClipboardButton = (props: CopyToClipboardButtonProps) => {
25-
const { copyContent, onCopyComplete, hotkey = false, text } = props;
26+
const {
27+
copyContent,
28+
onCopyComplete,
29+
hotkey = false,
30+
text,
31+
buttonType,
32+
buttonColor,
33+
dataTestId,
34+
disabled,
35+
} = props;
2636
const [copied, setCopied] = useState(false);
2737

2838
// reset the copied state after 5 seconds
@@ -59,9 +69,10 @@ export const CopyToClipboardButton = (props: CopyToClipboardButtonProps) => {
5969
aria-label={'copy to clipboard button'}
6070
text={text && !isEmpty(text) ? text : copied ? tr('copied') : tr('copy')}
6171
onClick={onClick}
62-
buttonColor={props.buttonColor}
63-
dataTestId={props.dataTestId}
64-
disabled={props.disabled}
72+
buttonColor={buttonColor}
73+
dataTestId={dataTestId}
74+
disabled={disabled}
75+
buttonType={buttonType}
6576
/>
6677
);
6778
};

‎ts/components/conversation/ContactName/ContactName.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -246,7 +246,10 @@ export const ContactName = ({
246246
const shouldShowShortenPkAsName = !displayName;
247247

248248
const shouldShowPubkey =
249-
!shouldShowShortenPkAsName && isPublic && isShowPubkeyCtx(contactNameContext, isBlinded);
249+
!shouldShowShortenPkAsName &&
250+
!isMe &&
251+
isPublic &&
252+
isShowPubkeyCtx(contactNameContext, isBlinded);
250253
const boldProfileName = isBoldProfileNameCtx(contactNameContext);
251254
const forceSingleLine = isForceSingleLineCtx(contactNameContext);
252255

‎ts/components/conversation/right-panel/overlay/message-info/components/MessageFrom.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import { ContactName } from '../../../../ContactName/ContactName';
1010
import { useSelectedConversationKey } from '../../../../../../state/selectors/selectedConversation';
1111
import { useShowUserDetailsCbFromConversation } from '../../../../../menuAndSettingsHooks/useShowUserDetailsCb';
1212
import { PubKey } from '../../../../../../session/types';
13+
import { SessionButtonColor } from '../../../../../basic/SessionButton';
1314

1415
const StyledFromContainer = styled.div`
1516
display: flex;
@@ -60,6 +61,7 @@ export const MessageFrom = (props: { sender: string; isSenderAdmin: boolean }) =
6061
iconSize={'small'}
6162
copyContent={`${profileName} ${sender}`}
6263
margin={'0 0 0 var(--margins-xs)'}
64+
buttonColor={SessionButtonColor.TextPrimary}
6365
/>
6466
) : null}
6567
</Flex>

‎ts/components/conversation/right-panel/overlay/message-info/components/MessageInfo.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ import { useCurrentUserHasPro } from '../../../../../../hooks/useHasPro';
3939
import { ProIconButton } from '../../../../../buttons/ProButton';
4040
import { assertUnreachable } from '../../../../../../types/sqlSharedTypes';
4141
import { ProMessageFeature } from '../../../../../../models/proMessageFeature';
42+
import { SessionButtonColor } from '../../../../../basic/SessionButton';
4243

4344
export const MessageInfoLabel = styled.label<{ color?: string }>`
4445
font-size: var(--font-size-lg);
@@ -78,6 +79,7 @@ export const LabelWithInfo = (props: LabelWithInfoProps) => {
7879
iconSize={'small'}
7980
copyContent={props.info}
8081
margin={'0 0 0 var(--margins-xs)'}
82+
buttonColor={SessionButtonColor.TextPrimary}
8183
/>
8284
) : null}
8385
</Flex>

‎ts/components/dialog/ReactListModal.tsx‎

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -92,12 +92,11 @@ type ReactionSendersProps = {
9292
currentReact: string;
9393
senders: Array<string>;
9494
me: string;
95-
handleClose: () => void;
9695
conversationId: string;
9796
};
9897

9998
const ReactionSenders = (props: ReactionSendersProps) => {
100-
const { messageId, currentReact, senders, me, handleClose, conversationId } = props;
99+
const { messageId, currentReact, senders, me, conversationId } = props;
101100
const dispatch = useDispatch();
102101

103102
const handleRemoveReaction = async () => {
@@ -123,13 +122,7 @@ const ReactionSenders = (props: ReactionSendersProps) => {
123122
style={{ overflow: 'hidden' }}
124123
$flexGap="var(--margins-sm)"
125124
>
126-
<Avatar
127-
size={AvatarSize.XS}
128-
pubkey={sender}
129-
onAvatarClick={() => {
130-
handleClose();
131-
}}
132-
/>
125+
<Avatar size={AvatarSize.XS} pubkey={sender} onAvatarClick={undefined} />
133126
{sender === me ? (
134127
tr('you')
135128
) : (
@@ -363,7 +356,6 @@ export const ReactListModal = (props: Props) => {
363356
currentReact={currentReact}
364357
senders={senders}
365358
me={me}
366-
handleClose={handleClose}
367359
conversationId={selectedConvoKey}
368360
/>
369361
)}

‎ts/components/dialog/SessionProInfoModal.tsx‎

Lines changed: 16 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -266,6 +266,13 @@ export function SessionProInfoModal(props: SessionProInfoState) {
266266
}
267267
const isGroupCta = props.variant === SessionProInfoVariant.GROUP_ACTIVATED;
268268

269+
/**
270+
* Note: the group activated cta is quite custom, but whatever the pro status of the current pro user,
271+
* we do not want to show the CTA for "subscribe to pro".
272+
* An admin have subscribed and that's all that's needed to make this group a Pro group.
273+
*/
274+
const hasNoProAndNotGroupCta = !hasPro && !isGroupCta;
275+
269276
return (
270277
<SessionWrapperModal
271278
onClose={onClose}
@@ -283,14 +290,14 @@ export function SessionProInfoModal(props: SessionProInfoState) {
283290
display: 'grid',
284291
alignItems: 'center',
285292
justifyItems: 'center',
286-
gridTemplateColumns: hasPro ? '1fr' : '1fr 1fr',
293+
gridTemplateColumns: !hasNoProAndNotGroupCta ? '1fr' : '1fr 1fr',
287294
columnGap: 'var(--margins-sm)',
288295
paddingInline: 'var(--margins-md)',
289296
marginBottom: 'var(--margins-md)',
290297
height: 'unset',
291298
}}
292299
>
293-
{!hasPro ? (
300+
{hasNoProAndNotGroupCta ? (
294301
<SessionButtonShiny
295302
{...buttonProps}
296303
shinyContainerStyle={{
@@ -308,24 +315,26 @@ export function SessionProInfoModal(props: SessionProInfoState) {
308315
buttonColor={SessionButtonColor.Tertiary}
309316
onClick={onClose}
310317
dataTestId="modal-session-pro-cancel-button"
311-
style={hasPro ? { ...buttonProps.style, width: '50%' } : buttonProps.style}
318+
style={
319+
!hasNoProAndNotGroupCta ? { ...buttonProps.style, width: '50%' } : buttonProps.style
320+
}
312321
>
313-
{tr(hasPro ? 'close' : 'cancel')}
322+
{tr(!hasNoProAndNotGroupCta ? 'close' : 'cancel')}
314323
</SessionButton>
315324
</ModalActionsContainer>
316325
}
317326
>
318327
<SpacerSM />
319-
<StyledCTATitle reverseDirection={hasPro}>
320-
{tr(hasPro ? (isGroupCta ? 'proGroupActivated' : 'proActivated') : 'upgradeTo')}
328+
<StyledCTATitle reverseDirection={!hasNoProAndNotGroupCta}>
329+
{tr(isGroupCta ? 'proGroupActivated' : hasPro ? 'proActivated' : 'upgradeTo')}
321330
<ProIconButton iconSize={'huge'} dataTestId="invalid-data-testid" onClick={undefined} />
322331
</StyledCTATitle>
323332
<SpacerXL />
324333
<StyledContentContainer>
325334
<StyledScrollDescriptionContainer>
326335
{getDescription(props.variant)}
327336
</StyledScrollDescriptionContainer>
328-
{!hasPro ? (
337+
{hasNoProAndNotGroupCta ? (
329338
<StyledFeatureList>
330339
{getFeatureList(props.variant).map(token => (
331340
<FeatureListItem>{tr(token)}</FeatureListItem>

‎ts/components/dialog/UserProfileModal.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,7 @@ export const UserProfileModal = ({
115115
{!isBlindedAndNotResolved && (
116116
<CopyToClipboardButton
117117
copyContent={conversationIdToDisplay}
118-
buttonColor={SessionButtonColor.PrimaryDark}
118+
buttonColor={SessionButtonColor.TextPrimary}
119119
dataTestId="copy-button-account-id"
120120
buttonType={SessionButtonType.Outline}
121121
hotkey={true}

0 commit comments

Comments
 (0)