diff --git a/src/components/AvatarWithImagePicker.js b/src/components/AvatarWithImagePicker.js index 27f969259bd2..3d35be886540 100644 --- a/src/components/AvatarWithImagePicker.js +++ b/src/components/AvatarWithImagePicker.js @@ -11,6 +11,7 @@ import { import styles from '../styles/styles'; import themeColors from '../styles/themes/default'; import AttachmentPicker from './AttachmentPicker'; +import Tooltip from './Tooltip'; import withLocalize, {withLocalizePropTypes} from './withLocalize'; import variables from '../styles/variables'; @@ -99,45 +100,47 @@ class AvatarWithImagePicker extends React.Component { const additionalStyles = _.isArray(this.props.style) ? this.props.style : [this.props.style]; return ( - - {this.props.avatarURL - ? ( - - ) - : ( - - )} - - {({openPicker}) => ( - <> - this.setState({isMenuVisible: true})} - > - - - this.setState({isMenuVisible: false})} - onItemSelected={() => this.setState({isMenuVisible: false})} - menuItems={this.createMenuItems(openPicker)} - anchorPosition={this.props.anchorPosition} - animationIn="fadeInDown" - animationOut="fadeOutUp" + + + {this.props.avatarURL + ? ( + - - )} - - + ) + : ( + + )} + + {({openPicker}) => ( + <> + this.setState({isMenuVisible: true})} + > + + + this.setState({isMenuVisible: false})} + onItemSelected={() => this.setState({isMenuVisible: false})} + menuItems={this.createMenuItems(openPicker)} + anchorPosition={this.props.anchorPosition} + animationIn="fadeInDown" + animationOut="fadeOutUp" + /> + + )} + + + ); } diff --git a/src/components/HeaderWithCloseButton.js b/src/components/HeaderWithCloseButton.js index 24479b48554b..2cb8fe57fd16 100755 --- a/src/components/HeaderWithCloseButton.js +++ b/src/components/HeaderWithCloseButton.js @@ -9,6 +9,7 @@ import Icon from './Icon'; import {Close, Download, BackArrow} from './Icon/Expensicons'; import compose from '../libs/compose'; import withLocalize, {withLocalizePropTypes} from './withLocalize'; +import Tooltip from './Tooltip'; import InboxCallButton from './InboxCallButton'; const propTypes = { @@ -66,36 +67,43 @@ const HeaderWithCloseButton = props => ( ]} > {props.shouldShowBackButton && ( - - - + + + + + )}
{ props.shouldShowDownloadButton && ( + + + ) } {props.shouldShowInboxCallButton && } - - - + + + + + diff --git a/src/components/VideoChatButtonAndMenu.js b/src/components/VideoChatButtonAndMenu.js index b39867c56d56..4aa9c149bb86 100755 --- a/src/components/VideoChatButtonAndMenu.js +++ b/src/components/VideoChatButtonAndMenu.js @@ -17,6 +17,7 @@ import withLocalize, {withLocalizePropTypes} from './withLocalize'; import compose from '../libs/compose'; import Navigation from '../libs/Navigation/Navigation'; import ROUTES from '../ROUTES'; +import Tooltip from './Tooltip'; const propTypes = { ...withLocalizePropTypes, @@ -95,24 +96,26 @@ class VideoChatButtonAndMenu extends Component { ref={el => this.videoChatIconWrapper = el} onLayout={this.measureVideoChatIconPosition} > - { - // If this is the Concierge chat, we'll open the modal for requesting a setup call instead - if (this.props.isConcierge) { - Navigation.navigate(ROUTES.getRequestCallRoute('NewExpensifyConciergeDM')); - return; - } - this.toggleVideoChatMenu(); - }} - style={[styles.touchableButtonImage, styles.mr0]} - > - - + + { + // If this is the Concierge chat, we'll open the modal for requesting a setup call instead + if (this.props.isConcierge) { + Navigation.navigate(ROUTES.getRequestCallRoute('NewExpensifyConciergeDM')); + return; + } + this.toggleVideoChatMenu(); + }} + style={[styles.touchableButtonImage, styles.mr0]} + > + + + `It's ${time} for ${user}`, + emoji: 'Emoji', }, reportActionContextMenu: { copyToClipboard: 'Copy to Clipboard', @@ -145,6 +152,7 @@ export default { multipleUsers: 'Multiple users', }, sidebarScreen: { + fabAction: 'New Chat', newChat: 'New Chat', newGroup: 'New Group', headerChat: 'Chats', @@ -195,6 +203,7 @@ export default { avatarWithImagePicker: { uploadPhoto: 'Upload Photo', removePhoto: 'Remove Photo', + editImage: 'Edit Photo', }, profilePage: { profile: 'Profile', diff --git a/src/languages/es.js b/src/languages/es.js index 8b8062c4986a..f2d632f41b28 100644 --- a/src/languages/es.js +++ b/src/languages/es.js @@ -36,6 +36,10 @@ export default { contacts: 'Contactos', recents: 'Recientes', close: 'Cerrar', + download: 'Descargar', + pin: 'Fijar', + unPin: 'Desfijar', + back: 'Volver', saveAndContinue: 'Guardar y Continuar', settings: 'Configuración', termsOfService: 'Términos de servicio', @@ -102,6 +106,7 @@ export default { nameEmailOrPhoneNumber: 'Nombre, email o número de teléfono', }, videoChatButtonAndMenu: { + tooltip: 'Videollamada', zoom: 'Zoom', googleMeet: 'Google Meet', }, @@ -114,6 +119,7 @@ export default { phrase4: '¡Bienvenido de vuelta al Nuevo Expensify! Por favor, introduce tu contraseña.', }, reportActionCompose: { + addAction: 'Acción', sendAttachment: 'Enviar adjunto', addAttachment: 'Agregar Archivo Adjunto', writeSomething: 'Escribe algo...', @@ -122,6 +128,7 @@ export default { fileUploadFailed: 'Subida fallida. El archivo no es compatible.', roomIsArchived: 'Esta sala de chat ha sido eliminada', localTime: ({user, time}) => `Son las ${time} para ${user}`, + emoji: 'Emoji', }, reportActionContextMenu: { copyToClipboard: 'Copiar al Portapapeles', @@ -145,6 +152,7 @@ export default { multipleUsers: 'Varios usuarios', }, sidebarScreen: { + fabAction: 'Nuevo Chat', newChat: 'Nuevo Chat', newGroup: 'Nuevo Grupo', headerChat: 'Chats', @@ -195,6 +203,7 @@ export default { avatarWithImagePicker: { uploadPhoto: 'Subir Foto', removePhoto: 'Eliminar Foto', + editImage: 'Editar Foto', }, profilePage: { profile: 'Perfil', diff --git a/src/pages/home/HeaderView.js b/src/pages/home/HeaderView.js index 4f3149f02fee..e43fd8377535 100644 --- a/src/pages/home/HeaderView.js +++ b/src/pages/home/HeaderView.js @@ -25,6 +25,7 @@ import withLocalize, {withLocalizePropTypes} from '../../components/withLocalize import CONST from '../../CONST'; import {getDefaultRoomSubtitle, isDefaultRoom, isArchivedRoom} from '../../libs/reportUtils'; import Text from '../../components/Text'; +import Tooltip from '../../components/Tooltip'; const propTypes = { /** Toggles the navigationMenu open and closed */ @@ -96,12 +97,14 @@ const HeaderView = (props) => { {props.isSmallScreenWidth && ( - - - + + + + + )} {props.report && props.report.reportName && ( { {props.report.hasOutstandingIOU && ( )} + - togglePinnedState(props.report)} - style={[styles.touchableButtonImage, styles.mr0]} - > - - + + togglePinnedState(props.report)} + style={[styles.touchableButtonImage, styles.mr0]} + > + + + )} diff --git a/src/pages/home/report/ReportActionCompose.js b/src/pages/home/report/ReportActionCompose.js index 38eedffa1780..cbb46947cc33 100755 --- a/src/pages/home/report/ReportActionCompose.js +++ b/src/pages/home/report/ReportActionCompose.js @@ -57,6 +57,7 @@ import {participantPropTypes} from '../sidebar/optionPropTypes'; import currentUserPersonalDetailsPropsTypes from '../../settings/Profile/currentUserPersonalDetailsPropsTypes'; import ParticipantLocalTime from './ParticipantLocalTime'; import {withNetwork, withPersonalDetails} from '../../../components/OnyxProvider'; +import Tooltip from '../../../components/Tooltip'; const propTypes = { /** Beta features list */ @@ -484,17 +485,19 @@ class ReportActionCompose extends React.Component { {({openPicker}) => ( <> - { - e.preventDefault(); - this.setMenuVisibility(true); - }} - style={styles.chatItemAttachButton} - underlayColor={themeColors.componentBG} - disabled={isBlockedFromConcierge || isArchivedChatRoom} - > - - + + { + e.preventDefault(); + this.setMenuVisibility(true); + }} + style={styles.chatItemAttachButton} + underlayColor={themeColors.componentBG} + disabled={isBlockedFromConcierge || isArchivedChatRoom} + > + + + this.setMenuVisibility(false)} @@ -626,22 +629,26 @@ class ReportActionCompose extends React.Component { disabled={isBlockedFromConcierge || isArchivedChatRoom} > {({hovered, pressed}) => ( - + + + )} - - - + + + + + {this.props.network.isOffline ? ( diff --git a/src/pages/home/sidebar/SidebarLinks.js b/src/pages/home/sidebar/SidebarLinks.js index e74800d3a71a..360cd87796bc 100644 --- a/src/pages/home/sidebar/SidebarLinks.js +++ b/src/pages/home/sidebar/SidebarLinks.js @@ -16,6 +16,7 @@ import {MagnifyingGlass} from '../../../components/Icon/Expensicons'; import AvatarWithIndicator from '../../../components/AvatarWithIndicator'; import {getSidebarOptions, getDefaultAvatar} from '../../../libs/OptionsListUtils'; import KeyboardSpacer from '../../../components/KeyboardSpacer'; +import Tooltip from '../../../components/Tooltip'; import CONST from '../../../CONST'; import {participantPropTypes} from './optionPropTypes'; import themeColors from '../../../styles/themes/default'; @@ -141,14 +142,16 @@ class SidebarLinks extends React.Component { accessibilityRole="text" shouldShowEnvironmentBadge /> - - - + + + + + {this.state.currentStepIndex > 0 && ( + + + + + + )} +
+ + Navigation.dismissModal()} style={[styles.touchableButtonImage]} + accessibilityRole="button" + accessibilityLabel={this.props.translate('common.close')} > - + - )} -
- - Navigation.dismissModal()} - style={[styles.touchableButtonImage]} - accessibilityRole="button" - accessibilityLabel={this.props.translate('common.close')} - > - - +