mirrors/mostlymatter
1
0
Форкнуть 0
Код Задачи Запросы на слияние Действия Пакеты Проекты Релизы Вики Активность

[MM-60216] Migrate tooltips of admin_consoles "admin_settings", "schema_admin_settings" & "permission_description" to WithTooltip (#28003)

Просмотр исходного кода
Этот коммит содержится в:
M-ZubairAhmed
2024-08-22 13:58:12 +00:00
коммит произвёл GitHub
родитель 5a07d9cb72
Коммит ad5d5f08dc
18 изменённых файлов: 895 добавлений и 1024 удалений
Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

76
webapp/channels/src/components/admin_console/__snapshots__/bleve_settings.test.tsx.snap
Просмотреть файл

@@ -215,29 +215,27 @@ exports[`components/BleveSettings should match snapshot, disabled 1`] = `
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -458,29 +456,27 @@ exports[`components/BleveSettings should match snapshot, enabled 1`] = `
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>

152
webapp/channels/src/components/admin_console/__snapshots__/cluster_settings.test.tsx.snap
Просмотреть файл

@@ -234,29 +234,27 @@ exports[`components/ClusterSettings should match snapshot, compression disabled
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -496,29 +494,27 @@ exports[`components/ClusterSettings should match snapshot, compression enabled 1
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -758,29 +754,27 @@ exports[`components/ClusterSettings should match snapshot, encryption disabled 1
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -1020,29 +1014,27 @@ exports[`components/ClusterSettings should match snapshot, encryption enabled 1`
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>

38
webapp/channels/src/components/admin_console/__snapshots__/database_settings.test.tsx.snap
Просмотреть файл

@@ -430,29 +430,27 @@ exports[`components/DatabaseSettings should match snapshot 1`] = `
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>

76
webapp/channels/src/components/admin_console/__snapshots__/elasticsearch_settings.test.tsx.snap
Просмотреть файл

@@ -538,29 +538,27 @@ exports[`components/ElasticSearchSettings should match snapshot, disabled 1`] =
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -1103,29 +1101,27 @@ exports[`components/ElasticSearchSettings should match snapshot, enabled 1`] = `
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>

152
webapp/channels/src/components/admin_console/__snapshots__/message_export_settings.test.tsx.snap
Просмотреть файл

@@ -144,29 +144,27 @@ exports[`components/MessageExportSettings should match snapshot, disabled, actia
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -430,29 +428,27 @@ exports[`components/MessageExportSettings should match snapshot, disabled, globa
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -602,29 +598,27 @@ exports[`components/MessageExportSettings should match snapshot, enabled, actian
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -888,29 +882,27 @@ exports[`components/MessageExportSettings should match snapshot, enabled, global
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>

76
webapp/channels/src/components/admin_console/__snapshots__/push_settings.test.tsx.snap
Просмотреть файл

@@ -164,29 +164,27 @@ exports[`components/PushSettings should match snapshot, licensed 1`] = `
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -300,29 +298,27 @@ exports[`components/PushSettings should match snapshot, unlicensed 1`] = `
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>

45
webapp/channels/src/components/admin_console/__snapshots__/schema_admin_settings.test.tsx.snap
Просмотреть файл

@@ -710,34 +710,27 @@ exports[`components/admin_console/SchemaAdminSettings should match snapshot with
saving={false}
savingMessage="Saving Config..."
/>
<div
className="error-message"
data-testid="errorMessage"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error=""
errors={Array []}
iconClassName="fa-exclamation-triangle"
textClassName="has-warning"
/>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
data-testid="errorMessage"
>
<FormError
error=""
errors={Array []}
iconClassName="fa-exclamation-triangle"
textClassName="has-warning"
/>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
`;

53
webapp/channels/src/components/admin_console/admin_settings.tsx
Просмотреть файл

@@ -2,17 +2,15 @@
// See LICENSE.txt for license information.
import React from 'react';
import {Overlay} from 'react-bootstrap';
import {FormattedMessage} from 'react-intl';
import type {AdminConfig, EnvironmentConfig} from '@mattermost/types/config';
import type {DeepPartial} from '@mattermost/types/utilities';
import FormError from 'components/form_error';
import SaveButton from 'components/save_button';
import Tooltip from 'components/tooltip';
import AdminHeader from 'components/widgets/admin_console/admin_header';
import {localizeMessage} from 'utils/utils';
import WithTooltip from 'components/with_tooltip';
export type BaseProps = {
config?: DeepPartial<AdminConfig>;
@@ -27,7 +25,6 @@ export type BaseState = {
saving: boolean;
serverError: string|null;
serverErrorId?: string;
errorTooltip: boolean;
}
// Placeholder type until ClientError is exported from redux.
@@ -38,21 +35,18 @@ type ClientErrorPlaceholder = {
}
export default abstract class AdminSettings <Props extends BaseProps, State extends BaseState> extends React.Component<Props, State> {
private errorMessageRef: React.RefObject<HTMLDivElement>;
public constructor(props: Props) {
super(props);
const stateInit = {
saveNeeded: false,
saving: false,
serverError: null,
errorTooltip: false,
};
if (props.config) {
this.state = Object.assign(this.getStateFromConfig(props.config), stateInit) as Readonly<State>;
} else {
this.state = stateInit as Readonly<State>;
}
this.errorMessageRef = React.createRef();
}
protected abstract getStateFromConfig(config: DeepPartial<AdminConfig>): Partial<State>;
@@ -67,18 +61,6 @@ export default abstract class AdminSettings <Props extends BaseProps, State exte
protected canSave?: () => boolean;
private closeTooltip = () => {
this.setState({errorTooltip: false});
};
private openTooltip = (e: React.MouseEvent) => {
const elm: HTMLElement|null = e.currentTarget.querySelector('.control-label');
if (elm) {
const isElipsis = elm.offsetWidth < elm.scrollWidth;
this.setState({errorTooltip: isElipsis});
}
};
protected handleChange = (id: string, value: unknown) => {
this.setState((prevState) => ({
...prevState,
@@ -249,25 +231,24 @@ export default abstract class AdminSettings <Props extends BaseProps, State exte
saving={this.state.saving}
disabled={this.props.isDisabled || !this.state.saveNeeded || (this.canSave && !this.canSave())}
onClick={this.handleSubmit}
savingMessage={localizeMessage('admin.saving', 'Saving Config...')}
savingMessage={
<FormattedMessage
id='admin.saving'
defaultMessage='Saving Config...'
/>
}
/>
<div
className='error-message'
ref={this.errorMessageRef}
onMouseOver={this.openTooltip}
onMouseOut={this.closeTooltip}
>
<FormError error={this.state.serverError}/>
</div>
<Overlay
show={this.state.errorTooltip}
<WithTooltip
id='error-tooltip'
placement='top'
target={this.errorMessageRef.current as HTMLElement}
title={this.state?.serverError ?? ''}
>
<Tooltip id='error-tooltip' >
{this.state.serverError}
</Tooltip>
</Overlay>
<div
className='error-message'
>
<FormError error={this.state.serverError}/>
</div>
</WithTooltip>
</div>
</div>
</form>

135
webapp/channels/src/components/admin_console/custom_plugin_settings/__snapshots__/custom_plugin_settings.test.tsx.snap
Просмотреть файл

@@ -191,34 +191,27 @@ exports[`components/admin_console/CustomPluginSettings should match snapshot wit
saving={false}
savingMessage="Saving Config..."
/>
<div
className="error-message"
data-testid="errorMessage"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error=""
errors={Array []}
iconClassName="fa-exclamation-triangle"
textClassName="has-warning"
/>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
data-testid="errorMessage"
>
<FormError
error=""
errors={Array []}
iconClassName="fa-exclamation-triangle"
textClassName="has-warning"
/>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
`;
@@ -252,34 +245,27 @@ exports[`components/admin_console/CustomPluginSettings should match snapshot wit
saving={false}
savingMessage="Saving Config..."
/>
<div
className="error-message"
data-testid="errorMessage"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error=""
errors={Array []}
iconClassName="fa-exclamation-triangle"
textClassName="has-warning"
/>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
data-testid="errorMessage"
>
<FormError
error=""
errors={Array []}
iconClassName="fa-exclamation-triangle"
textClassName="has-warning"
/>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
`;
@@ -475,34 +461,27 @@ exports[`components/admin_console/CustomPluginSettings should match snapshot wit
saving={false}
savingMessage="Saving Config..."
/>
<div
className="error-message"
data-testid="errorMessage"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error=""
errors={Array []}
iconClassName="fa-exclamation-triangle"
textClassName="has-warning"
/>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
data-testid="errorMessage"
>
<FormError
error=""
errors={Array []}
iconClassName="fa-exclamation-triangle"
textClassName="has-warning"
/>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
`;

152
webapp/channels/src/components/admin_console/custom_terms_of_service_settings/__snapshots__/custom_terms_of_service_settings.test.tsx.snap
Просмотреть файл

@@ -23,29 +23,27 @@ exports[`components/admin_console/CustomTermsOfServiceSettings should match snap
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -74,29 +72,27 @@ exports[`components/admin_console/CustomTermsOfServiceSettings should match snap
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -125,29 +121,27 @@ exports[`components/admin_console/CustomTermsOfServiceSettings should match snap
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -176,29 +170,27 @@ exports[`components/admin_console/CustomTermsOfServiceSettings should match snap
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>

1
webapp/channels/src/components/admin_console/message_export_settings.tsx
Просмотреть файл

@@ -110,7 +110,6 @@ export class MessageExportSettings extends AdminSettings<BaseProps & WrappedComp
saveNeeded: false,
saving: false,
serverError: null,
errorTooltip: false,
};
if (config.MessageExportSettings.GlobalRelaySettings) {
state.globalRelayCustomerType = config.MessageExportSettings.GlobalRelaySettings.CustomerType;

226
webapp/channels/src/components/admin_console/permission_schemes_settings/__snapshots__/permission_description.test.tsx.snap
Просмотреть файл

@@ -23,52 +23,130 @@ exports[`components/admin_console/permission_schemes_settings/permission_descrip
}
selectRow={[MockFunction]}
>
<span
className="permission-description"
onClick={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<span
className="inherit-link-wrapper"
>
<FormattedMessage
defaultMessage="Inherited from <link>{name}</link>."
id="admin.permissions.inherited_from"
values={
Object {
"link": [Function],
"name": "All Members",
<WithTooltip
disabled={false}
id="defaultID"
placement="top"
title={
<span
className="inherit-link-wrapper"
>
<Memo(MemoizedFormattedMessage)
defaultMessage="Inherited from <link>{name}</link>."
id="admin.permissions.inherited_from"
values={
Object {
"link": [Function],
"name": "All Members",
}
}
/>
</span>
}
>
<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",
]
}
>
<span>
Inherited from
<a
key=".$.1"
<span
className="permission-description"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<span
className="inherit-link-wrapper"
>
All Members
</a>
.
<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"
>
All Members
</a>
.
</span>
</FormattedMessage>
</span>
</span>
</FormattedMessage>
</span>
<Overlay
animation={[Function]}
placement="top"
rootClose={false}
show={false}
target={null}
>
<Overlay
placement="top"
rootClose={false}
show={false}
target={null}
transition={[Function]}
/>
</Overlay>
</span>
</OverlayTrigger>
</OverlayTrigger>
</WithTooltip>
</PermissionDescription>
</Provider>
`;
@@ -119,49 +197,39 @@ 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`] = `
<span
className="permission-description"
onClick={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
<WithTooltip
disabled={false}
id="defaultID"
placement="top"
title={
<span>
This is a clickable description
</span>
}
>
<span>
This is a clickable description
</span>
<Overlay
animation={[Function]}
placement="top"
rootClose={false}
show={false}
target={null}
<span
className="permission-description"
onClick={[Function]}
>
<Tooltip>
<span>
This is a clickable description
</span>
</Tooltip>
</Overlay>
</span>
<span>
This is a clickable description
</span>
</span>
</WithTooltip>
`;
exports[`components/admin_console/permission_schemes_settings/permission_description should match snapshot with default Props 1`] = `
<span
className="permission-description"
onClick={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
<WithTooltip
disabled={false}
id="defaultID"
placement="top"
title="This is the description"
>
This is the description
<Overlay
animation={[Function]}
placement="top"
rootClose={false}
show={false}
target={null}
<span
className="permission-description"
onClick={[Function]}
>
<Tooltip>
This is the description
</Tooltip>
</Overlay>
</span>
This is the description
</span>
</WithTooltip>
`;

66
webapp/channels/src/components/admin_console/permission_schemes_settings/permission_description.tsx
Просмотреть файл

@@ -1,14 +1,13 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React, {useState, useRef} from 'react';
import React from 'react';
import type {MouseEvent} from 'react';
import {Overlay} from 'react-bootstrap';
import {FormattedMessage, useIntl} from 'react-intl';
import type {Role} from '@mattermost/types/roles';
import Tooltip from 'components/tooltip';
import WithTooltip from 'components/with_tooltip';
import type {AdditionalValues} from './permissions_tree/types';
import {rolesRolesStrings} from './strings/roles';
@@ -28,17 +27,7 @@ const PermissionDescription = ({
additionalValues,
inherited,
}: Props): JSX.Element => {
const [open, setOpen] = useState(false);
const contentRef = useRef<HTMLSpanElement>(null);
const intl = useIntl();
const closeTooltip = () => setOpen(false);
const openTooltip = (e: MouseEvent) => {
const elm = e.currentTarget.querySelector('span');
const isElipsis = elm ? elm.offsetWidth < elm.scrollWidth : false;
setOpen(isElipsis);
};
const {formatMessage} = useIntl();
const parentPermissionClicked = (e: MouseEvent) => {
const parent = (e.target as HTMLSpanElement).parentElement;
@@ -53,7 +42,7 @@ const PermissionDescription = ({
let content: string | JSX.Element = '';
if (inherited && inherited.name) {
const formattedName = intl.formatMessage(rolesRolesStrings[inherited.name]);
const formattedName = formatMessage(rolesRolesStrings[inherited.name]);
content = (
<span className='inherit-link-wrapper'>
<FormattedMessage
@@ -71,34 +60,27 @@ const PermissionDescription = ({
} else {
content = description;
}
let tooltip: JSX.Element | null = (
<Overlay
show={open}
placement='top'
target={(contentRef.current as HTMLSpanElement)}
>
<Tooltip>
{content}
</Tooltip>
</Overlay>
);
if (!inherited && additionalValues) {
tooltip = null;
}
content = (
<span
className='permission-description'
onClick={parentPermissionClicked}
ref={contentRef}
onMouseOver={openTooltip}
onMouseOut={closeTooltip}
>
{content}
{tooltip}
</span>
);
return content;
let showTooltip = true;
if (!inherited && additionalValues) {
showTooltip = false;
}
return (
<WithTooltip
id={id}
placement='top'
title={content}
disabled={!showTooltip}
>
<span
className='permission-description'
onClick={parentPermissionClicked}
>
{content}
</span>
</WithTooltip>
);
};
export default PermissionDescription;

570
webapp/channels/src/components/admin_console/plugin_management/__snapshots__/plugin_management.test.tsx.snap
Просмотреть файл

@@ -312,29 +312,27 @@ exports[`components/PluginManagement should match snapshot 1`] = `
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -652,29 +650,27 @@ exports[`components/PluginManagement should match snapshot when \`Enable Marketp
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -740,29 +736,27 @@ exports[`components/PluginManagement should match snapshot when \`Enable Plugins
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -1080,29 +1074,27 @@ exports[`components/PluginManagement should match snapshot when \`Enable Remote
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -1422,29 +1414,27 @@ exports[`components/PluginManagement should match snapshot when \`Require Signat
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -1766,29 +1756,27 @@ exports[`components/PluginManagement should match snapshot, No installed plugins
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -2106,29 +2094,27 @@ exports[`components/PluginManagement should match snapshot, allow insecure URL e
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -2423,29 +2409,27 @@ exports[`components/PluginManagement should match snapshot, disabled 1`] = `
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -2763,29 +2747,27 @@ exports[`components/PluginManagement should match snapshot, text entered into th
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -3110,29 +3092,27 @@ exports[`components/PluginManagement should match snapshot, upload disabled 1`]
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -3513,29 +3493,27 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -3884,29 +3862,27 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -4255,29 +4231,27 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -4626,29 +4600,27 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>
@@ -5029,29 +5001,27 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
disabled={true}
onClick={[Function]}
saving={false}
savingMessage="Saving Config..."
savingMessage={
<Memo(MemoizedFormattedMessage)
defaultMessage="Saving Config..."
id="admin.saving"
/>
}
/>
<div
className="error-message"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<FormError
error={null}
errors={Array []}
/>
</div>
<Overlay
animation={[Function]}
<WithTooltip
id="error-tooltip"
placement="top"
rootClose={false}
show={false}
target={null}
title=""
>
<Tooltip
id="error-tooltip"
/>
</Overlay>
<div
className="error-message"
>
<FormError
error={null}
errors={Array []}
/>
</div>
</WithTooltip>
</div>
</div>
</form>

59
webapp/channels/src/components/admin_console/schema_admin_settings.tsx
Просмотреть файл

@@ -2,7 +2,6 @@
// See LICENSE.txt for license information.
import React from 'react';
import {Overlay} from 'react-bootstrap';
import {FormattedMessage, injectIntl} from 'react-intl';
import type {IntlShape, MessageDescriptor, WrappedComponentProps} from 'react-intl';
import {Link} from 'react-router-dom';
@@ -31,9 +30,9 @@ import UserAutocompleteSetting from 'components/admin_console/user_autocomplete_
import FormError from 'components/form_error';
import Markdown from 'components/markdown';
import SaveButton from 'components/save_button';
import Tooltip from 'components/tooltip';
import AdminHeader from 'components/widgets/admin_console/admin_header';
import WarningIcon from 'components/widgets/icons/fa_warning_icon';
import WithTooltip from 'components/with_tooltip';
import * as I18n from 'i18n/i18n.jsx';
import Constants from 'utils/constants';
@@ -67,7 +66,6 @@ type State = {
saveNeeded: false | 'both' | 'permissions' | 'config';
saving: boolean;
serverError: null;
errorTooltip: boolean;
customComponentWrapperClass: string;
confirmNeededId: string;
showConfirmId: string;
@@ -99,7 +97,6 @@ export class SchemaAdminSettings extends React.PureComponent<Props, State> {
private isPlugin: boolean;
private saveActions: Array<() => Promise<{error?: {message?: string}}>>;
private buildSettingFunctions: {[x: string]: (setting: any) => JSX.Element};
private errorMessageRef: React.RefObject<HTMLDivElement>;
constructor(props: Props) {
super(props);
@@ -130,13 +127,11 @@ export class SchemaAdminSettings extends React.PureComponent<Props, State> {
saveNeeded: false,
saving: false,
serverError: null,
errorTooltip: false,
customComponentWrapperClass: '',
confirmNeededId: '',
showConfirmId: '',
clientWarning: '',
};
this.errorMessageRef = React.createRef();
}
static getDerivedStateFromProps(props: Props, state: State) {
@@ -146,7 +141,6 @@ export class SchemaAdminSettings extends React.PureComponent<Props, State> {
saveNeeded: false,
saving: false,
serverError: null,
errorTooltip: false,
...SchemaAdminSettings.getStateFromConfig(props.config, props.schema, props.roles),
};
}
@@ -1155,19 +1149,6 @@ export class SchemaAdminSettings extends React.PureComponent<Props, State> {
return null;
};
closeTooltip = () => {
this.setState({errorTooltip: false});
};
openTooltip = (e: React.MouseEvent<HTMLDivElement>) => {
const elm = e.currentTarget.querySelector<HTMLLabelElement>('.control-label');
if (!elm) {
return;
}
const isElipsis = elm.offsetWidth < elm.scrollWidth;
this.setState({errorTooltip: isElipsis});
};
doSubmit = async (getStateFromConfig: (config: Partial<AdminConfig>, schema: AdminDefinitionSubSectionSchema, roles?: Record<string, Role>) => Partial<State>) => {
if (!this.props.schema) {
return;
@@ -1368,30 +1349,24 @@ export class SchemaAdminSettings extends React.PureComponent<Props, State> {
onClick={this.handleSubmit}
savingMessage={this.props.intl.formatMessage({id: 'admin.saving', defaultMessage: 'Saving Config...'})}
/>
<div
className='error-message'
data-testid='errorMessage'
ref={this.errorMessageRef}
onMouseOver={this.openTooltip}
onMouseOut={this.closeTooltip}
>
<FormError
iconClassName='fa-exclamation-triangle'
textClassName='has-warning'
error={this.state.clientWarning}
/>
<FormError error={this.state.serverError}/>
</div>
<Overlay
show={this.state.errorTooltip}
<WithTooltip
id='error-tooltip'
placement='top'
target={this.errorMessageRef.current!}
title={this.state?.serverError ?? ''}
>
<Tooltip id='error-tooltip' >
{this.state.serverError}
</Tooltip>
</Overlay>
<div
className='error-message'
data-testid='errorMessage'
>
<FormError
iconClassName='fa-exclamation-triangle'
textClassName='has-warning'
error={this.state.clientWarning}
/>
<FormError error={this.state.serverError}/>
</div>
</WithTooltip>
</div>
</div>
);

1
webapp/channels/src/sass/components/_permissions.scss
Просмотреть файл

@@ -172,6 +172,7 @@
display: flex;
overflow: hidden;
width: 100%;
width: fit-content;
height: 100%;
align-items: center;
opacity: 0.75;

27
webapp/channels/src/utils/position_utils.test.tsx
Просмотреть файл

@@ -1,7 +1,7 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import {popOverOverlayPosition, approxGroupPopOverHeight} from 'utils/position_utils';
import {popOverOverlayPosition} from 'utils/position_utils';
test('Should return placement position for overlay based on bounds, space required and innerHeight', () => {
const targetBounds = {
@@ -14,28 +14,3 @@ test('Should return placement position for overlay based on bounds, space requir
expect(popOverOverlayPosition(targetBounds as DOMRect, 1000, 450)).toEqual('bottom');
expect(popOverOverlayPosition(targetBounds as DOMRect, 1000, 600)).toEqual('left');
});
test('Should return the correct height for the group list overlay bounded by viewport height or max list height', () => {
// constants. should not need to change
const viewportScaleFactor = 0.4;
const headerHeight = 130;
const maxListHeight = 800;
// array of [listHeight, viewPortHeight, expected]
// tests for cases when
// group list fits
// group list is too tall for viewport
// group list reaches max list height
const testCases = [[100, 1000, 230], [500, 500, 330], [800, 2000, maxListHeight]];
for (const [listHeight, viewPortHeight, expected] of testCases) {
expect(
approxGroupPopOverHeight(
listHeight,
viewPortHeight,
viewportScaleFactor,
headerHeight,
maxListHeight,
)).toBe(expected);
}
});

14
webapp/channels/src/utils/position_utils.tsx
Просмотреть файл

@@ -22,17 +22,3 @@ export function popOverOverlayPosition(
}
return placement;
}
export function approxGroupPopOverHeight(
groupListHeight: number,
viewPortHeight: number,
viewportScaleFactor: number,
headerHeight: number,
maxListHeight: number,
): number {
return Math.min(
(viewPortHeight * viewportScaleFactor) + headerHeight,
groupListHeight + headerHeight,
maxListHeight,
);
}