[MM-62074] Move tooltips with withTooltip to new Tooltip component (#29528)

* replace inside of comp/withtooltip

* remove overlay trigger eslint rl

* update location of prev migrated new tooltips

* copy button

* shared_channel_indicator, shared_user_indicator.tsx, size_aware_image

* actions_menu, old_admin_settings, schema_admin_settings, admin_settings

* billing_summary, brand_image_setting, edit_section_edit_table_row, elapsed_duration_cell

* permissions_scheme_summary,secure_connections/controls,system_users_column_toggler_menu,system_users_export,group/group_users/users_to_remove_groups

* team_profile,user_grid_role_dropdown,priority_labels,toggle_formatting_bar,use_emoji_picker,formatting_icon

* show_formatting,alert_banner others

* more

* snap fix

* add disabled prop to menu

* test fix for avatar

feat: Add id to WithTooltip in Avatars component to fix test failures

* combine refs in withtooltip

* channel header title favorite test fix

* priority label comp changes

* types check for children

* Update avatar.tsx

* e2e fixes

* fix E2E tests

* Remove memo from WithTooltip

I found that the web app leaks a fair bit less memory when this is removed. See https://community.mattermost.com/core/pl/gwyyoww9gtbg8fddoic9meq84y for more information

* e2e lint fixes

* e2e fixes

* Fix test style issue

---------

Co-authored-by: yasserfaraazkhan <attitude3cena.yf@gmail.com>
Co-authored-by: Harrison Healey <harrisonmhealey@gmail.com>
Co-authored-by: Mattermost Build <build@mattermost.com>
Этот коммит содержится в:
M-ZubairAhmed
2024-12-19 03:26:30 +05:30
коммит произвёл GitHub
родитель 371e1b9bad
Коммит fd6a662d76
227 изменённых файлов: 1676 добавлений и 4835 удалений

Просмотреть файл

@@ -763,8 +763,6 @@ exports[`components/SettingItemMin should match snapshot, team icon on source 1`
</div>
<WithTooltip
disabled={false}
id="removeIcon"
placement="right"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Remove This Icon"
@@ -922,8 +920,6 @@ exports[`components/SettingItemMin should match snapshot, user icon on source 1`
</div>
<WithTooltip
disabled={false}
id="removeIcon"
placement="right"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Remove Profile Picture"

Просмотреть файл

@@ -47,8 +47,6 @@ exports[`components/SizeAwareImage should load download and copy link buttons wh
className="image-preview-utility-buttons-container image-preview-utility-buttons-container--small-image"
>
<WithTooltip
id="single_image_view.copy_link_tooltip.text"
placement="top"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Copy link"
@@ -68,8 +66,6 @@ exports[`components/SizeAwareImage should load download and copy link buttons wh
</button>
</WithTooltip>
<WithTooltip
id="single_image_view.download_tooltip.text"
placement="top"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Download"
@@ -145,8 +141,6 @@ exports[`components/SizeAwareImage should match snapshot when handleSmallImageCo
className="image-preview-utility-buttons-container image-preview-utility-buttons-container--small-image"
>
<WithTooltip
id="single_image_view.copy_link_tooltip.text"
placement="top"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Copy link"
@@ -166,8 +160,6 @@ exports[`components/SizeAwareImage should match snapshot when handleSmallImageCo
</button>
</WithTooltip>
<WithTooltip
id="single_image_view.download_tooltip.text"
placement="top"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Download"
@@ -256,8 +248,6 @@ exports[`components/SizeAwareImage should render a placeholder and has loader wh
className="image-preview-utility-buttons-container image-preview-utility-buttons-container--small-image"
>
<WithTooltip
id="single_image_view.copy_link_tooltip.text"
placement="top"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Copy link"
@@ -277,8 +267,6 @@ exports[`components/SizeAwareImage should render a placeholder and has loader wh
</button>
</WithTooltip>
<WithTooltip
id="single_image_view.download_tooltip.text"
placement="top"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Download"

Просмотреть файл

@@ -8,8 +8,6 @@ exports[`components/actions_menu/ActionsMenu has actions - marketplace disabled
open={true}
>
<WithTooltip
id="center_post_id_1_tooltip"
placement="top"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Message actions"
@@ -59,8 +57,6 @@ exports[`components/actions_menu/ActionsMenu has actions - marketplace enabled a
open={true}
>
<WithTooltip
id="center_post_id_1_tooltip"
placement="top"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Message actions"
@@ -129,8 +125,6 @@ exports[`components/actions_menu/ActionsMenu no actions - sysadmin - menu should
open={true}
>
<WithTooltip
id="center_post_id_1_tooltip"
placement="top"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Message actions"

Просмотреть файл

@@ -381,14 +381,12 @@ export class ActionMenuClass extends React.PureComponent<Props, State> {
onToggle={this.handleDropdownOpened}
>
<WithTooltip
id={`${this.props.location}_${this.props.post.id}_tooltip`}
title={
<FormattedMessage
id='post_info.tooltip.actions'
defaultMessage='Message actions'
/>
}
placement='top'
>
<button
key='more-actions-button'

Просмотреть файл

@@ -179,8 +179,6 @@ exports[`components/BleveSettings should match snapshot, disabled 1`] = `
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -373,8 +371,6 @@ exports[`components/BleveSettings should match snapshot, enabled 1`] = `
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div

Просмотреть файл

@@ -190,8 +190,6 @@ exports[`components/ClusterSettings should match snapshot, compression disabled
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -397,8 +395,6 @@ exports[`components/ClusterSettings should match snapshot, compression enabled 1
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -604,8 +600,6 @@ exports[`components/ClusterSettings should match snapshot, encryption disabled 1
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -811,8 +805,6 @@ exports[`components/ClusterSettings should match snapshot, encryption enabled 1`
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div

Просмотреть файл

@@ -409,8 +409,6 @@ exports[`components/DatabaseSettings should match snapshot 1`] = `
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div

Просмотреть файл

@@ -478,8 +478,6 @@ exports[`components/ElasticSearchSettings should match snapshot, disabled 1`] =
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -972,8 +970,6 @@ exports[`components/ElasticSearchSettings should match snapshot, enabled 1`] = `
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div

Просмотреть файл

@@ -147,8 +147,6 @@ exports[`components/MessageExportSettings should match snapshot, disabled, actia
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -425,8 +423,6 @@ exports[`components/MessageExportSettings should match snapshot, disabled, globa
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -589,8 +585,6 @@ exports[`components/MessageExportSettings should match snapshot, enabled, actian
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -867,8 +861,6 @@ exports[`components/MessageExportSettings should match snapshot, enabled, global
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div

Просмотреть файл

@@ -172,8 +172,6 @@ exports[`components/PushSettings should match snapshot, licensed 1`] = `
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -305,8 +303,6 @@ exports[`components/PushSettings should match snapshot, unlicensed 1`] = `
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div

Просмотреть файл

@@ -675,8 +675,6 @@ exports[`components/admin_console/SchemaAdminSettings should match snapshot with
savingMessage="Saving Config..."
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div

Просмотреть файл

@@ -60,8 +60,6 @@ const AdminSettings = ({
}
/>
<WithTooltip
id='error-tooltip'
placement='top'
title={serverError ?? ''}
>
<div

Просмотреть файл

@@ -273,10 +273,8 @@ export const InvoiceInfo = ({invoice, product, fullCharges, partialCharges, hasM
defaultMessage='Partial charges'
/>
<WithTooltip
id='BillingSubscriptions__seatOverageTooltip'
title={messages.partialChargesTooltipTitle}
hint={messages.partialChargesTooltipText}
placement='bottom'
>
<i className='icon-information-outline'/>
</WithTooltip>

Просмотреть файл

@@ -198,13 +198,13 @@ export default class BrandImageSetting extends React.PureComponent<Props, State>
if (!this.props.disabled) {
overlay = (
<WithTooltip
id='removeIcon'
title={
title={(
<FormattedMessage
id='admin.team.removeBrandImage'
defaultMessage='Remove brand image'
/>}
placement='right'
/>
)}
isVertical={false}
>
<button
type='button'

Просмотреть файл

@@ -180,8 +180,6 @@ exports[`components/admin_console/CustomPluginSettings should match snapshot wit
savingMessage="Saving Config..."
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -232,8 +230,6 @@ exports[`components/admin_console/CustomPluginSettings should match snapshot wit
savingMessage="Saving Config..."
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -434,8 +430,6 @@ exports[`components/admin_console/CustomPluginSettings should match snapshot wit
savingMessage="Saving Config..."
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div

Просмотреть файл

@@ -31,8 +31,6 @@ exports[`components/admin_console/CustomTermsOfServiceSettings should match snap
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -79,8 +77,6 @@ exports[`components/admin_console/CustomTermsOfServiceSettings should match snap
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -127,8 +123,6 @@ exports[`components/admin_console/CustomTermsOfServiceSettings should match snap
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -175,8 +169,6 @@ exports[`components/admin_console/CustomTermsOfServiceSettings should match snap
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div

Просмотреть файл

@@ -44,8 +44,6 @@ const EditTableRow = ({
{hoveredRow === index && (
<>
<WithTooltip
id='edit-tooltip'
placement='top'
title={formatMessage({id: 'admin.ip_filtering.edit', defaultMessage: 'Edit'})}
>
<div
@@ -58,8 +56,6 @@ const EditTableRow = ({
</div>
</WithTooltip>
<WithTooltip
id='delete-tooltip'
placement='top'
title={formatMessage({id: 'admin.ip_filtering.delete', defaultMessage: 'Delete'})}
>
<div

Просмотреть файл

@@ -65,8 +65,6 @@ export function ElapsedDurationCell(props: Props) {
return (
<WithTooltip
id='system-users-cell-elapsed-duration-tooltip'
placement='bottom'
title={exactPassedInDate}
>
<span>{elapsedDaysText}</span>

Просмотреть файл

@@ -239,8 +239,6 @@ export default abstract class OLDAdminSettings <Props extends BaseProps, State e
}
/>
<WithTooltip
id='error-tooltip'
placement='top'
title={this.state?.serverError ?? ''}
>
<div

Просмотреть файл

@@ -25,8 +25,6 @@ exports[`components/admin_console/permission_schemes_settings/permission_descrip
>
<WithTooltip
disabled={false}
id="defaultID"
placement="top"
title={
<span
className="inherit-link-wrapper"
@@ -44,108 +42,42 @@ exports[`components/admin_console/permission_schemes_settings/permission_descrip
</span>
}
>
<OverlayTrigger
defaultOverlayShown={false}
delay={400}
disabled={false}
overlay={<Unknown />}
placement="top"
trigger={
Array [
"hover",
"focus",
]
}
<span
className="permission-description"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onMouseLeave={[Function]}
onMouseMove={[Function]}
onPointerDown={[Function]}
onPointerEnter={[Function]}
>
<OverlayTrigger
defaultOverlayShown={false}
delay={400}
overlay={
<OverlayWrapper
intl={
Object {
"$t": [Function],
"defaultFormats": Object {},
"defaultLocale": "en",
"defaultRichTextElements": undefined,
"fallbackOnEmptyString": true,
"formatDate": [Function],
"formatDateTimeRange": [Function],
"formatDateToParts": [Function],
"formatDisplayName": [Function],
"formatList": [Function],
"formatListToParts": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatNumberToParts": [Function],
"formatPlural": [Function],
"formatRelativeTime": [Function],
"formatTime": [Function],
"formatTimeToParts": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getDisplayNames": [Function],
"getListFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralRules": [Function],
"getRelativeTimeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"onError": [Function],
"onWarn": [Function],
"textComponent": "span",
"timeZone": "Etc/UTC",
"wrapRichTextChunksInFragment": undefined,
}
}
/>
}
placement="top"
trigger={
Array [
"hover",
"focus",
]
}
<span
className="inherit-link-wrapper"
>
<span
className="permission-description"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
<FormattedMessage
defaultMessage="Inherited from <link>{name}</link>."
id="admin.permissions.inherited_from"
values={
Object {
"link": [Function],
"name": "All Members",
}
}
>
<span
className="inherit-link-wrapper"
>
<FormattedMessage
defaultMessage="Inherited from <link>{name}</link>."
id="admin.permissions.inherited_from"
values={
Object {
"link": [Function],
"name": "All Members",
}
}
<span>
Inherited from
<a
key=".$.1"
>
<span>
Inherited from
<a
key=".$.1"
>
All Members
</a>
.
</span>
</FormattedMessage>
All Members
</a>
.
</span>
</span>
</OverlayTrigger>
</OverlayTrigger>
</FormattedMessage>
</span>
</span>
</WithTooltip>
</PermissionDescription>
</Provider>
@@ -199,8 +131,6 @@ exports[`components/admin_console/permission_schemes_settings/permission_descrip
exports[`components/admin_console/permission_schemes_settings/permission_description should match snapshot with clickable link 1`] = `
<WithTooltip
disabled={false}
id="defaultID"
placement="top"
title={
<span>
This is a clickable description
@@ -221,8 +151,6 @@ exports[`components/admin_console/permission_schemes_settings/permission_descrip
exports[`components/admin_console/permission_schemes_settings/permission_description should match snapshot with default Props 1`] = `
<WithTooltip
disabled={false}
id="defaultID"
placement="top"
title="This is the description"
>
<span

Просмотреть файл

@@ -68,8 +68,6 @@ const PermissionDescription = ({
return (
<WithTooltip
id={id}
placement='top'
title={content}
disabled={!showTooltip}
>

Просмотреть файл

@@ -273,8 +273,6 @@ exports[`components/admin_console/permission_schemes_settings/permissions_scheme
Team 8
</span>
<WithTooltip
id="id-extra-teams-overlay"
placement="bottom"
title="Team 9, Team 10"
>
<span

Просмотреть файл

@@ -145,9 +145,7 @@ export default class PermissionsSchemeSummary extends React.PureComponent<Props
if (teams.length > MAX_TEAMS_PER_SCHEME_SUMMARY) {
extraTeams = (
<WithTooltip
id={scheme.id + '-extra-teams-overlay'}
title={this.props?.teams?.slice(MAX_TEAMS_PER_SCHEME_SUMMARY).map((team) => team.display_name).join(', ') ?? ''}
placement='bottom'
>
<span
className='team'

Просмотреть файл

@@ -244,8 +244,6 @@ exports[`components/PluginManagement should match snapshot 1`] = `
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -505,8 +503,6 @@ exports[`components/PluginManagement should match snapshot when \`Enable Marketp
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -583,8 +579,6 @@ exports[`components/PluginManagement should match snapshot when \`Enable Plugins
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -844,8 +838,6 @@ exports[`components/PluginManagement should match snapshot when \`Enable Remote
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -1107,8 +1099,6 @@ exports[`components/PluginManagement should match snapshot when \`Require Signat
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -1372,8 +1362,6 @@ exports[`components/PluginManagement should match snapshot, No installed plugins
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -1633,8 +1621,6 @@ exports[`components/PluginManagement should match snapshot, allow insecure URL e
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -1878,8 +1864,6 @@ exports[`components/PluginManagement should match snapshot, disabled 1`] = `
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -2139,8 +2123,6 @@ exports[`components/PluginManagement should match snapshot, text entered into th
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -2407,8 +2389,6 @@ exports[`components/PluginManagement should match snapshot, upload disabled 1`]
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -2731,8 +2711,6 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -3023,8 +3001,6 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -3315,8 +3291,6 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -3607,8 +3581,6 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div
@@ -3931,8 +3903,6 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
}
/>
<WithTooltip
id="error-tooltip"
placement="top"
title=""
>
<div

Просмотреть файл

@@ -1350,8 +1350,6 @@ export class SchemaAdminSettings extends React.PureComponent<Props, State> {
savingMessage={this.props.intl.formatMessage({id: 'admin.saving', defaultMessage: 'Saving Config...'})}
/>
<WithTooltip
id='error-tooltip'
placement='top'
title={this.state?.serverError ?? ''}
>
<div

Просмотреть файл

@@ -230,8 +230,6 @@ export const ConnectionStatusLabel = ({rc}: {rc: RemoteCluster}) => {
return (
<WithTooltip
id='connection-status-tooltip'
placement='top'
title={(
<>
<FormattedMessage

Просмотреть файл

@@ -459,7 +459,6 @@ export class SystemUserDetail extends PureComponent<Props, State> {
{
this.props.showLockedManageUserSettings &&
<WithTooltip
id='adminUserSettingUpdateDisabled'
title={defineMessage({
id: 'generic.enterprise_feature',
defaultMessage: 'Enterprise feature',
@@ -468,7 +467,6 @@ export class SystemUserDetail extends PureComponent<Props, State> {
id: 'admin.user_item.manageSettings.disabled_tooltip',
defaultMessage: 'Please upgrade to Enterprise to manage user settings',
})}
placement='top'
>
<button
className='manageUserSettingsBtn btn disabled'

Просмотреть файл

@@ -279,13 +279,11 @@ function SystemUsers(props: Props) {
{getDisplayName(info.row.original) || ''}
{isRemoteUser && (
<SharedUserIndicator
id={`sharedUserIndicator-${info.row.original.id}`}
title={formatMessage({id: 'admin.system_users.list.userIsRemote', defaultMessage: 'Remote user'})}
ariaLabel={formatMessage({id: 'admin.system_users.list.userIsRemoteAriaLabel', defaultMessage: 'This is a remote user'})}
role='img'
className='icon-12'
withTooltip={true}
placement='top'
/>
)}
</div>

Просмотреть файл

@@ -155,10 +155,9 @@ export function SystemUsersColumnTogglerMenu(props: Props) {
return (
<WithTooltip
key={column.id}
id={column.id}
title={formatMessage({id: 'admin.system_users.column_toggler.mysql_unavailable.title', defaultMessage: 'Not available for servers using MySQL'})}
hint={formatMessage({id: 'admin.system_users.column_toggler.mysql_unavailable.desc', defaultMessage: 'Please use the export functionality to view these values'})}
placement='left'
isVertical={false}
>
<Menu.Item
className='systemUsersColumnToggler__lockedItem'

Просмотреть файл

@@ -113,10 +113,8 @@ export function SystemUsersExport(props: Props) {
return (
<>
<WithTooltip
id='sharedTooltip'
title={formatMessage({id: 'admin.system_users.exportButton.notLicensed.title', defaultMessage: 'Professional feature'})}
hint={formatMessage({id: 'admin.system_users.exportButton.notLicensed.hint', defaultMessage: 'This feature is available on the professional plan'})}
placement='top'
>
{button}
</WithTooltip>

Просмотреть файл

@@ -29,8 +29,6 @@ exports[`components/admin_console/team_channel_settings/group/UsersToRemoveGroup
className="UsersToRemoveGroups"
>
<WithTooltip
id="groupsTooltip"
placement="bottom"
title="group1, group2, group3"
>
<a

Просмотреть файл

@@ -39,8 +39,6 @@ export default function UsersToRemoveGroups(props: UsersToRemoveGroupsProps): JS
column = (
<WithTooltip
id='groupsTooltip'
placement='bottom'
title={tooltip}
>
<a href='#'>{message}</a>

Просмотреть файл

@@ -65,10 +65,8 @@ export function TeamProfile({team, isArchived, onToggleArchive, isDisabled, save
if (restoreDisabled) {
return (
<WithTooltip
id='sharedTooltip'
title={defineMessage({id: 'workspace_limits.teams_limit_reached.upgrade_to_unarchive', defaultMessage: 'Upgrade to Unarchive'})}
hint={defineMessage({id: 'workspace_limits.teams_limit_reached.tool_tip', defaultMessage: 'You\'ve reached the team limit for your current plan. Consider upgrading to unarchive this team or archive your other teams'})}
placement='bottom'
title={intl.formatMessage({id: 'workspace_limits.teams_limit_reached.upgrade_to_unarchive', defaultMessage: 'Upgrade to Unarchive'})}
hint={intl.formatMessage({id: 'workspace_limits.teams_limit_reached.tool_tip', defaultMessage: 'You\'ve reached the team limit for your current plan. Consider upgrading to unarchive this team or archive your other teams'})}
>
<div
className={'disabled-overlay-wrapper'}

Просмотреть файл

@@ -134,8 +134,6 @@ export default class UserGridRoleDropdown extends React.PureComponent<Props> {
return (
<div className='more-modal__shared-actions'>
<WithTooltip
id='userGridDropdown.sharedUserIndicator.tooltip'
placement='bottom'
title={
<FormattedMessage
id='shared_user_indicator.tooltip'

Просмотреть файл

@@ -147,8 +147,6 @@ const FormattingIcon = (props: FormattingIconProps): JSX.Element => {
return (
<WithTooltip
id='formatting-icon-tooltip'
placement='top'
title={
<KeyboardShortcutSequence
shortcut={shortcut}

Просмотреть файл

@@ -1,102 +1,41 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import classNames from 'classnames';
import React, {memo} from 'react';
import type {CSSProperties} from 'react';
import {FormattedMessage, useIntl} from 'react-intl';
import styled from 'styled-components';
import {CheckCircleOutlineIcon, BellRingOutlineIcon} from '@mattermost/compass-icons/components';
import type {PostPriorityMetadata} from '@mattermost/types/posts';
import {HasNoMentions, HasSpecialMentions} from 'components/post_priority/error_messages';
import PriorityLabel from 'components/post_priority/post_priority_label';
import WithTooltip from 'components/with_tooltip';
import './priority_labels.scss';
type Props = {
canRemove: boolean;
hasError: boolean;
specialMentions?: {[key: string]: boolean};
onRemove?: () => void;
padding?: CSSProperties['padding'];
persistentNotifications?: PostPriorityMetadata['persistent_notifications'];
priority?: PostPriorityMetadata['priority'];
requestedAck?: PostPriorityMetadata['requested_ack'];
};
type StyledProps = {
hasError: boolean;
};
const Priority = styled.div`
align-items: center;
display: flex;
gap: 6px;
padding: ${(props: {padding: CSSProperties['padding']}) => props.padding || '14px 16px 0'}
`;
const Acknowledgements = styled.div`
align-items: center;
color: ${(props: StyledProps) => (props.hasError ? 'var(--dnd-indicator)' : 'var(--online-indicator)')};
display: flex;
> span {
margin-left: 4px;
font-size: 11px;
font-weight: 600;
}
`;
const Notifications = styled.div`
align-items: center;
color: var(--dnd-indicator);
display: flex;
> span {
margin-left: 4px;
font-size: 11px;
font-weight: 600;
}
`;
const Close = styled.button`
align-items: center;
color: rgb(var(--center-channel-color));
display: flex;
font-size: 17px;
justify-content: center;
margin-top: -1px;
opacity: 0.73;
visibility: hidden;
&:hover {
opacity: 0.73;
}
${Priority}:hover & {
visibility: visible;
}
`;
const Error = styled.div`
color: var(--dnd-indicator);
font-size: 11px;
font-weight: 600;
`;
function PriorityLabels({
canRemove,
hasError,
specialMentions,
onRemove,
padding,
persistentNotifications,
priority,
requestedAck,
}: Props) {
const intl = useIntl();
return (
<Priority padding={padding}>
<div className='priorityLabelsContainer'>
{priority && (
<PriorityLabel
size='xs'
@@ -105,29 +44,23 @@ function PriorityLabels({
)}
{persistentNotifications && (
<WithTooltip
id='post-priority-picker-persistent-notifications-tooltip'
placement='top'
title={intl.formatMessage({
id: 'post_priority.persistent_notifications.tooltip',
defaultMessage: 'Persistent notifications will be sent',
})}
>
<Notifications>
<BellRingOutlineIcon size={14}/>
</Notifications>
<span className='icon icon-bell-ring-outline'/>
</WithTooltip>
)}
{requestedAck && (
<Acknowledgements hasError={hasError}>
<div className={classNames('priorityLabelsAcknowledgements', {hasError})}>
<WithTooltip
id='post-priority-picker-ack-tooltip'
placement='top'
title={intl.formatMessage({
id: 'post_priority.request_acknowledgement.tooltip',
defaultMessage: 'Acknowledgement will be requested',
})}
>
<CheckCircleOutlineIcon size={14}/>
<span className='icon icon-check-circle-outline'/>
</WithTooltip>
{!(priority) && (
<FormattedMessage
@@ -135,25 +68,22 @@ function PriorityLabels({
defaultMessage={'Request acknowledgement'}
/>
)}
</Acknowledgements>
</div>
)}
{hasError && (
<Error>
<div className='priorityLabelsError'>
{(specialMentions && Object.values(specialMentions).includes(true)) ? <HasSpecialMentions specialMentions={specialMentions}/> : <HasNoMentions/>}
</Error>
</div>
)}
{canRemove && (
<WithTooltip
id='post-priority-picker-tooltip'
placement='top'
title={intl.formatMessage({
id: 'post_priority.remove',
defaultMessage: 'Remove {priority}',
}, {priority})}
>
<Close
type='button'
className='close'
<button
className='priorityLabelsClose close'
onClick={onRemove}
>
<span aria-hidden='true'>{'×'}</span>
@@ -164,10 +94,10 @@ function PriorityLabels({
values={{priority}}
/>
</span>
</Close>
</button>
</WithTooltip>
)}
</Priority>
</div>
);
}

Просмотреть файл

@@ -0,0 +1,45 @@
.priorityLabelsContainer {
display: flex;
align-items: center;
padding: 14px 16px 0;
gap: 6px;
&:hover {
.priorityLabelsClose {
visibility: visible;
}
}
.priorityLabelsClose {
display: flex;
align-items: center;
justify-content: center;
margin-top: -1px;
color: rgb(var(--center-channel-color));
font-size: 17px;
opacity: 0.73;
visibility: hidden;
}
span.icon {
font-size: 14px;
&.icon-bell-ring-outline {
color: var(--dnd-indicator);
}
&.icon-check-circle-outline {
color: var(--online-indicator);
&.hasError {
color: var(--dnd-indicator);
}
}
}
.priorityLabelsError {
color: var(--dnd-indicator);
font-size: 11px;
font-weight: 600;
}
}

Просмотреть файл

@@ -15,8 +15,8 @@ import {isSendOnCtrlEnter} from 'selectors/preferences';
import {SendPostOptions} from 'components/advanced_text_editor/send_button/send_post_options';
import WithTooltip from 'components/with_tooltip';
import type {ShortcutDefinition} from 'components/with_tooltip/shortcut';
import {ShortcutKeys} from 'components/with_tooltip/shortcut';
import type {ShortcutDefinition} from 'components/with_tooltip/tooltip_shortcut';
import {ShortcutKeys} from 'components/with_tooltip/tooltip_shortcut';
import './send_button.scss';
@@ -65,8 +65,6 @@ const SendButton = ({disabled, handleSubmit, channelId}: SendButtonProps) => {
return (
<div className={classNames('splitSendButton', {disabled, scheduledPost: isScheduledPostEnabled})}>
<WithTooltip
placement='top'
id='send_post_now_tooltip'
title={formatMessage({id: 'create_post_button.option.send_now', defaultMessage: 'Send Now'})}
shortcut={sendNowKeyboardShortcutDescriptor}
disabled={disabled}

Просмотреть файл

@@ -63,13 +63,13 @@ export function SendPostOptions({disabled, onSelect, channelId}: Props) {
return (
<Menu.Container
hideTooltipWhenDisabled={true}
menuButtonTooltip={{
id: 'send_post_option_schedule_post',
text: formatMessage({
id: 'create_post_button.option.schedule_message',
defaultMessage: 'Schedule message',
}),
disabled,
}}
menuButton={{
id: 'button_send_post_options',

Просмотреть файл

@@ -25,7 +25,6 @@ const ShowFormatting = (props: ShowFormatProps): JSX.Element => {
return (
<WithTooltip
id='PreviewInputTextButtonTooltip'
title={
<KeyboardShortcutSequence
shortcut={KEYBOARD_SHORTCUTS.msgMarkdownPreview}
@@ -33,7 +32,6 @@ const ShowFormatting = (props: ShowFormatProps): JSX.Element => {
isInsideTooltip={true}
/>
}
placement='left'
>
<IconContainer
type='button'

Просмотреть файл

@@ -41,9 +41,7 @@ const ToggleFormattingBar = (props: ToggleFormattingBarProps): JSX.Element => {
return (
<WithTooltip
id={active ? 'toggleFormattingBarButtonTooltip_active' : 'toggleFormattingBarButtonTooltip_inactive'}
title={title}
placement={'top'}
>
<IconContainer
type='button'

Просмотреть файл

@@ -129,8 +129,6 @@ const useEmojiPicker = (
topOffset={-7}
/>
<WithTooltip
id='upload-tooltip'
placement='top'
title={
<KeyboardShortcutSequence
shortcut={KEYBOARD_SHORTCUTS.msgShowEmojiPicker}

Просмотреть файл

@@ -122,9 +122,8 @@ const AlertBanner = ({
</div>
{onDismiss && closeBtnTooltip && (
<WithTooltip
id={`alertBannerTooltip_${id}`}
title={closeBtnTooltip}
placement='left'
isVertical={false}
>
{dismissButton}
</WithTooltip>

Просмотреть файл

@@ -22,8 +22,6 @@ exports[`components/analytics/table_chart.tsx should match snapshot, loaded with
>
<td>
<WithTooltip
id="tip-table-entry-test1"
placement="top"
title="test-tip1"
>
<span>
@@ -42,8 +40,6 @@ exports[`components/analytics/table_chart.tsx should match snapshot, loaded with
>
<td>
<WithTooltip
id="tip-table-entry-test2"
placement="top"
title="test-tip2"
>
<span>

Просмотреть файл

@@ -17,10 +17,8 @@ const Title = () => {
const intl = useIntl();
return (
<WithTooltip
id='activated_user_title_tooltip'
title={defineMessage({id: 'analytics.team.totalUsers.title.tooltip.title', defaultMessage: 'Activated users on this server'})}
hint={defineMessage({id: 'analytics.team.totalUsers.title.tooltip.hint', defaultMessage: 'Also called Registered Users'})}
placement='top'
>
<span>
<ExternalLink

Просмотреть файл

@@ -32,8 +32,6 @@ const TableChart = ({
<tr key={'table-entry-' + item.name}>
<td>
<WithTooltip
id={'tip-table-entry-' + item.name}
placement='top'
title={item.tip}
>
<span>{item.name}</span>

Просмотреть файл

@@ -44,8 +44,6 @@ type State = {
isStringContainingUrl: boolean;
}
const OVERLAY_ANNOUNCEMENT_HIDE_DELAY = 600;
export default class AnnouncementBar extends React.PureComponent<Props, State> {
messageRef: React.RefObject<HTMLDivElement>;
constructor(props: Props) {
@@ -196,10 +194,8 @@ export default class AnnouncementBar extends React.PureComponent<Props, State> {
if (this.state.showTooltip) {
barContent = (
<WithTooltip
id='announcement-bar__tooltip'
title={this.props.tooltipMsg ? this.props.tooltipMsg : message}
placement='bottom'
delayHide={this.state.isStringContainingUrl ? OVERLAY_ANNOUNCEMENT_HIDE_DELAY : 0}
tooltipContentContainerClassName='announcementBarTooltip'
>
{barContent}

Просмотреть файл

@@ -1,5 +1,5 @@
#announcement-bar__tooltip {
width: 50%;
max-width: 100%;
.announcementBarTooltip {
min-width: 50vw;
max-width: 100vw;
pointer-events: auto;
}

Просмотреть файл

@@ -84,9 +84,8 @@ const AppBarBinding = (props: BindingComponentProps) => {
return (
<WithTooltip
id={'tooltip-' + id}
title={label}
placement='left'
isVertical={false}
>
<div
id={id}

Просмотреть файл

@@ -32,9 +32,8 @@ const AppBarMarketplace = () => {
return (
<WithTooltip
id='tooltip-app-bar-marketplace'
title={label}
placement='left'
isVertical={false}
>
<button
key='app_bar_marketplace'

Просмотреть файл

@@ -96,9 +96,8 @@ const AppBarPluginComponent = (props: PluginComponentProps) => {
return (
<WithTooltip
id={'pluginTooltip-' + buttonId}
title={tooltipText}
placement='left'
isVertical={false}
>
<div
id={buttonId}

Просмотреть файл

@@ -1664,8 +1664,6 @@ exports[`components/ChannelHeader should render correct menu when muted 1`] = `
className="channel-header__icons"
>
<WithTooltip
id="channelMutedTooltip"
placement="bottom"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Unmute"
@@ -2498,13 +2496,11 @@ exports[`components/ChannelHeader should render properly when custom status is s
}
}
showTooltip={true}
tooltipDirection="bottom"
userID="user_id"
/>
<CustomStatusText
className="custom-emoji__text"
text="In a meeting"
tooltipDirection="bottom"
/>
</div>
</span>

Просмотреть файл

@@ -239,7 +239,6 @@ class ChannelHeader extends React.PureComponent<Props, State> {
<CustomStatusEmoji
userID={this.props.dmUser?.id}
showTooltip={true}
tooltipDirection='bottom'
emojiStyle={{
verticalAlign: 'top',
margin: '0 4px 1px',
@@ -569,8 +568,6 @@ class ChannelHeader extends React.PureComponent<Props, State> {
if (channelMuted) {
muteTrigger = (
<WithTooltip
id='channelMutedTooltip'
placement='bottom'
title={
<FormattedMessage
id='channelHeader.unmute'

Просмотреть файл

@@ -138,8 +138,6 @@ const ChannelHeaderTitle = ({
>
{showTooltip ? (
<WithTooltip
id='channelHeaderTooltip'
placement='bottom'
title={channelTitle as string}
>
<strong

Просмотреть файл

@@ -1,7 +1,7 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import {screen, fireEvent, act} from '@testing-library/react';
import {screen, fireEvent, act, waitFor} from '@testing-library/react';
import React from 'react';
import type {Channel} from '@mattermost/types/channels';
@@ -189,10 +189,7 @@ describe('ChannelHeaderTitleFavorite Component', () => {
expect(icon).toHaveClass('icon-star');
});
it('should dispatch A11yFocusEvent after toggling favorite', () => {
// Use fake timers to handle requestAnimationFrame
jest.useFakeTimers();
it('should dispatch A11yFocusEvent after toggling favorite', async () => {
isCurrentChannelFavoriteMock.mockReturnValue(false);
getCurrentChannelMock.mockReturnValue(activeChannel);
@@ -207,28 +204,36 @@ describe('ChannelHeaderTitleFavorite Component', () => {
renderComponent();
const button = screen.getByRole('button', {name: ADD_TO_FAVORITES_REGEX});
fireEvent.click(button);
// Ensure the ref is set by triggering a focus event
fireEvent.focus(button);
act(() => {
fireEvent.click(button);
});
expect(dispatchMock).toHaveBeenCalledWith({
type: 'FAVORITE_CHANNEL',
data: activeChannel.id,
});
// Execute the requestAnimationFrame callback
act(() => {
jest.runAllTimers();
await waitFor(() => {
expect(dispatchEventSpy).toHaveBeenCalled();
}, {
timeout: 1000, // Increase timeout
});
expect(dispatchEventSpy).toHaveBeenCalled();
// Verify the details of the dispatched event
const event = dispatchEventSpy.mock.calls.find((call) => call[0].type === A11yCustomEventTypes.FOCUS)?.[0] as CustomEvent<A11yFocusEventDetail>;
expect(event).toBeDefined();
const focusEvents = dispatchEventSpy.mock.calls.
filter((call) => call[0].type === A11yCustomEventTypes.FOCUS).
map((call) => call[0] as CustomEvent<A11yFocusEventDetail>);
expect(focusEvents.length).toBeGreaterThan(0);
const event = focusEvents[focusEvents.length - 1];
expect(event.detail.target).toBe(button);
expect(event.detail.keyboardOnly).toBe(false);
// Cleanup
dispatchEventSpy.mockRestore();
jest.useRealTimers();
});
});

Просмотреть файл

@@ -73,10 +73,7 @@ const ChannelHeaderTitleFavorite = () => {
return (
<WithTooltip
key={`isFavorite-${isFavorite}`}
id='favoriteTooltip'
title={title}
placement='bottom'
>
<button
id='toggleFavorite'

Просмотреть файл

@@ -5,7 +5,7 @@ import React from 'react';
import NewChannelWithBoardTourTip from 'components/app_bar/new_channel_with_board_tour_tip';
import WithTooltip from 'components/with_tooltip';
import type {ShortcutDefinition} from 'components/with_tooltip/shortcut';
import type {ShortcutDefinition} from 'components/with_tooltip/tooltip_shortcut';
import {suitePluginIds} from 'utils/constants';
@@ -47,8 +47,6 @@ const HeaderIconWrapper = (props: Props) => {
return (
<>
<WithTooltip
id={buttonId + '-tooltip'}
placement='bottom'
title={isRhsOpen ? '' : tooltipText}
shortcut={tooltipShortcut}
>

Просмотреть файл

@@ -59,8 +59,6 @@ const Header = ({channel, isArchived, isMobile, onClose}: Props) => {
</span>
<WithTooltip
id='closeSidebarTooltip'
placement='top'
title={
<FormattedMessage
id='rhs_header.closeSidebarTooltip'

Просмотреть файл

@@ -124,8 +124,6 @@ export default function TopButtons({
return (
<ChannelInfoRhsTopButtons>
<WithTooltip
placement='top'
id='favorite-tooltip'
title={
<FormattedMessage
id='channel_info_rhs.top_buttons.favorite.tooltip'
@@ -144,8 +142,6 @@ export default function TopButtons({
</Button>
</WithTooltip>
<WithTooltip
placement='top'
id='mute-tooltip'
title={
<FormattedMessage
id='channel_info_rhs.top_buttons.mute.tooltip'
@@ -165,8 +161,6 @@ export default function TopButtons({
</WithTooltip>
{canAddPeople && (
<WithTooltip
id='add-people-tooltip'
placement='top'
title={
<FormattedMessage
id='channel_info_rhs.top_buttons.add_people.tooltip'
@@ -192,8 +186,6 @@ export default function TopButtons({
)}
{canCopyLink && (
<WithTooltip
id='copy-link-tooltip'
placement='top'
title={
<FormattedMessage
id='channel_info_rhs.top_buttons.copy_link.tooltip'

Просмотреть файл

@@ -104,9 +104,7 @@ const GroupOption = (props: Props) => {
{'@'}{group.name}
</span>
<WithTooltip
id={'usernames-overflow'}
title={overflowNames}
placement={'top'}
>
<span
className='add-group-members'

Просмотреть файл

@@ -460,8 +460,6 @@ exports[`components/channel_invite_modal/team_warning_banner should match snapsh
/>,
" and ",
<WithTooltip
id="usernames-overflow"
placement="top"
title="@user-1, @user-2, @user-3, @user-4, @user-5, @user-6, @user-7, @user-8, @user-9, @user-10"
>
<span
@@ -562,102 +560,33 @@ exports[`components/channel_invite_modal/team_warning_banner should match snapsh
</Connect(Component)>
and
<WithTooltip
id="usernames-overflow"
key=".2"
placement="top"
title="@user-1, @user-2, @user-3, @user-4, @user-5, @user-6, @user-7, @user-8, @user-9, @user-10"
>
<OverlayTrigger
defaultOverlayShown={false}
delay={400}
disabled={false}
overlay={<Unknown />}
placement="top"
trigger={
Array [
"hover",
"focus",
]
}
<span
className="add-others-link"
onBlur={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onMouseLeave={[Function]}
onMouseMove={[Function]}
onPointerDown={[Function]}
onPointerEnter={[Function]}
>
<OverlayTrigger
defaultOverlayShown={false}
delay={400}
overlay={
<OverlayWrapper
intl={
Object {
"$t": [Function],
"defaultFormats": Object {},
"defaultLocale": "en",
"defaultRichTextElements": undefined,
"fallbackOnEmptyString": true,
"formatDate": [Function],
"formatDateTimeRange": [Function],
"formatDateToParts": [Function],
"formatDisplayName": [Function],
"formatList": [Function],
"formatListToParts": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatNumberToParts": [Function],
"formatPlural": [Function],
"formatRelativeTime": [Function],
"formatTime": [Function],
"formatTimeToParts": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getDisplayNames": [Function],
"getListFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralRules": [Function],
"getRelativeTimeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"onError": [Function],
"onWarn": [Function],
"textComponent": "span",
"timeZone": "Etc/UTC",
"wrapRichTextChunksInFragment": undefined,
}
}
/>
}
placement="top"
trigger={
Array [
"hover",
"focus",
]
<FormattedMessage
defaultMessage="{count} others"
id="channel_invite.invite_team_members.messageOthers"
values={
Object {
"count": 10,
}
}
>
<span
className="add-others-link"
onBlur={[Function]}
onClick={null}
onFocus={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormattedMessage
defaultMessage="{count} others"
id="channel_invite.invite_team_members.messageOthers"
values={
Object {
"count": 10,
}
}
>
<span>
10 others
</span>
</FormattedMessage>
<span>
10 others
</span>
</OverlayTrigger>
</OverlayTrigger>
</FormattedMessage>
</span>
</WithTooltip>
are guest users and need to first be invited to the team before you can add them to the channel. Once they've joined the team, you can add them to this channel.
</div>
@@ -777,8 +706,6 @@ exports[`components/channel_invite_modal/team_warning_banner should match snapsh
/>,
" and ",
<WithTooltip
id="usernames-overflow"
placement="top"
title="@user-1, @user-2, @user-3, @user-4, @user-5, @user-6, @user-7, @user-8, @user-9, @user-10"
>
<span
@@ -882,102 +809,33 @@ exports[`components/channel_invite_modal/team_warning_banner should match snapsh
</Connect(Component)>
and
<WithTooltip
id="usernames-overflow"
key=".3"
placement="top"
title="@user-1, @user-2, @user-3, @user-4, @user-5, @user-6, @user-7, @user-8, @user-9, @user-10"
>
<OverlayTrigger
defaultOverlayShown={false}
delay={400}
disabled={false}
overlay={<Unknown />}
placement="top"
trigger={
Array [
"hover",
"focus",
]
}
<span
className="add-others-link"
onBlur={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onMouseLeave={[Function]}
onMouseMove={[Function]}
onPointerDown={[Function]}
onPointerEnter={[Function]}
>
<OverlayTrigger
defaultOverlayShown={false}
delay={400}
overlay={
<OverlayWrapper
intl={
Object {
"$t": [Function],
"defaultFormats": Object {},
"defaultLocale": "en",
"defaultRichTextElements": undefined,
"fallbackOnEmptyString": true,
"formatDate": [Function],
"formatDateTimeRange": [Function],
"formatDateToParts": [Function],
"formatDisplayName": [Function],
"formatList": [Function],
"formatListToParts": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatNumberToParts": [Function],
"formatPlural": [Function],
"formatRelativeTime": [Function],
"formatTime": [Function],
"formatTimeToParts": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getDisplayNames": [Function],
"getListFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralRules": [Function],
"getRelativeTimeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"onError": [Function],
"onWarn": [Function],
"textComponent": "span",
"timeZone": "Etc/UTC",
"wrapRichTextChunksInFragment": undefined,
}
}
/>
}
placement="top"
trigger={
Array [
"hover",
"focus",
]
<FormattedMessage
defaultMessage="{count} others"
id="channel_invite.invite_team_members.messageOthers"
values={
Object {
"count": 10,
}
}
>
<span
className="add-others-link"
onBlur={[Function]}
onClick={null}
onFocus={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormattedMessage
defaultMessage="{count} others"
id="channel_invite.invite_team_members.messageOthers"
values={
Object {
"count": 10,
}
}
>
<span>
10 others
</span>
</FormattedMessage>
<span>
10 others
</span>
</OverlayTrigger>
</OverlayTrigger>
</FormattedMessage>
</span>
</WithTooltip>
to this channel once they are members of the
<strong

Просмотреть файл

@@ -63,9 +63,7 @@ const TeamWarningBanner = (props: Props) => {
),
others: (
<WithTooltip
id='usernames-overflow'
title={commaSeparatedUsernames.replace(`@${firstName}, `, '')}
placement='top'
>
<span
className='add-others-link'
@@ -134,9 +132,7 @@ const TeamWarningBanner = (props: Props) => {
),
others: (
<WithTooltip
id='usernames-overflow'
title={commaSeparatedUsernames.replace(`@${firstName}, `, '')}
placement='top'
>
<span
className='add-others-link'

Просмотреть файл

@@ -57,8 +57,6 @@ const Header = ({channel, canGoBack, onClose, goBack}: Props) => {
</span>
<WithTooltip
id='closeSidebarTooltip'
placement='top'
title={
<FormattedMessage
id='rhs_header.closeSidebarTooltip'

Просмотреть файл

@@ -198,12 +198,10 @@ const Member = ({className, channel, member, index, totalUsers, editing, actions
</RoleChooser>
{!editing && (
<WithTooltip
id={`member-tooltip-${member.user.id}`}
title={formatMessage({
id: 'channel_members_rhs.member.send_message',
defaultMessage: 'Send message',
})}
placement='left'
>
<SendMessage onClick={() => actions.openDirectMessage(member.user)}>
<i className='icon icon-send'/>

Просмотреть файл

@@ -5,7 +5,7 @@ import React from 'react';
import {useIntl} from 'react-intl';
import ReplyIcon from 'components/widgets/icons/reply_icon';
import WithTooltip from 'components/with_tooltip/with_tooltip_new';
import WithTooltip from 'components/with_tooltip';
import type {Locations} from 'utils/constants';

Просмотреть файл

@@ -46,8 +46,6 @@ const MultiSelectCard = (props: Props) => {
if (props.tooltip) {
button = (
<WithTooltip
id={props.id}
placement='top'
title={props.tooltip}
>
{button}

Просмотреть файл

@@ -5,14 +5,13 @@ import classNames from 'classnames';
import React, {useRef, useState} from 'react';
import {FormattedMessage, defineMessages, useIntl} from 'react-intl';
import {copyToClipboard} from 'utils/utils';
import WithTooltip from 'components/with_tooltip';
import WithTooltip from './with_tooltip';
import {copyToClipboard} from 'utils/utils';
type Props = {
content: string;
isForText?: boolean;
placement?: string;
className?: string;
};
@@ -54,8 +53,6 @@ const CopyButton: React.FC<Props> = (props: Props) => {
return (
<WithTooltip
id='copyButton.text'
placement={props.placement ?? 'top'}
title={tooltipText}
>
<span

Просмотреть файл

@@ -30,11 +30,7 @@ const CopyText = ({
}
return (
<WithTooltip
id='copyTextTooltip'
placement='top'
title={label}
>
<WithTooltip title={label}>
<button
data-testid='copyText'
className='btn btn-link fa fa-copy ml-2'

Просмотреть файл

@@ -28,8 +28,6 @@ exports[`/components/create_team/components/display_name should match snapshot 1
className="input-group input-group--limit"
>
<WithTooltip
id="urlTooltip"
placement="top"
title="http://localhost:8065/"
>
<span

Просмотреть файл

@@ -233,9 +233,7 @@ export default class TeamUrl extends React.PureComponent<Props, State> {
<div className='col-sm-11'>
<div className='input-group input-group--limit'>
<WithTooltip
id='urlTooltip'
title={title}
placement={'top'}
>
<span className='input-group-addon'>
{title}

Просмотреть файл

@@ -6,6 +6,5 @@ exports[`components/custom_status/custom_status_emoji should match snapshot with
<CustomStatusEmoji
emojiSize={34}
showTooltip={true}
tooltipDirection="bottom"
/>
`;

Просмотреть файл

@@ -19,7 +19,6 @@ exports[`components/custom_status/custom_status_emoji should match snapshot 1`]
<CustomStatusText
className="statusSuggestion__text"
text=""
tooltipDirection="top"
/>
</button>
`;
@@ -43,7 +42,6 @@ exports[`components/custom_status/custom_status_emoji should match snapshot with
<CustomStatusText
className="statusSuggestion__text with_duration"
text=""
tooltipDirection="top"
/>
<span
className="statusSuggestion__duration"

Просмотреть файл

@@ -4,7 +4,6 @@ exports[`components/custom_status/custom_status_text should match snapshot 1`] =
<CustomStatusText
className=""
text=""
tooltipDirection="bottom"
/>
`;
@@ -12,6 +11,5 @@ exports[`components/custom_status/custom_status_text should match snapshot with
<CustomStatusText
className=""
text="In a meeting"
tooltipDirection="top"
/>
`;

Просмотреть файл

@@ -32,7 +32,6 @@ describe('components/custom_status/custom_status_emoji', () => {
<CustomStatusEmoji
emojiSize={34}
showTooltip={true}
tooltipDirection='bottom'
/>,
{wrappingComponent: Provider, wrappingComponentProps: {store}},
);

Просмотреть файл

@@ -1,7 +1,7 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React, {memo, useEffect, useMemo, useRef, useState} from 'react';
import React, {memo, useMemo, useRef} from 'react';
import {useSelector} from 'react-redux';
import {CustomStatusDuration} from '@mattermost/types/users';
@@ -20,7 +20,6 @@ import ExpiryTime from './expiry_time';
interface Props {
emojiSize?: number;
showTooltip?: boolean;
tooltipDirection?: 'top' | 'right' | 'bottom' | 'left';
spanStyle?: React.CSSProperties;
emojiStyle?: React.CSSProperties;
userID?: string;
@@ -46,36 +45,8 @@ function CustomStatusEmoji({
const customStatusExpired = useSelector((state: GlobalState) => isCustomStatusExpired(state, customStatus));
const customStatusEnabled = useSelector(isCustomStatusEnabled);
const [placement, setPlacement] = useState('bottom');
const emojiRef = useRef<HTMLSpanElement>(null);
useEffect(() => {
function handleMouseEnter() {
if (emojiRef.current) {
const boundingRect = emojiRef.current.getBoundingClientRect();
const windowHeight = window.innerHeight;
const threshold = windowHeight * 0.8;
if (boundingRect.bottom >= threshold) {
setPlacement('top');
} else {
setPlacement('bottom');
}
}
}
const emojiElement = emojiRef.current;
if (emojiElement) {
emojiElement.addEventListener('mouseenter', handleMouseEnter);
}
return () => {
if (emojiElement) {
emojiElement.removeEventListener('mouseenter', handleMouseEnter);
}
};
}, []);
if (!customStatusEnabled || !customStatus?.emoji || customStatusExpired) {
return null;
}
@@ -95,7 +66,6 @@ function CustomStatusEmoji({
return (
<WithTooltip
id='custom-status-tooltip'
title={
<>
<div className='custom-status'>
@@ -120,8 +90,7 @@ function CustomStatusEmoji({
</>
}
emoji={customStatus.emoji}
emojiStyle='large'
placement={placement}
isEmojiLarge={true}
>
<span
ref={emojiRef}

Просмотреть файл

@@ -462,7 +462,6 @@ const CustomStatusModal: React.FC<Props> = (props: Props) => {
onClear={clearHandle}
className='emoji-quick-input form-control'
clearClassName='StatusModal__clear-container'
tooltipPosition='top'
onChange={handleTextChange}
placeholder={formatMessage({id: 'custom_status.set_status', defaultMessage: 'Set a status'})}
autoFocus={true}

Просмотреть файл

@@ -43,14 +43,12 @@ const CustomStatusSuggestion: React.FC<Props> = (props: Props) => {
const clearButton = handleClear ? (
<div className='suggestion-clear'>
<WithTooltip
placement='top'
title={
<FormattedMessage
id='custom_status.suggestions.clear'
defaultMessage='Clear'
/>
}
id='clear-recent-custom-status'
>
<button
className='style--none input-clear-x'
@@ -78,7 +76,6 @@ const CustomStatusSuggestion: React.FC<Props> = (props: Props) => {
</div>
<CustomStatusText
text={text}
tooltipDirection='top'
className={classNames('statusSuggestion__text', {
with_duration: duration,
})}

Просмотреть файл

@@ -25,7 +25,6 @@ describe('components/custom_status/custom_status_text', () => {
it('should match snapshot with props', () => {
const wrapper = mount(
<CustomStatusText
tooltipDirection='top'
text='In a meeting'
/>,
{wrappingComponent: Provider, wrappingComponentProps: {store}},

Просмотреть файл

@@ -11,13 +11,12 @@ import WithTooltip from 'components/with_tooltip';
import type {GlobalState} from 'types/store';
interface ComponentProps {
tooltipDirection?: 'top' | 'right' | 'bottom' | 'left';
text: string;
className?: string;
}
const CustomStatusText = (props: ComponentProps) => {
const {tooltipDirection, text, className} = props;
const {text, className} = props;
const customStatusEnabled = useSelector((state: GlobalState) => {
return isCustomStatusEnabled(state);
});
@@ -49,8 +48,6 @@ const CustomStatusText = (props: ComponentProps) => {
return (
<WithTooltip
id='custom-status-tooltip'
placement={tooltipDirection}
title={text}
>
{customStatusTextComponent}
@@ -59,7 +56,6 @@ const CustomStatusText = (props: ComponentProps) => {
};
CustomStatusText.defaultProps = {
tooltipDirection: 'bottom',
text: '',
className: '',
};

Просмотреть файл

@@ -5,8 +5,6 @@ exports[`components/drafts/draft_actions/action should match snapshot 1`] = `
className="DraftAction"
>
<WithTooltip
id="drafts_action_tooltip_"
placement="top"
title=""
>
<button

Просмотреть файл

@@ -26,8 +26,6 @@ function Action({
return (
<div className='DraftAction'>
<WithTooltip
id={`drafts_action_tooltip_${id}`}
placement='top'
title={tooltipText}
>
<button

Просмотреть файл

@@ -138,8 +138,6 @@ function DraftsLink() {
</span>
</div>
<WithTooltip
placement='right'
id='draft-scheduled-post-tooltip'
title={tooltipText}
>
<div>

Просмотреть файл

@@ -64,7 +64,7 @@ exports[`components/drafts/panel/panel_body should have called handleFormattedTe
<span
className="profile-icon "
>
<Memo(Avatar)
<Avatar
size="md"
url="/api/v4/users/user_id/image?_=0"
username="username"
@@ -76,7 +76,7 @@ exports[`components/drafts/panel/panel_body should have called handleFormattedTe
onError={[Function]}
src="/api/v4/users/user_id/image?_=0"
/>
</Memo(Avatar)>
</Avatar>
</span>
</button>
</RoundButton>
@@ -290,7 +290,7 @@ exports[`components/drafts/panel/panel_body should match snapshot 1`] = `
<span
className="profile-icon "
>
<Memo(Avatar)
<Avatar
size="md"
url="/api/v4/users/user_id/image?_=0"
username="username"
@@ -302,7 +302,7 @@ exports[`components/drafts/panel/panel_body should match snapshot 1`] = `
onError={[Function]}
src="/api/v4/users/user_id/image?_=0"
/>
</Memo(Avatar)>
</Avatar>
</span>
</button>
</RoundButton>
@@ -522,7 +522,7 @@ exports[`components/drafts/panel/panel_body should match snapshot for priority 1
<span
className="profile-icon "
>
<Memo(Avatar)
<Avatar
size="md"
url="/api/v4/users/user_id/image?_=0"
username="username"
@@ -534,7 +534,7 @@ exports[`components/drafts/panel/panel_body should match snapshot for priority 1
onError={[Function]}
src="/api/v4/users/user_id/image?_=0"
/>
</Memo(Avatar)>
</Avatar>
</span>
</button>
</RoundButton>
@@ -614,64 +614,59 @@ exports[`components/drafts/panel/panel_body should match snapshot for priority 1
<Memo(PriorityLabels)
canRemove={false}
hasError={false}
padding="0 0 0 8px"
priority="important"
requestedAck={false}
>
<Priority
padding="0 0 0 8px"
<div
className="priorityLabelsContainer"
>
<div
className="Priority-unHRQ dkJcdD"
<PriorityLabel
priority="important"
size="xs"
>
<PriorityLabel
priority="important"
<Memo(Tag)
icon="alert-circle-outline"
size="xs"
text="Important"
uppercase={true}
variant="info"
>
<Memo(Tag)
icon="alert-circle-outline"
size="xs"
text="Important"
<TagWrapper
as="div"
className="Tag Tag--info Tag--xs"
uppercase={true}
variant="info"
>
<TagWrapper
as="div"
className="Tag Tag--info Tag--xs"
uppercase={true}
<div
className="TagWrapper-keYggn gnIgwl Tag Tag--info Tag--xs"
>
<div
className="TagWrapper-keYggn gnIgwl Tag Tag--info Tag--xs"
<AlertCircleOutlineIcon
size={10}
>
<AlertCircleOutlineIcon
size={10}
<svg
fill="currentColor"
height={10}
version="1.1"
viewBox="0 0 24 24"
width={10}
xmlns="http://www.w3.org/2000/svg"
>
<svg
fill="currentColor"
height={10}
version="1.1"
viewBox="0 0 24 24"
width={10}
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12,2C6.5,2,2,6.5,2,12s4.5,10,10,10s10-4.5,10-10S17.5,2,12,2 M12,20c-4.4,0-8-3.6-8-8s3.6-8,8-8s8,3.6,8,8S16.4,20,12,20z M12.501,13h-1l-0.5-6h2L12.501,13z M13,16c0,0.552-0.448,1-1,1s-1-0.448-1-1s0.448-1,1-1S13,15.448,13,16z"
/>
</svg>
</AlertCircleOutlineIcon>
<TagText>
<span
className="TagText-bWgUzx kzWPbz"
>
Important
</span>
</TagText>
</div>
</TagWrapper>
</Memo(Tag)>
</PriorityLabel>
</div>
</Priority>
<path
d="M12,2C6.5,2,2,6.5,2,12s4.5,10,10,10s10-4.5,10-10S17.5,2,12,2 M12,20c-4.4,0-8-3.6-8-8s3.6-8,8-8s8,3.6,8,8S16.4,20,12,20z M12.501,13h-1l-0.5-6h2L12.501,13z M13,16c0,0.552-0.448,1-1,1s-1-0.448-1-1s0.448-1,1-1S13,15.448,13,16z"
/>
</svg>
</AlertCircleOutlineIcon>
<TagText>
<span
className="TagText-bWgUzx kzWPbz"
>
Important
</span>
</TagText>
</div>
</TagWrapper>
</Memo(Tag)>
</PriorityLabel>
</div>
</Memo(PriorityLabels)>
</div>
<div
@@ -816,7 +811,7 @@ exports[`components/drafts/panel/panel_body should match snapshot for requested_
<span
className="profile-icon "
>
<Memo(Avatar)
<Avatar
size="md"
url="/api/v4/users/user_id/image?_=0"
username="username"
@@ -828,7 +823,7 @@ exports[`components/drafts/panel/panel_body should match snapshot for requested_
onError={[Function]}
src="/api/v4/users/user_id/image?_=0"
/>
</Memo(Avatar)>
</Avatar>
</span>
</button>
</RoundButton>
@@ -908,135 +903,39 @@ exports[`components/drafts/panel/panel_body should match snapshot for requested_
<Memo(PriorityLabels)
canRemove={false}
hasError={false}
padding="0 0 0 8px"
priority=""
requestedAck={true}
>
<Priority
padding="0 0 0 8px"
<div
className="priorityLabelsContainer"
>
<div
className="Priority-unHRQ dkJcdD"
className="priorityLabelsAcknowledgements"
>
<Acknowledgements
hasError={false}
<WithTooltip
title="Acknowledgement will be requested"
>
<div
className="Acknowledgements-kPkVCv dNydui"
>
<WithTooltip
id="post-priority-picker-ack-tooltip"
placement="top"
title="Acknowledgement will be requested"
>
<OverlayTrigger
defaultOverlayShown={false}
delay={400}
disabled={false}
overlay={<Unknown />}
placement="top"
trigger={
Array [
"hover",
"focus",
]
}
>
<OverlayTrigger
defaultOverlayShown={false}
delay={400}
overlay={
<OverlayWrapper
intl={
Object {
"$t": [Function],
"defaultFormats": Object {},
"defaultLocale": "en",
"defaultRichTextElements": undefined,
"fallbackOnEmptyString": true,
"formatDate": [Function],
"formatDateTimeRange": [Function],
"formatDateToParts": [Function],
"formatDisplayName": [Function],
"formatList": [Function],
"formatListToParts": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatNumberToParts": [Function],
"formatPlural": [Function],
"formatRelativeTime": [Function],
"formatTime": [Function],
"formatTimeToParts": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getDisplayNames": [Function],
"getListFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralRules": [Function],
"getRelativeTimeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"onError": [Function],
"onWarn": [Function],
"textComponent": "span",
"timeZone": "Etc/UTC",
"wrapRichTextChunksInFragment": undefined,
}
}
/>
}
placement="top"
trigger={
Array [
"hover",
"focus",
]
}
>
<CheckCircleOutlineIcon
onBlur={[Function]}
onClick={null}
onFocus={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
size={14}
>
<svg
fill="currentColor"
height={14}
onBlur={[Function]}
onClick={null}
onFocus={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
version="1.1"
viewBox="0 0 24 24"
width={14}
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12 2C6.5 2 2 6.5 2 12S6.5 22 12 22 22 17.5 22 12 17.5 2 12 2M12 20C7.59 20 4 16.41 4 12S7.59 4 12 4 20 7.59 20 12 16.41 20 12 20M16.59 7.58L10 14.17L7.41 11.59L6 13L10 17L18 9L16.59 7.58Z"
/>
</svg>
</CheckCircleOutlineIcon>
</OverlayTrigger>
</OverlayTrigger>
</WithTooltip>
<FormattedMessage
defaultMessage="Request acknowledgement"
id="post_priority.request_acknowledgement"
>
<span>
Request acknowledgement
</span>
</FormattedMessage>
</div>
</Acknowledgements>
<span
className="icon icon-check-circle-outline"
onBlur={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onMouseLeave={[Function]}
onMouseMove={[Function]}
onPointerDown={[Function]}
onPointerEnter={[Function]}
/>
</WithTooltip>
<FormattedMessage
defaultMessage="Request acknowledgement"
id="post_priority.request_acknowledgement"
>
<span>
Request acknowledgement
</span>
</FormattedMessage>
</div>
</Priority>
</div>
</Memo(PriorityLabels)>
</div>
<div

Просмотреть файл

@@ -138,8 +138,6 @@ exports[`components/drafts/panel/panel_header should show sync icon when draft i
className="PanelHeader__sync-icon"
>
<WithTooltip
id="drafts-sync-tooltip"
placement="top"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Updated from another device"

Просмотреть файл

@@ -4,6 +4,10 @@
&__right {
flex: 1;
.priorityLabelsContainer {
padding: 0 0 0 8px;
}
}
&.post:hover {

Просмотреть файл

@@ -81,7 +81,6 @@ function PanelBody({
{priority && (
<PriorityLabels
canRemove={false}
padding='0 0 0 8px'
hasError={false}
persistentNotifications={priority.persistent_notifications}
priority={priority.priority}

Просмотреть файл

@@ -62,8 +62,6 @@ function PanelHeader({
{remote && (
<div className='PanelHeader__sync-icon'>
<WithTooltip
id='drafts-sync-tooltip'
placement='top'
title={
<FormattedMessage
id='drafts.info.sync'

Просмотреть файл

@@ -50,8 +50,6 @@ export default function PlaceholderScheduledPostsTitle({type}: Props) {
return (
<WithTooltip
id='scheduled_posts__placeholder'
placement={'top'}
title={tooltipText}
>
<div>

Просмотреть файл

@@ -38,8 +38,6 @@ function EmojiPickerCategory({category, categoryRowIndex, selected, enable, onCl
return (
<WithTooltip
id={`emojiPickerCategoryTooltip-${category.name}`}
placement='bottom'
title={
<FormattedMessage {...category.label}/>
}

Просмотреть файл

@@ -173,8 +173,6 @@ export class EmojiPickerSkin extends React.PureComponent<Props, State> {
return (
<WithTooltip
id='emojiPickerSkinTooltip'
placement='top'
title={expandButtonLabel}
>
<button

Просмотреть файл

@@ -3,8 +3,6 @@
exports[`FileAttachment should match snapshot, after change from file to image 1`] = `
<WithTooltip
disabled={true}
id="fileAttachmentArchivedTooltip"
placement="top"
title={<ArchivedTooltip />}
>
<div
@@ -99,8 +97,6 @@ exports[`FileAttachment should match snapshot, after change from file to image 1
exports[`FileAttachment should match snapshot, regular file 1`] = `
<WithTooltip
disabled={true}
id="fileAttachmentArchivedTooltip"
placement="top"
title={<ArchivedTooltip />}
>
<div
@@ -195,8 +191,6 @@ exports[`FileAttachment should match snapshot, regular file 1`] = `
exports[`FileAttachment should match snapshot, regular image 1`] = `
<WithTooltip
disabled={true}
id="fileAttachmentArchivedTooltip"
placement="top"
title={<ArchivedTooltip />}
>
<div
@@ -274,8 +268,6 @@ exports[`FileAttachment should match snapshot, regular image 1`] = `
exports[`FileAttachment should match snapshot, small image 1`] = `
<WithTooltip
disabled={true}
id="fileAttachmentArchivedTooltip"
placement="top"
title={<ArchivedTooltip />}
>
<div
@@ -353,8 +345,6 @@ exports[`FileAttachment should match snapshot, small image 1`] = `
exports[`FileAttachment should match snapshot, svg image 1`] = `
<WithTooltip
disabled={true}
id="fileAttachmentArchivedTooltip"
placement="top"
title={<ArchivedTooltip />}
>
<div
@@ -449,8 +439,6 @@ exports[`FileAttachment should match snapshot, svg image 1`] = `
exports[`FileAttachment should match snapshot, when file is not loaded 1`] = `
<WithTooltip
disabled={true}
id="fileAttachmentArchivedTooltip"
placement="top"
title={<ArchivedTooltip />}
>
<div
@@ -528,8 +516,6 @@ exports[`FileAttachment should match snapshot, when file is not loaded 1`] = `
exports[`FileAttachment should match snapshot, with compact display 1`] = `
<WithTooltip
disabled={true}
id="fileAttachmentArchivedTooltip"
placement="top"
title={<ArchivedTooltip />}
>
<div
@@ -574,8 +560,6 @@ exports[`FileAttachment should match snapshot, with compact display 1`] = `
exports[`FileAttachment should match snapshot, without compact display and without can download 1`] = `
<WithTooltip
disabled={true}
id="fileAttachmentArchivedTooltip"
placement="top"
title={<ArchivedTooltip />}
>
<div

Просмотреть файл

@@ -2,8 +2,6 @@
exports[`components/file_attachment/FilenameOverlay should match snapshot, compact display 1`] = `
<WithTooltip
id="file-name__tooltip"
placement="top"
title="test_filename"
>
<a
@@ -33,9 +31,12 @@ exports[`components/file_attachment/FilenameOverlay should match snapshot, stand
className="post-image__name"
>
<WithTooltip
id="file-name__tooltip"
placement="top"
title="Download"
title={
Object {
"defaultMessage": "Download",
"id": "view_image_popover.download",
}
}
>
<ForwardRef
aria-label="download"
@@ -54,9 +55,12 @@ exports[`components/file_attachment/FilenameOverlay should match snapshot, with
className="post-image__name"
>
<WithTooltip
id="file-name__tooltip"
placement="top"
title="Download"
title={
Object {
"defaultMessage": "Download",
"id": "view_image_popover.download",
}
}
>
<ForwardRef
aria-label="download"

Просмотреть файл

@@ -220,9 +220,7 @@ export default function FileAttachment(props: Props) {
stopPropagationOnToggle={true}
>
<WithTooltip
id='file-name__tooltip'
title={formatMessage({id: 'file_search_result_item.more_actions', defaultMessage: 'More Actions'})}
placement='top'
>
<button
ref={buttonRef}
@@ -359,8 +357,6 @@ export default function FileAttachment(props: Props) {
return (
<WithTooltip
id='fileAttachmentArchivedTooltip'
placement='top'
title={<ArchivedTooltip/>}
disabled={!fileInfo.archived}
>

Просмотреть файл

@@ -2,6 +2,7 @@
// See LICENSE.txt for license information.
import React from 'react';
import {defineMessage} from 'react-intl';
import type {FileInfo} from '@mattermost/types/files';
@@ -65,9 +66,7 @@ export default class FilenameOverlay extends React.PureComponent<Props> {
if (compactDisplay) {
filenameOverlay = (
<WithTooltip
id='file-name__tooltip'
title={fileName}
placement='top'
>
<a
href='#'
@@ -84,9 +83,7 @@ export default class FilenameOverlay extends React.PureComponent<Props> {
filenameOverlay = (
<div className={iconClass || 'post-image__name'}>
<WithTooltip
id='file-name__tooltip'
title={localizeMessage({id: 'view_image_popover.download', defaultMessage: 'Download'})}
placement='top'
title={defineMessage({id: 'view_image_popover.download', defaultMessage: 'Download'})}
>
<ExternalLink
href={getFileDownloadUrl(fileInfo.id)}

Просмотреть файл

@@ -69,7 +69,6 @@ exports[`components/file_preview_modal/file_preview_modal_footer/FilePreviewModa
showOnlyClose={false}
showPublicLink={false}
totalFiles={3}
usedInside="Footer"
/>
</div>
`;
@@ -143,7 +142,6 @@ exports[`components/file_preview_modal/file_preview_modal_footer/FilePreviewModa
showOnlyClose={false}
showPublicLink={false}
totalFiles={3}
usedInside="Footer"
/>
</div>
`;

Просмотреть файл

@@ -37,7 +37,6 @@ const FilePreviewModalFooter: React.FC<Props> = ({post, ...actionProps}: Props)
<FilePreviewModalMainActions
{...actionProps}
showClose={false}
usedInside='Footer'
showOnlyClose={false}
/>
</div>

Просмотреть файл

@@ -48,7 +48,6 @@ exports[`components/file_preview_modal/file_preview_modal_header/FilePreviewModa
onGetPublicLink={[MockFunction]}
showOnlyClose={false}
showPublicLink={false}
usedInside="Header"
/>
</div>
`;
@@ -90,7 +89,6 @@ exports[`components/file_preview_modal/file_preview_modal_header/FilePreviewModa
onGetPublicLink={[MockFunction]}
showOnlyClose={true}
showPublicLink={false}
usedInside="Header"
/>
<Memo(FilePreviewModalMainNav)
fileIndex={1}

Просмотреть файл

@@ -48,7 +48,6 @@ const FilePreviewModalHeader: React.FC<Props> = ({post, totalFiles, fileIndex, .
<FilePreviewModalMainActions
{...actionProps}
showOnlyClose={actionProps.isMobileView}
usedInside='Header'
/>);
return (
<div className='file-preview-modal-header'>

Просмотреть файл

@@ -27,7 +27,6 @@ import './file_preview_modal_main_actions.scss';
const COPIED_TOOLTIP_DURATION = 2000;
interface Props {
usedInside?: 'Header' | 'Footer';
showOnlyClose?: boolean;
showClose?: boolean;
showPublicLink?: boolean;
@@ -44,7 +43,6 @@ interface Props {
const FilePreviewModalMainActions: React.FC<Props> = (props: Props) => {
const intl = useIntl();
const tooltipPlacement = props.usedInside === 'Header' ? 'bottom' : 'top';
const selectedFilePublicLink = useSelector((state: GlobalState) => selectFilePublicLink(state)?.link);
const dispatch = useDispatch();
const [publicLinkCopied, setPublicLinkCopied] = useState(false);
@@ -74,9 +72,7 @@ const FilePreviewModalMainActions: React.FC<Props> = (props: Props) => {
});
const closeButton = (
<WithTooltip
id='close-icon-tooltip'
title={closeMessage}
placement={tooltipPlacement}
key='publicLink'
>
<button
@@ -103,9 +99,7 @@ const FilePreviewModalMainActions: React.FC<Props> = (props: Props) => {
}
const publicLink = (
<WithTooltip
id='link-variant-icon-tooltip.text'
key='filePreviewPublicLink'
placement={tooltipPlacement}
title={publicTooltipMessage}
>
<a
@@ -125,9 +119,7 @@ const FilePreviewModalMainActions: React.FC<Props> = (props: Props) => {
});
const download = (
<WithTooltip
id='download-icon-tooltip.text'
key='download'
placement={tooltipPlacement}
title={downloadMessage}
>
<ExternalLink
@@ -146,7 +138,6 @@ const FilePreviewModalMainActions: React.FC<Props> = (props: Props) => {
<CopyButton
className='file-preview-modal-main-actions__action-item'
isForText={getFileType(props.fileInfo.extension) === FileTypes.TEXT}
placement={tooltipPlacement}
content={props.content}
/>
);
@@ -162,7 +153,6 @@ const FilePreviewModalMainActions: React.FC<Props> = (props: Props) => {
FilePreviewModalMainActions.defaultProps = {
showOnlyClose: false,
usedInside: 'Header',
showClose: true,
showPublicLink: true,
};

Просмотреть файл

@@ -5,9 +5,7 @@ exports[`components/file_preview_modal/file_preview_modal_main_nav/FilePreviewMo
className="file_preview_modal_main_nav"
>
<WithTooltip
id="close-icon-tooltip"
key="previewArrowLeft"
placement="bottom"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Close"
@@ -40,9 +38,7 @@ exports[`components/file_preview_modal/file_preview_modal_main_nav/FilePreviewMo
/>
</span>
<WithTooltip
id="close-icon-tooltip"
key="publicLink"
placement="bottom"
title={
<Memo(MemoizedFormattedMessage)
defaultMessage="Next"

Некоторые файлы не были показаны из-за слишком большого количества измененных файлов Показать больше