From 94b26342b804f0deece8cbfae0e580eb4b54a393 Mon Sep 17 00:00:00 2001 From: Dudu Popkhadze <48488310+dudupopkhadze@users.noreply.github.com> Date: Thu, 8 Oct 2020 00:35:55 +0400 Subject: [PATCH] migrate user_list_row_with_error to ts (#6624) * migrate user_list_row_with_error to ts * minor fixes Co-authored-by: Mattermod --- .../{index.js => index.ts} | 13 +++- ...error.jsx => user_list_row_with_error.tsx} | 72 +++++++++++-------- 2 files changed, 53 insertions(+), 32 deletions(-) rename components/user_list_row_with_error/{index.js => index.ts} (54%) rename components/user_list_row_with_error/{user_list_row_with_error.jsx => user_list_row_with_error.tsx} (73%) diff --git a/components/user_list_row_with_error/index.js b/components/user_list_row_with_error/index.ts similarity index 54% rename from components/user_list_row_with_error/index.js rename to components/user_list_row_with_error/index.ts index 99efcd41cc76..9ff22d71c39c 100644 --- a/components/user_list_row_with_error/index.js +++ b/components/user_list_row_with_error/index.ts @@ -3,11 +3,18 @@ import {connect} from 'react-redux'; import {getStatusForUserId} from 'mattermost-redux/selectors/entities/users'; +import {UserProfile} from 'mattermost-redux/types/users'; -import UserListRow from './user_list_row_with_error.jsx'; +import {GlobalState} from 'types/store'; -function mapStateToProps(state, ownProps) { - const user = ownProps.user || {}; +import UserListRow from './user_list_row_with_error'; + +type OwnProps = { + user: UserProfile; +}; + +function mapStateToProps(state: GlobalState, ownProps: OwnProps) { + const user = ownProps.user; return { status: getStatusForUserId(state, user.id), }; diff --git a/components/user_list_row_with_error/user_list_row_with_error.jsx b/components/user_list_row_with_error/user_list_row_with_error.tsx similarity index 73% rename from components/user_list_row_with_error/user_list_row_with_error.jsx rename to components/user_list_row_with_error/user_list_row_with_error.tsx index 92bb4d3c4764..1f7e51cc77bb 100644 --- a/components/user_list_row_with_error/user_list_row_with_error.jsx +++ b/components/user_list_row_with_error/user_list_row_with_error.tsx @@ -1,50 +1,66 @@ // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. -import PropTypes from 'prop-types'; import React from 'react'; import {Link} from 'react-router-dom'; import {Client4} from 'mattermost-redux/client'; +import {UserProfile} from 'mattermost-redux/types/users'; +import {Channel, ChannelMembership} from 'mattermost-redux/types/channels'; +import {ConnectedComponent} from 'react-redux'; +import {ServerError} from 'mattermost-redux/types/errors'; + import * as Utils from 'utils/utils.jsx'; import ProfilePicture from 'components/profile_picture'; import BotBadge from 'components/widgets/badges/bot_badge'; import FormattedMarkdownMessage from 'components/formatted_markdown_message.jsx'; -export default class UserListRowWithError extends React.PureComponent { - static propTypes = { - user: PropTypes.object.isRequired, - status: PropTypes.string, - extraInfo: PropTypes.array, - actions: PropTypes.arrayOf(PropTypes.func), - actionProps: PropTypes.object, - actionUserProps: PropTypes.object, - index: PropTypes.number, - totalUsers: PropTypes.number, - userCount: PropTypes.number, - isDisabled: PropTypes.bool, +type Props = { + user: UserProfile; + status?: string; + extraInfo?: (string | JSX.Element)[]; + actions?: ConnectedComponent[]; + actionProps?: { + mfaEnabled: boolean; + enableUserAccessTokens: boolean; + experimentalEnableAuthenticationTransfer: boolean; + doPasswordReset: (user: UserProfile) => void; + doEmailReset: (user: UserProfile) => void; + doManageTeams: (user: UserProfile) => void; + doManageRoles: (user: UserProfile) => void; + doManageTokens: (user: UserProfile) => void; + isDisabled?: boolean; }; - - static defaultProps = { - extraInfo: [], - actions: [], - actionProps: {}, - actionUserProps: {}, + actionUserProps?: { + [userId: string]: { + channel: Channel; + teamMember: any; + channelMember: ChannelMembership; + }; }; + index?: number; + userCount?: number; + totalUsers?: number; + isDisabled?: boolean; +} +type State = { + error?: ServerError; +} - constructor(props) { +export default class UserListRowWithError extends React.PureComponent { + constructor(props: Props) { super(props); this.state = {}; } - onError = (errorObj) => { + onError = (errorObj: ServerError) => { this.setState({ error: errorObj, }); } - render() { + render(): JSX.Element { let buttons = null; if (this.props.actions) { buttons = this.props.actions.map((Action, index) => { @@ -63,7 +79,7 @@ export default class UserListRowWithError extends React.PureComponent { } // QUICK HACK, NEEDS A PROP FOR TOGGLING STATUS - let email = this.props.user.email; + let email: React.ReactNode = this.props.user.email; let emailStyle = 'more-modal__description'; let status; if (this.props.user.is_bot) { @@ -79,8 +95,6 @@ export default class UserListRowWithError extends React.PureComponent { /> ); emailStyle = ''; - } else if (this.props.user.status) { - status = this.props.user.status; } else { status = this.props.status; } @@ -91,7 +105,7 @@ export default class UserListRowWithError extends React.PureComponent { let userCountID = null; let userCountEmail = null; - if (this.props.userCount >= 0) { + if (this.props.userCount && this.props.userCount >= 0) { userCountID = Utils.createSafeId('userListRowName' + this.props.userCount); userCountEmail = Utils.createSafeId('userListRowEmail' + this.props.userCount); } @@ -113,14 +127,14 @@ export default class UserListRowWithError extends React.PureComponent { >
@@ -132,7 +146,7 @@ export default class UserListRowWithError extends React.PureComponent { />
{email}