oxen-io
/
session-desktop
mirror of https://github.com/oxen-io/session-desktop.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

removed the enum from SessionIconType. Just rely on the type itself

This commit is contained in:
audric 2021-08-30 17:57:31 +10:00
parent a53392853f
commit a30876fd65
37 changed files with 232 additions and 318 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
ts/components/ConversationListItem.tsx
View File

@ -22,7 +22,7 @@ import {
} from '../state/ducks/conversations';
import _ from 'underscore';
import { useMembersAvatars } from '../hooks/useMembersAvatar';
import { SessionIcon, SessionIconType } from './session/icon';
import { SessionIcon } from './session/icon';
import { useSelector } from 'react-redux';
import { SectionType } from '../state/ducks/section';
import { getFocusedSection } from '../state/selectors/section';
@ -85,11 +85,7 @@ const HeaderItem = (props: {
const pinIcon =
isMessagesSection && isPinned ? (
<SessionIcon
iconType={SessionIconType.Pin}
iconColor={theme.colors.textColorSubtle}
iconSize={'tiny'}
/>
<SessionIcon iconType="pin" iconColor={theme.colors.textColorSubtle} iconSize={'tiny'} />
) : null;
const NotificationSettingIcon = () => {
@ -102,19 +98,11 @@ const HeaderItem = (props: {
return null;
case 'disabled':
return (
<SessionIcon
iconType={SessionIconType.Mute}
iconColor={theme.colors.textColorSubtle}
iconSize={'tiny'}
/>
<SessionIcon iconType="mute" iconColor={theme.colors.textColorSubtle} iconSize={'tiny'} />
);
case 'mentions_only':
return (
<SessionIcon
iconType={SessionIconType.BellMention}
iconColor={theme.colors.textColorSubtle}
iconSize={'tiny'}
/>
<SessionIcon iconType="bell" iconColor={theme.colors.textColorSubtle} iconSize={'tiny'} />
);
default:
return null;

6
ts/components/Lightbox.tsx
View File

@ -143,7 +143,7 @@ const IconButton = ({ onClick, type, theme }: IconButtonProps) => {
onClick();
};
let iconRotation = 0;
let iconType = SessionIconType.Chevron;
let iconType: SessionIconType = 'chevron';
switch (type) {
case 'next':
iconRotation = 270;
@ -152,10 +152,10 @@ const IconButton = ({ onClick, type, theme }: IconButtonProps) => {
iconRotation = 90;
break;
case 'close':
iconType = SessionIconType.Exit;
iconType = 'exit';
break;
case 'save':
iconType = SessionIconType.Upload;
iconType = 'upload';
iconRotation = 180;
break;

17
ts/components/conversation/ConversationHeader.tsx
View File

@ -2,7 +2,7 @@ import React from 'react';
import { Avatar, AvatarSize } from '../Avatar';
import { SessionIconButton, SessionIconType } from '../session/icon';
import { SessionIconButton } from '../session/icon';
import { SessionButton, SessionButtonColor, SessionButtonType } from '../session/SessionButton';
import { ConversationAvatar } from '../session/usingClosedConversationDetails';
@ -84,11 +84,7 @@ const SelectionOverlay = (props: {
return (
<div className="message-selection-overlay">
<div className="close-button">
<SessionIconButton
iconType={SessionIconType.Exit}
iconSize={'medium'}
onClick={onCloseOverlay}
/>
<SessionIconButton iconType="exit" iconSize={'medium'} onClick={onCloseOverlay} />
</div>
<div className="button-group">
@ -118,7 +114,7 @@ const TripleDotsMenu = (props: { triggerId: string; showBackButton: boolean }) =
});
}}
>
<SessionIconButton iconType={SessionIconType.Ellipses} iconSize={'medium'} />
<SessionIconButton iconType="ellipses" iconSize={'medium'} />
</div>
);
};
@ -176,12 +172,7 @@ const BackButton = (props: { onGoBack: () => void; showBackButton: boolean }) =>
}
return (
<SessionIconButton
iconType={SessionIconType.Chevron}
iconSize={'large'}
iconRotation={90}
onClick={onGoBack}
/>
<SessionIconButton iconType="chevron" iconSize={'large'} iconRotation={90} onClick={onGoBack} />
);
};

9
ts/components/conversation/DataExtractionNotification.tsx
View File

@ -3,7 +3,7 @@ import { useTheme } from 'styled-components';
import { PropsForDataExtractionNotification } from '../../models/messageType';
import { SignalService } from '../../protobuf';
import { Flex } from '../basic/Flex';
import { SessionIcon, SessionIconType } from '../session/icon';
import { SessionIcon } from '../session/icon';
import { SpacerXS, Text } from '../basic/Text';
import { ReadableMessage } from './ReadableMessage';
@ -32,12 +32,7 @@ export const DataExtractionNotification = (props: PropsForDataExtractionNotifica
margin={theme.common.margins.sm}
id={`msg-${messageId}`}
>
<SessionIcon
iconType={SessionIconType.Upload}
theme={theme}
iconSize={'small'}
iconRotation={180}
/>
<SessionIcon iconType="upload" theme={theme} iconSize={'small'} iconRotation={180} />
<SpacerXS />
<Text text={contentText} subtle={true} />
</Flex>

4
ts/components/conversation/GroupInvitation.tsx
View File

@ -1,6 +1,6 @@
import React from 'react';
import classNames from 'classnames';
import { SessionIconButton, SessionIconType } from '../session/icon';
import { SessionIconButton } from '../session/icon';
import { useTheme } from 'styled-components';
import { PropsForGroupInvitation } from '../../state/ducks/conversations';
import { acceptOpenGroupInvitation } from '../../interactions/messageInteractions';
@ -27,7 +27,7 @@ export const GroupInvitation = (props: PropsForGroupInvitation) => {
<div className={classNames(classes)}>
<div className="contents">
<SessionIconButton
iconType={SessionIconType.Plus}
iconType="plus"
iconColor={theme.colors.accent}
theme={theme}
iconSize={'large'}

6
ts/components/conversation/H5AudioPlayer.tsx
View File

@ -10,7 +10,7 @@ import {
getSortedMessagesOfSelectedConversation,
} from '../../state/selectors/conversations';
import { getAudioAutoplay } from '../../state/selectors/userConfig';
import { SessionIcon, SessionIconType } from '../session/icon';
import { SessionIcon } from '../session/icon';
import { SessionButton, SessionButtonColor, SessionButtonType } from '../session/SessionButton';
export const AudioPlayerWithEncryptedFile = (props: {
@ -109,7 +109,7 @@ export const AudioPlayerWithEncryptedFile = (props: {
customIcons={{
play: (
<SessionIcon
iconType={SessionIconType.Play}
iconType="play"
iconSize={'small'}
iconColor={theme.colors.textColorSubtle}
theme={theme}
@ -117,7 +117,7 @@ export const AudioPlayerWithEncryptedFile = (props: {
),
pause: (
<SessionIcon
iconType={SessionIconType.Pause}
iconType="pause"
iconSize={'small'}
iconColor={theme.colors.textColorSubtle}
theme={theme}

8
ts/components/conversation/TimerNotification.tsx
View File

@ -3,7 +3,7 @@ import React from 'react';
import { Intl } from '../Intl';
import { missingCaseError } from '../../util/missingCaseError';
import { SessionIcon, SessionIconType } from '../session/icon';
import { SessionIcon } from '../session/icon';
import { PropsForExpirationTimer } from '../../state/ducks/conversations';
import { ReadableMessage } from './ReadableMessage';
@ -46,11 +46,7 @@ export const TimerNotification = (props: PropsForExpirationTimer) => {
<div className="module-timer-notification" id={`msg-${props.messageId}`}>
<div className="module-timer-notification__message">
<div>
<SessionIcon
iconType={SessionIconType.Stopwatch}
iconSize={'small'}
iconColor={'#ABABAB'}
/>
<SessionIcon iconType="stopwatch" iconSize={'small'} iconColor={'#ABABAB'} />
</div>
<div>

4
ts/components/conversation/message/ClickToTrustSender.tsx
View File

@ -4,7 +4,7 @@ import { getMessageById, getMessagesByConversation } from '../../../data/data';
import { getConversationController } from '../../../session/conversations';
import { AttachmentDownloads } from '../../../session/utils';
import { updateConfirmModal } from '../../../state/ducks/modalDialog';
import { SessionIcon, SessionIconType } from '../../session/icon';
import { SessionIcon } from '../../session/icon';
import { SessionButtonColor } from '../../session/SessionButton';
const StyledTrustSenderUI = styled.div`
@ -83,7 +83,7 @@ export const ClickToTrustSender = (props: { messageId: string }) => {
return (
<StyledTrustSenderUI onClick={openConfirmationModal}>
<SessionIcon iconSize={'small'} iconType={SessionIconType.Gallery} />
<SessionIcon iconSize={'small'} iconType="gallery" />
<ClickToDownload>{window.i18n('clickToTrustContact')}</ClickToDownload>
</StyledTrustSenderUI>
);

4
ts/components/conversation/message/MessagePreview.tsx
View File

@ -1,7 +1,7 @@
import classNames from 'classnames';
import React from 'react';
import { isImageAttachment } from '../../../types/Attachment';
import { SessionIcon, SessionIconType } from '../../session/icon';
import { SessionIcon } from '../../session/icon';
import { ImageGrid } from '../ImageGrid';
import { Image } from '../Image';
import { MINIMUM_LINK_PREVIEW_IMAGE_WIDTH } from '../Message';
@ -63,7 +63,7 @@ export const MessagePreview = (props: Props) => {
<div className="module-message__link-preview__icon_container">
<div className="module-message__link-preview__icon_container__inner">
<div className="module-message__link-preview__icon-container__circle-background">
<SessionIcon iconType={SessionIconType.Link} iconSize={'small'} />
<SessionIcon iconType="link" iconSize={'small'} />
</div>
</div>
</div>

23
ts/components/conversation/message/OutgoingMessageStatus.tsx
View File

@ -1,7 +1,7 @@
import React from 'react';
import styled, { useTheme } from 'styled-components';
import { MessageDeliveryStatus } from '../../../models/messageType';
import { SessionIcon, SessionIconType } from '../../session/icon';
import { SessionIcon } from '../../session/icon';
const MessageStatusSendingContainer = styled.div`
display: inline-block;
@ -13,12 +13,7 @@ const MessageStatusSending = () => {
const iconColor = useTheme().colors.textColor;
return (
<MessageStatusSendingContainer>
<SessionIcon
rotateDuration={2}
iconColor={iconColor}
iconType={SessionIconType.Sending}
iconSize={'tiny'}
/>
<SessionIcon rotateDuration={2} iconColor={iconColor} iconType="sending" iconSize={'tiny'} />
</MessageStatusSendingContainer>
);
};
@ -28,7 +23,7 @@ const MessageStatusSent = () => {
return (
<MessageStatusSendingContainer>
<SessionIcon iconColor={iconColor} iconType={SessionIconType.CircleCheck} iconSize={'tiny'} />
<SessionIcon iconColor={iconColor} iconType="circleCheck" iconSize={'tiny'} />
</MessageStatusSendingContainer>
);
};
@ -38,11 +33,7 @@ const MessageStatusRead = () => {
return (
<MessageStatusSendingContainer>
<SessionIcon
iconColor={iconColor}
iconType={SessionIconType.DoubleCheckCircleFilled}
iconSize={'tiny'}
/>
<SessionIcon iconColor={iconColor} iconType="doubleCheckCircleFilled" iconSize={'tiny'} />
</MessageStatusSendingContainer>
);
};
@ -51,11 +42,7 @@ const MessageStatusError = () => {
const theme = useTheme();
return (
<MessageStatusSendingContainer title={window.i18n('sendFailed')}>
<SessionIcon
iconColor={theme.colors.destructive}
iconType={SessionIconType.Error}
iconSize={'tiny'}
/>
<SessionIcon iconColor={theme.colors.destructive} iconType="error" iconSize={'tiny'} />
</MessageStatusSendingContainer>
);
};

8
ts/components/dialog/EditProfileDialog.tsx
View File

@ -6,7 +6,7 @@ import { Avatar, AvatarSize } from '../Avatar';
import { SessionButton, SessionButtonColor, SessionButtonType } from '../session/SessionButton';
import { SessionIconButton, SessionIconType } from '../session/icon';
import { SessionIconButton } from '../session/icon';
import { PillDivider } from '../session/PillDivider';
import { SyncUtils, ToastUtils, UserUtils } from '../../session/utils';
import { MAX_USERNAME_LENGTH } from '../session/registration/RegistrationStages';
@ -72,7 +72,7 @@ export class EditProfileDialog extends React.Component<{}, State> {
viewEdit || viewQR
? [
{
iconType: SessionIconType.Chevron,
iconType: 'chevron',
iconRotation: 90,
onClick: () => {
this.setState({ mode: 'default' });
@ -149,7 +149,7 @@ export class EditProfileDialog extends React.Component<{}, State> {
/>
<div className="qr-view-button">
<SessionIconButton
iconType={SessionIconType.QR}
iconType="qr"
iconSize={'small'}
iconColor={'rgb(0, 0, 0)'}
onClick={() => {
@ -184,7 +184,7 @@ export class EditProfileDialog extends React.Component<{}, State> {
<div className="profile-name-uneditable">
<p>{name}</p>
<SessionIconButton
iconType={SessionIconType.Pencil}
iconType="pencil"
iconSize={'medium'}
onClick={() => {
this.setState({ mode: 'edit' });

6
ts/components/dialog/OnionStatusPathDialog.tsx
View File

@ -18,7 +18,7 @@ import {
} from '../../state/selectors/onions';
import { getTheme } from '../../state/selectors/theme';
import { Flex } from '../basic/Flex';
import { SessionIcon, SessionIconButton, SessionIconType } from '../session/icon';
import { SessionIcon, SessionIconButton } from '../session/icon';
import { SessionSpinner } from '../session/SessionSpinner';
import { SessionWrapperModal } from '../session/SessionWrapperModal';
@ -123,7 +123,7 @@ export const ModalStatusLight = (props: StatusLightType) => {
iconColor={color}
glowDuration={glowDuration}
glowStartDelay={glowStartDelay}
iconType={SessionIconType.Circle}
iconType="circle"
iconSize={'tiny'}
theme={theme}
/>
@ -160,7 +160,7 @@ export const ActionPanelOnionStatusLight = (props: {
return (
<SessionIconButton
iconSize={'small'}
iconType={SessionIconType.Circle}
iconType="circle"
iconColor={iconColor}
onClick={handleClick}
glowDuration={10}

2
ts/components/dialog/SessionModal.tsx
View File

@ -82,7 +82,7 @@ export class SessionModal extends React.PureComponent<Props, State> {
<div className="session-modal__header__close">
{showExitIcon ? (
<SessionIconButton
iconType={SessionIconType.Exit}
iconType="exit"
iconSize={'small'}
onClick={this.close}
theme={this.props.theme}

5
ts/components/dialog/SessionPasswordDialog.tsx
View File

@ -3,7 +3,6 @@ import React from 'react';
import { SessionButton, SessionButtonColor } from '../session/SessionButton';
import { missingCaseError, PasswordUtil } from '../../util';
import { ToastUtils } from '../../session/utils';
import { SessionIconType } from '../session/icon';
import { getPasswordHash } from '../../data/data';
import { SessionWrapperModal } from '../session/SessionWrapperModal';
import { SpacerLG, SpacerSM } from '../basic/Text';
@ -170,7 +169,7 @@ export class SessionPasswordDialog extends React.Component<Props, State> {
'setPasswordSuccessToast',
window.i18n('setPasswordTitle'),
window.i18n('setPasswordToastDescription'),
SessionIconType.Lock
'lock'
);
this.props.onOk();
@ -209,7 +208,7 @@ export class SessionPasswordDialog extends React.Component<Props, State> {
'setPasswordSuccessToast',
window.i18n('changePasswordTitle'),
window.i18n('changePasswordToastDescription'),
SessionIconType.Lock
'lock'
);
this.props.onOk();

10
ts/components/session/ActionsPanel.tsx
View File

@ -96,19 +96,19 @@ const Section = (props: { type: SectionType; avatarPath?: string | null }) => {
let iconType: SessionIconType;
switch (type) {
case SectionType.Message:
iconType = SessionIconType.ChatBubble;
iconType = 'chatBubble';
break;
case SectionType.Contact:
iconType = SessionIconType.Users;
iconType = 'users';
break;
case SectionType.Settings:
iconType = SessionIconType.Gear;
iconType = 'gear';
break;
case SectionType.Moon:
iconType = SessionIconType.Moon;
iconType = 'moon';
break;
default:
iconType = SessionIconType.Moon;
iconType = 'moon';
}
const iconColor = undefined;

3
ts/components/session/LeftPaneMessageSection.tsx
View File

@ -14,7 +14,6 @@ import { SessionSearchInput } from './SessionSearchInput';
import { cleanSearchTerm } from '../../util/cleanSearchTerm';
import { RowRendererParamsType } from '../LeftPane';
import { SessionClosableOverlay, SessionClosableOverlayType } from './SessionClosableOverlay';
import { SessionIconType } from './icon';
import { ContactType } from './SessionMemberListItem';
import { SessionButton, SessionButtonColor, SessionButtonType } from './SessionButton';
import { PubKey } from '../../session/types';
@ -133,7 +132,7 @@ export class LeftPaneMessageSection extends React.Component<Props, State> {
return (
<LeftPaneSectionHeader
label={window.i18n('messagesHeader')}
buttonIcon={SessionIconType.Plus}
buttonIcon="plus"
buttonClicked={this.handleNewSessionButtonClick}
/>
);

9
ts/components/session/LeftPaneSettingSection.tsx
View File

@ -1,7 +1,7 @@
import React from 'react';
import classNames from 'classnames';
import { SessionButton, SessionButtonColor, SessionButtonType } from './SessionButton';
import { SessionIcon, SessionIconType } from './icon';
import { SessionIcon } from './icon';
import { SessionSettingCategory } from './settings/SessionSettings';
import { LeftPaneSectionHeader } from './LeftPaneSectionHeader';
import { useDispatch, useSelector } from 'react-redux';
@ -60,12 +60,7 @@ const LeftPaneSettingsCategoryRow = (props: { item: any }) => {
<div>
{item.id === focusedSettingsSection && (
<SessionIcon
iconSize={'medium'}
iconType={SessionIconType.Chevron}
iconRotation={270}
theme={theme}
/>
<SessionIcon iconSize={'medium'} iconType="chevron" iconRotation={270} theme={theme} />
)}
</div>
</div>

8
ts/components/session/SessionClosableOverlay.tsx
View File

@ -1,6 +1,6 @@
import React from 'react';
import { SessionIconButton, SessionIconType } from './icon';
import { SessionIconButton } from './icon';
import { SessionIdEditable } from './SessionIdEditable';
import { ContactType, SessionMemberListItem } from './SessionMemberListItem';
import { ReduxConversationType } from '../../state/ducks/conversations';
@ -146,11 +146,7 @@ export class SessionClosableOverlay extends React.Component<Props, State> {
return (
<div className="module-left-pane-overlay">
<div className="exit">
<SessionIconButton
iconSize={'small'}
iconType={SessionIconType.Exit}
onClick={onCloseClick}
/>
<SessionIconButton iconSize={'small'} iconType="exit" onClick={onCloseClick} />
</div>
<SpacerMD />

2
ts/components/session/SessionDropdown.tsx
View File

@ -37,7 +37,7 @@ export const SessionDropdown = (props: Props) => {
>
{label}
<SessionIcon
iconType={SessionIconType.Chevron}
iconType="chevron"
iconSize={'small'}
iconRotation={chevronOrientation}
theme={theme}

4
ts/components/session/SessionInput.tsx
View File

@ -1,7 +1,7 @@
import React from 'react';
import classNames from 'classnames';
import { SessionIconButton, SessionIconType } from './icon';
import { SessionIconButton } from './icon';
import { DefaultTheme } from 'styled-components';
interface Props {
@ -109,7 +109,7 @@ export class SessionInput extends React.PureComponent<Props, State> {
private renderShowHideButton() {
return (
<SessionIconButton
iconType={SessionIconType.Eye}
iconType="eye"
iconSize={'medium'}
onClick={() => {
this.setState({

4
ts/components/session/SessionMemberListItem.tsx
View File

@ -2,7 +2,7 @@ import React from 'react';
import classNames from 'classnames';
import { Avatar, AvatarSize } from '../Avatar';
import { SessionIcon, SessionIconType } from './icon';
import { SessionIcon } from './icon';
import { Constants } from '../../session';
import { useTheme } from 'styled-components';
import { PubKey } from '../../session/types';
@ -75,7 +75,7 @@ export const SessionMemberListItem = (props: Props) => {
</div>
<span className={classNames('session-member-item__checkmark', isSelected && 'selected')}>
<SessionIcon
iconType={SessionIconType.Check}
iconType="check"
iconSize={'medium'}
iconColor={Constants.UI.COLORS.GREEN}
theme={theme}

11
ts/components/session/SessionPasswordPrompt.tsx
View File

@ -1,7 +1,7 @@
import React from 'react';
import classNames from 'classnames';
import { SessionIcon, SessionIconType } from './icon';
import { SessionIcon } from './icon';
import { SessionButton, SessionButtonColor, SessionButtonType } from './SessionButton';
import { Constants } from '../../session';
import { DefaultTheme, withTheme } from 'styled-components';
@ -68,15 +68,10 @@ class SessionPasswordPromptInner extends React.PureComponent<{ theme: DefaultThe
/>
);
const infoIcon = this.state.clearDataView ? (
<SessionIcon
iconType={SessionIconType.Warning}
iconSize={35}
iconColor="#ce0000"
theme={this.props.theme}
/>
<SessionIcon iconType="warning" iconSize={35} iconColor="#ce0000" theme={this.props.theme} />
) : (
<SessionIcon
iconType={SessionIconType.Lock}
iconType="lock"
iconSize={35}
iconColor={Constants.UI.COLORS.GREEN}
theme={this.props.theme}

4
ts/components/session/SessionRegistrationView.tsx
View File

@ -2,7 +2,7 @@ import React, { useEffect } from 'react';
import { AccentText } from './AccentText';
import { RegistrationStages } from './registration/RegistrationStages';
import { SessionIconButton, SessionIconType } from './icon';
import { SessionIconButton } from './icon';
import { SessionToastContainer } from './SessionToastContainer';
import { lightTheme, SessionTheme } from '../../state/ducks/SessionTheme';
import { setSignInByLinking } from '../../session/utils/User';
@ -20,7 +20,7 @@ export const SessionRegistrationView = () => {
<div className="session-content-close-button">
<SessionIconButton
iconSize={'medium'}
iconType={SessionIconType.Exit}
iconType="exit"
onClick={() => {
window.close();
}}

4
ts/components/session/SessionScrollButton.tsx
View File

@ -3,7 +3,7 @@ import { useSelector } from 'react-redux';
import styled, { ThemeContext } from 'styled-components';
import { getShowScrollButton } from '../../state/selectors/conversations';
import { SessionIconButton, SessionIconType } from './icon';
import { SessionIconButton } from './icon';
type Props = {
onClick?: () => any;
@ -24,7 +24,7 @@ export const SessionScrollButton = (props: Props) => {
return (
<SessionScrollButtonDiv theme={themeContext}>
<SessionIconButton
iconType={SessionIconType.Chevron}
iconType="chevron"
iconSize={'huge'}
isHidden={!show}
onClick={props.onClick}

4
ts/components/session/SessionSearchInput.tsx
View File

@ -1,7 +1,7 @@
import React from 'react';
import { useSelector } from 'react-redux';
import { getConversationsCount } from '../../state/selectors/conversations';
import { SessionIconButton, SessionIconType } from './icon';
import { SessionIconButton } from './icon';
type Props = {
searchString: string;
@ -21,7 +21,7 @@ export const SessionSearchInput = (props: Props) => {
return (
<div className="session-search-input">
<SessionIconButton iconSize={'medium'} iconType={SessionIconType.Search} />
<SessionIconButton iconSize={'medium'} iconType="search" />
<input
value={searchString}
onChange={e => onChange(e.target.value)}

10
ts/components/session/SessionToast.tsx
View File

@ -57,19 +57,19 @@ export const SessionToast = (props: Props) => {
if (!toastIcon) {
switch (type) {
case SessionToastType.Info:
toastIcon = SessionIconType.Info;
toastIcon = 'info';
break;
case SessionToastType.Success:
toastIcon = SessionIconType.Check;
toastIcon = 'check';
break;
case SessionToastType.Error:
toastIcon = SessionIconType.Error;
toastIcon = 'error';
break;
case SessionToastType.Warning:
toastIcon = SessionIconType.Warning;
toastIcon = 'warning';
break;
default:
toastIcon = SessionIconType.Info;
toastIcon = 'info';
}
}

4
ts/components/session/SessionWrapperModal.tsx
View File

@ -1,7 +1,7 @@
import React, { useEffect, useRef } from 'react';
import classNames from 'classnames';
import { SessionIconButton, SessionIconType } from './icon/';
import { SessionIconButton } from './icon/';
import { SessionButton } from './SessionButton';
import { useTheme } from 'styled-components';
@ -85,7 +85,7 @@ export const SessionWrapperModal = (props: SessionWrapperModalType) => {
<div className="session-modal__header__close">
{showExitIcon ? (
<SessionIconButton
iconType={SessionIconType.Exit}
iconType="exit"
iconSize={'small'}
onClick={props.onClose}
theme={theme}

10
ts/components/session/conversation/SessionCompositionBox.tsx
View File

@ -4,7 +4,7 @@ import _, { debounce } from 'lodash';
import { AttachmentType } from '../../../types/Attachment';
import * as MIME from '../../../types/MIME';
import { SessionIconButton, SessionIconType } from '../icon';
import { SessionIconButton } from '../icon';
import { SessionEmojiPanel } from './SessionEmojiPanel';
import { SessionRecording } from './SessionRecording';
@ -92,7 +92,7 @@ const AddStagedAttachmentButton = (props: { onClick: () => void }) => {
const theme = useTheme();
return (
<SessionIconButton
iconType={SessionIconType.PlusThin}
iconType="plusThin"
backgroundColor={theme.colors.composeViewButtonBackground}
iconSize={'huge2'}
borderRadius="300px"
@ -107,7 +107,7 @@ const StartRecordingButton = (props: { onClick: () => void }) => {
return (
<SessionIconButton
iconType={SessionIconType.Microphone}
iconType="microphone"
iconSize={'huge2'}
backgroundColor={theme.colors.composeViewButtonBackground}
borderRadius="300px"
@ -121,7 +121,7 @@ const ToggleEmojiButton = (props: { onClick: () => void }) => {
const theme = useTheme();
return (
<SessionIconButton
iconType={SessionIconType.Emoji}
iconType="emoji"
backgroundColor={theme.colors.composeViewButtonBackground}
iconSize={'huge2'}
borderRadius="300px"
@ -136,7 +136,7 @@ const SendMessageButton = (props: { onClick: () => void }) => {
return (
<div className="send-message-button">
<SessionIconButton
iconType={SessionIconType.Send}
iconType="send"
backgroundColor={theme.colors.composeViewButtonBackground}
iconSize={'huge2'}
iconRotation={90}

8
ts/components/session/conversation/SessionFileDropzone.tsx
View File

@ -1,7 +1,7 @@
import React, { useContext } from 'react';
import styled, { ThemeContext } from 'styled-components';
import { Flex } from '../../basic/Flex';
import { SessionIcon, SessionIconType } from '../icon';
import { SessionIcon } from '../icon';
const DropZoneContainer = styled.div`
display: inline-block;
@ -31,11 +31,7 @@ export const SessionFileDropzone = () => {
<DropZoneContainer>
<DropZoneWithBorder>
<Flex container={true} justifyContent="space-around" height="100%" alignItems="center">
<SessionIcon
iconSize={'max'}
iconType={SessionIconType.CirclePlus}
theme={themeContext}
/>
<SessionIcon iconSize={'max'} iconType="circlePlus" theme={themeContext} />
</Flex>
</DropZoneWithBorder>
</DropZoneContainer>

1
ts/components/session/conversation/SessionMessagesList.tsx
View File

@ -19,7 +19,6 @@ export const SessionMessagesList = (props: {
scrollToQuoteMessage: (options: QuoteClickOptions) => Promise<void>;
}) => {
const messagesProps = useSelector(getSortedMessagesTypesOfSelectedConversation);
return (
<>
{messagesProps.map(messageProps => {

6
ts/components/session/conversation/SessionQuotedMessageComposition.tsx
View File

@ -1,6 +1,6 @@
import React, { useCallback } from 'react';
import { Flex } from '../../basic/Flex';
import { SessionIcon, SessionIconButton, SessionIconType } from '../icon';
import { SessionIcon, SessionIconButton } from '../icon';
import styled, { useTheme } from 'styled-components';
import { getAlt, isAudio } from '../../../types/Attachment';
import { Image } from '../../conversation/Image';
@ -77,7 +77,7 @@ export const SessionQuotedMessageComposition = () => {
>
<ReplyingTo>{window.i18n('replyingToMessage')}</ReplyingTo>
<SessionIconButton
iconType={SessionIconType.Exit}
iconType="exit"
iconSize={'small'}
onClick={removeQuotedMessage}
theme={theme}
@ -98,7 +98,7 @@ export const SessionQuotedMessageComposition = () => {
)}
{hasAudioAttachment && (
<SessionIcon iconType={SessionIconType.Microphone} iconSize={'huge'} theme={theme} />
<SessionIcon iconType="microphone" iconSize="huge" theme={theme} />
)}
</Flex>
</QuotedMessageCompositionReply>

24
ts/components/session/conversation/SessionRecording.tsx
View File

@ -2,7 +2,7 @@ import React from 'react';
import classNames from 'classnames';
import moment from 'moment';
import { SessionIconButton, SessionIconType } from '../icon';
import { SessionIconButton } from '../icon';
import { Constants } from '../../../session';
import { ToastUtils } from '../../../session/utils';
import autoBind from 'auto-bind';
@ -129,38 +129,28 @@ class SessionRecordingInner extends React.Component<Props, State> {
<StyledFlexWrapper marginHorizontal={Constants.UI.SPACING.marginXs}>
{isRecording && (
<SessionIconButton
iconType={SessionIconType.Pause}
iconType="pause"
iconSize={'medium'}
iconColor={Constants.UI.COLORS.DANGER_ALT}
onClick={actionPauseFn}
/>
)}
{actionPauseAudio && (
<SessionIconButton
iconType={SessionIconType.Pause}
iconSize={'medium'}
onClick={actionPauseFn}
/>
<SessionIconButton iconType="pause" iconSize={'medium'} onClick={actionPauseFn} />
)}
{hasRecordingAndPaused && (
<SessionIconButton
iconType={SessionIconType.Play}
iconSize={'medium'}
onClick={this.playAudio}
/>
<SessionIconButton iconType="play" iconSize={'medium'} onClick={this.playAudio} />
)}
{hasRecording && (
<SessionIconButton
iconType={SessionIconType.Delete}
iconType="delete"
iconSize={'medium'}
onClick={this.onDeleteVoiceMessage}
/>
)}
</StyledFlexWrapper>
{actionDefault && (
<SessionIconButton iconType={SessionIconType.Microphone} iconSize={'huge'} />
)}
{actionDefault && <SessionIconButton iconType="microphone" iconSize={'huge'} />}
</div>
{hasRecording && !isRecording ? (
@ -184,7 +174,7 @@ class SessionRecordingInner extends React.Component<Props, State> {
)}
>
<SessionIconButton
iconType={SessionIconType.Send}
iconType="send"
iconSize={'large'}
iconRotation={90}
onClick={this.onSendVoiceMessage}

8
ts/components/session/conversation/SessionRightPanel.tsx
View File

@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react';
import { SessionIconButton, SessionIconType } from '../icon';
import { SessionIconButton } from '../icon';
import { Avatar, AvatarSize } from '../../Avatar';
import { SessionButton, SessionButtonColor, SessionButtonType } from '../SessionButton';
import { SessionDropdown } from '../SessionDropdown';
@ -135,7 +135,7 @@ const HeaderItem = () => {
return (
<div className="group-settings-header">
<SessionIconButton
iconType={SessionIconType.Chevron}
iconType="chevron"
iconSize={'medium'}
iconRotation={270}
onClick={() => {
@ -153,8 +153,8 @@ const HeaderItem = () => {
<div className="invite-friends-container">
{showInviteContacts && (
<SessionIconButton
iconType={SessionIconType.AddUser}
iconSize={'medium'}
iconType="addUser"
iconSize="medium"
onClick={() => {
if (selectedConversation) {
showInviteContactByConvoId(selectedConversation.id);

254
ts/components/session/icon/Icons.tsx
View File

File diff suppressed because one or more lines are too long

8
ts/components/session/settings/SessionSettings.tsx
View File

@ -20,7 +20,7 @@ import { unblockConvoById } from '../../../interactions/conversationInteractions
import { toggleAudioAutoplay } from '../../../state/ducks/userConfig';
import { sessionPassword, updateConfirmModal } from '../../../state/ducks/modalDialog';
import { PasswordAction } from '../../dialog/SessionPasswordDialog';
import { SessionIconButton, SessionIconType } from '../icon';
import { SessionIconButton } from '../icon';
import { ToastUtils } from '../../../session/utils';
export enum SessionSettingCategory {
@ -250,11 +250,7 @@ class SettingsViewInner extends React.Component<SettingsViewProps, State> {
<div className="session-settings__version-info">
<span className="text-selectable">v{window.versionInfo.version}</span>
<span>
<SessionIconButton
iconSize={'medium'}
iconType={SessionIconType.Oxen}
onClick={openOxenWebsite}
/>
<SessionIconButton iconSize={'medium'} iconType="oxen" onClick={openOxenWebsite} />
</span>
<span className="text-selectable">{window.versionInfo.commitHash}</span>
</div>

2
ts/session/utils/Toast.tsx
View File

@ -172,7 +172,7 @@ export function pushYouLeftTheGroup() {
}
export function pushDeleted() {
pushToastSuccess('deleted', window.i18n('deleted'), undefined, SessionIconType.Check);
pushToastSuccess('deleted', window.i18n('deleted'), undefined, 'check');
}
export function pushCannotRemoveCreatorFromGroup() {

30
ts/util/timer.ts
View File

@ -16,40 +16,40 @@ export function getIncrement(length: number): number {
export function getTimerBucketIcon(expiration: number, length: number): SessionIconType {
const delta = expiration - Date.now();
if (delta < 0) {
return SessionIconType.Timer60;
return 'timer60';
}
if (delta > length) {
return SessionIconType.Timer00;
return 'timer00';
}
const bucket = Math.round((delta / length) * 12);
const padded = padStart(String(bucket * 5), 2, '0');
switch (padded) {
case '00':
return SessionIconType.Timer00;
return 'timer00';
case '05':
return SessionIconType.Timer05;
return 'timer05';
case '10':
return SessionIconType.Timer10;
return 'timer10';
case '15':
return SessionIconType.Timer15;
return 'timer15';
case '20':
return SessionIconType.Timer20;
return 'timer20';
case '25':
return SessionIconType.Timer25;
return 'timer25';
case '30':
return SessionIconType.Timer30;
return 'timer30';
case '35':
return SessionIconType.Timer35;
return 'timer35';
case '40':
return SessionIconType.Timer40;
return 'timer40';
case '45':
return SessionIconType.Timer45;
return 'timer45';
case '50':
return SessionIconType.Timer50;
return 'timer50';
case '55':
return SessionIconType.Timer55;
return 'timer55';
default:
return SessionIconType.Timer60;
return 'timer60';
}
}