diff options
Diffstat (limited to 'web/react/components')
-rw-r--r-- | web/react/components/admin_console/user_item.jsx | 90 | ||||
-rw-r--r-- | web/react/components/center_panel.jsx | 4 | ||||
-rw-r--r-- | web/react/components/channel_invite_modal.jsx | 21 | ||||
-rw-r--r-- | web/react/components/channel_members_modal.jsx | 35 | ||||
-rw-r--r-- | web/react/components/create_post.jsx | 4 | ||||
-rw-r--r-- | web/react/components/member_list.jsx | 2 | ||||
-rw-r--r-- | web/react/components/member_list_team_item.jsx | 70 | ||||
-rw-r--r-- | web/react/components/sidebar.jsx | 2 | ||||
-rw-r--r-- | web/react/components/sidebar_header.jsx | 2 | ||||
-rw-r--r-- | web/react/components/team_members.jsx | 10 | ||||
-rw-r--r-- | web/react/components/user_settings/import_theme_modal.jsx | 6 | ||||
-rw-r--r-- | web/react/components/user_settings/user_settings_display.jsx | 6 |
12 files changed, 147 insertions, 105 deletions
diff --git a/web/react/components/admin_console/user_item.jsx b/web/react/components/admin_console/user_item.jsx index f7e92672d..2badaf0e5 100644 --- a/web/react/components/admin_console/user_item.jsx +++ b/web/react/components/admin_console/user_item.jsx @@ -212,50 +212,52 @@ export default class UserItem extends React.Component { } return ( - <div className='row member-div'> - <img - className='post-profile-img pull-left' - src={`/api/v1/users/${user.id}/image?time=${user.update_at}&${Utils.getSessionIndex()}`} - height='36' - width='36' - /> - <span className='member-name'>{Utils.getDisplayName(user)}</span> - <span className='member-email'>{email}</span> - <div className='dropdown member-drop'> - <a - href='#' - className='dropdown-toggle theme' - type='button' - id='channel_header_dropdown' - data-toggle='dropdown' - aria-expanded='true' - > - <span>{currentRoles} </span> - <span className='caret'></span> - </a> - <ul - className='dropdown-menu member-menu' - role='menu' - aria-labelledby='channel_header_dropdown' - > - {makeAdmin} - {makeMember} - {makeActive} - {makeNotActive} - {makeSystemAdmin} - <li role='presentation'> - <a - role='menuitem' - href='#' - onClick={this.handleResetPassword} - > - {'Reset Password'} - </a> - </li> - </ul> - </div> - {serverError} - </div> + <tr> + <td className='row member-div'> + <img + className='post-profile-img pull-left' + src={`/api/v1/users/${user.id}/image?time=${user.update_at}&${Utils.getSessionIndex()}`} + height='36' + width='36' + /> + <span className='member-name'>{Utils.getDisplayName(user)}</span> + <span className='member-email'>{email}</span> + <div className='dropdown member-drop'> + <a + href='#' + className='dropdown-toggle theme' + type='button' + id='channel_header_dropdown' + data-toggle='dropdown' + aria-expanded='true' + > + <span>{currentRoles} </span> + <span className='caret'></span> + </a> + <ul + className='dropdown-menu member-menu' + role='menu' + aria-labelledby='channel_header_dropdown' + > + {makeAdmin} + {makeMember} + {makeActive} + {makeNotActive} + {makeSystemAdmin} + <li role='presentation'> + <a + role='menuitem' + href='#' + onClick={this.handleResetPassword} + > + {'Reset Password'} + </a> + </li> + </ul> + </div> + {serverError} + </td> + </tr> ); } } diff --git a/web/react/components/center_panel.jsx b/web/react/components/center_panel.jsx index ea0eec747..3ee40bb86 100644 --- a/web/react/components/center_panel.jsx +++ b/web/react/components/center_panel.jsx @@ -21,7 +21,7 @@ export default class CenterPanel extends React.Component { this.onPreferenceChange = this.onPreferenceChange.bind(this); - const tutorialPref = PreferenceStore.getPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), {value: '0'}); + const tutorialPref = PreferenceStore.getPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), {value: '999'}); this.state = {showTutorialScreens: parseInt(tutorialPref.value, 10) === TutorialSteps.INTRO_SCREENS}; } componentDidMount() { @@ -31,7 +31,7 @@ export default class CenterPanel extends React.Component { PreferenceStore.removeChangeListener(this.onPreferenceChange); } onPreferenceChange() { - const tutorialPref = PreferenceStore.getPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), {value: '0'}); + const tutorialPref = PreferenceStore.getPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), {value: '999'}); this.setState({showTutorialScreens: parseInt(tutorialPref.value, 10) <= TutorialSteps.INTRO_SCREENS}); } render() { diff --git a/web/react/components/channel_invite_modal.jsx b/web/react/components/channel_invite_modal.jsx index 2dc12c9aa..7c1032321 100644 --- a/web/react/components/channel_invite_modal.jsx +++ b/web/react/components/channel_invite_modal.jsx @@ -54,6 +54,16 @@ export default class ChannelInviteModal extends React.Component { loading }; } + onShow() { + if ($(window).width() > 768) { + $(ReactDOM.findDOMNode(this.refs.modalBody)).perfectScrollbar(); + } + } + componentDidUpdate(prevProps) { + if (this.props.show && !prevProps.show) { + this.onShow(); + } + } componentWillReceiveProps(nextProps) { if (!this.props.show && nextProps.show) { ChannelStore.addExtraInfoChangeListener(this.onListenerChange); @@ -103,6 +113,11 @@ export default class ChannelInviteModal extends React.Component { ); } render() { + var maxHeight = 1000; + if (Utils.windowHeight() <= 1200) { + maxHeight = Utils.windowHeight() - 300; + } + var inviteError = null; if (this.state.inviteError) { inviteError = (<label className='has-error control-label'>{this.state.inviteError}</label>); @@ -129,13 +144,17 @@ export default class ChannelInviteModal extends React.Component { return ( <Modal + dialogClassName='more-modal' show={this.props.show} onHide={this.props.onModalDismissed} > <Modal.Header closeButton={true}> <Modal.Title>{'Add New Members to '}<span className='name'>{this.state.channelName}</span></Modal.Title> </Modal.Header> - <Modal.Body> + <Modal.Body + ref='modalBody' + style={{maxHeight}} + > {inviteError} {content} </Modal.Body> diff --git a/web/react/components/channel_members_modal.jsx b/web/react/components/channel_members_modal.jsx index 1df0da9cf..2fa7ae8ff 100644 --- a/web/react/components/channel_members_modal.jsx +++ b/web/react/components/channel_members_modal.jsx @@ -70,6 +70,16 @@ export default class ChannelMembersModal extends React.Component { channelName }; } + onShow() { + if ($(window).width() > 768) { + $(ReactDOM.findDOMNode(this.refs.modalBody)).perfectScrollbar(); + } + } + componentDidUpdate(prevProps) { + if (this.props.show && !prevProps.show) { + this.onShow(); + } + } componentWillReceiveProps(nextProps) { if (!this.props.show && nextProps.show) { ChannelStore.addExtraInfoChangeListener(this.onChange); @@ -128,6 +138,11 @@ export default class ChannelMembersModal extends React.Component { ); } render() { + var maxHeight = 1000; + if (Utils.windowHeight() <= 1200) { + maxHeight = Utils.windowHeight() - 300; + } + const currentMember = ChannelStore.getCurrentMember(); let isAdmin = false; if (currentMember) { @@ -137,6 +152,7 @@ export default class ChannelMembersModal extends React.Component { return ( <div> <Modal + dialogClassName='more-modal' show={this.props.show} onHide={this.props.onModalDismissed} > @@ -153,15 +169,16 @@ export default class ChannelMembersModal extends React.Component { <i className='glyphicon glyphicon-envelope'/>{' Add New Members'} </a> </Modal.Header> - <Modal.Body> - <div className='col-sm-12'> - <div className='team-member-list'> - <MemberList - memberList={this.state.memberList} - isAdmin={isAdmin} - handleRemove={this.handleRemove} - /> - </div> + <Modal.Body + ref='modalBody' + style={{maxHeight}} + > + <div className='team-member-list'> + <MemberList + memberList={this.state.memberList} + isAdmin={isAdmin} + handleRemove={this.handleRemove} + /> </div> </Modal.Body> <Modal.Footer> diff --git a/web/react/components/create_post.jsx b/web/react/components/create_post.jsx index 4d1874e18..5a69c9bfb 100644 --- a/web/react/components/create_post.jsx +++ b/web/react/components/create_post.jsx @@ -50,7 +50,7 @@ export default class CreatePost extends React.Component { PostStore.clearDraftUploads(); const draft = this.getCurrentDraft(); - const tutorialPref = PreferenceStore.getPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), {value: '0'}); + const tutorialPref = PreferenceStore.getPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), {value: '999'}); this.state = { channelId: ChannelStore.getCurrentId(), @@ -336,7 +336,7 @@ export default class CreatePost extends React.Component { } } onPreferenceChange() { - const tutorialPref = PreferenceStore.getPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), {value: '0'}); + const tutorialPref = PreferenceStore.getPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), {value: '999'}); this.setState({ showTutorialTip: parseInt(tutorialPref.value, 10) === TutorialSteps.POST_POPOVER, ctrlSend: PreferenceStore.getPreference(Constants.Preferences.CATEGORY_ADVANCED_SETTINGS, 'send_on_ctrl_enter', {value: 'false'}).value diff --git a/web/react/components/member_list.jsx b/web/react/components/member_list.jsx index 9c0243291..0238c7920 100644 --- a/web/react/components/member_list.jsx +++ b/web/react/components/member_list.jsx @@ -15,7 +15,7 @@ export default class MemberList extends React.Component { members = this.props.memberList; } - var message = ''; + var message = null; if (members.length === 0) { message = <tr><td>No users to add.</td></tr>; } diff --git a/web/react/components/member_list_team_item.jsx b/web/react/components/member_list_team_item.jsx index 14db05cdb..1fa369068 100644 --- a/web/react/components/member_list_team_item.jsx +++ b/web/react/components/member_list_team_item.jsx @@ -166,40 +166,42 @@ export default class MemberListTeamItem extends React.Component { } return ( - <div className='row member-div'> - <img - className='post-profile-img pull-left' - src={`/api/v1/users/${user.id}/image?time=${timestamp}&${Utils.getSessionIndex()}`} - height='36' - width='36' - /> - <span className='member-name'>{Utils.getDisplayName(user)}</span> - <span className='member-email'>{email}</span> - <div className='dropdown member-drop'> - <a - href='#' - className='dropdown-toggle theme' - type='button' - id='channel_header_dropdown' - data-toggle='dropdown' - aria-expanded='true' - > - <span>{currentRoles} </span> - <span className='caret'></span> - </a> - <ul - className='dropdown-menu member-menu' - role='menu' - aria-labelledby='channel_header_dropdown' - > - {makeAdmin} - {makeMember} - {makeActive} - {makeNotActive} - </ul> - </div> - {serverError} - </div> + <tr> + <td className='row member-div'> + <img + className='post-profile-img pull-left' + src={`/api/v1/users/${user.id}/image?time=${timestamp}&${Utils.getSessionIndex()}`} + height='36' + width='36' + /> + <span className='member-name'>{Utils.getDisplayName(user)}</span> + <span className='member-email'>{email}</span> + <div className='dropdown member-drop'> + <a + href='#' + className='dropdown-toggle theme' + type='button' + id='channel_header_dropdown' + data-toggle='dropdown' + aria-expanded='true' + > + <span>{currentRoles} </span> + <span className='caret'></span> + </a> + <ul + className='dropdown-menu member-menu' + role='menu' + aria-labelledby='channel_header_dropdown' + > + {makeAdmin} + {makeMember} + {makeActive} + {makeNotActive} + </ul> + </div> + {serverError} + </td> + </tr> ); } } diff --git a/web/react/components/sidebar.jsx b/web/react/components/sidebar.jsx index 8b5f7a381..f5ce5c10e 100644 --- a/web/react/components/sidebar.jsx +++ b/web/react/components/sidebar.jsx @@ -146,7 +146,7 @@ export default class Sidebar extends React.Component { visibleDirectChannels.sort(this.sortChannelsByDisplayName); - const tutorialPref = PreferenceStore.getPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), {value: '0'}); + const tutorialPref = PreferenceStore.getPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), {value: '999'}); return { activeId: currentChannelId, diff --git a/web/react/components/sidebar_header.jsx b/web/react/components/sidebar_header.jsx index 46730e1e6..bc7f6ba50 100644 --- a/web/react/components/sidebar_header.jsx +++ b/web/react/components/sidebar_header.jsx @@ -31,7 +31,7 @@ export default class SidebarHeader extends React.Component { PreferenceStore.removeChangeListener(this.onPreferenceChange); } getStateFromStores() { - const tutorialPref = PreferenceStore.getPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), {value: '0'}); + const tutorialPref = PreferenceStore.getPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), {value: '999'}); return {showTutorialTip: parseInt(tutorialPref.value, 10) === TutorialSteps.MENU_POPOVER}; } diff --git a/web/react/components/team_members.jsx b/web/react/components/team_members.jsx index 33590c89a..ac1ebf52d 100644 --- a/web/react/components/team_members.jsx +++ b/web/react/components/team_members.jsx @@ -79,7 +79,7 @@ export default class TeamMembers extends React.Component { return ( <div - className='modal fade' + className='modal fade more-modal' ref='modal' id='team_members' tabIndex='-1' @@ -106,12 +106,10 @@ export default class TeamMembers extends React.Component { ref='modalBody' className='modal-body' > - <div className='channel-settings'> - <div className='team-member-list'> - {renderMembers} - </div> - {serverError} + <div className='team-member-list'> + {renderMembers} </div> + {serverError} </div> <div className='modal-footer'> <button diff --git a/web/react/components/user_settings/import_theme_modal.jsx b/web/react/components/user_settings/import_theme_modal.jsx index 24da106d0..4d594bb1b 100644 --- a/web/react/components/user_settings/import_theme_modal.jsx +++ b/web/react/components/user_settings/import_theme_modal.jsx @@ -50,7 +50,7 @@ export default class ImportThemeModal extends React.Component { theme.sidebarText = colors[5]; theme.sidebarUnreadText = colors[5]; theme.sidebarTextHoverBg = colors[4]; - theme.sidebarTextActiveBg = colors[2]; + theme.sidebarTextActiveBorder = colors[2]; theme.sidebarTextActiveColor = colors[3]; theme.sidebarHeaderBg = colors[1]; theme.sidebarHeaderTextColor = colors[5]; @@ -59,9 +59,13 @@ export default class ImportThemeModal extends React.Component { theme.mentionColor = '#ffffff'; theme.centerChannelBg = '#ffffff'; theme.centerChannelColor = '#333333'; + theme.newMessageSeparator = '#F80'; theme.linkColor = '#2389d7'; theme.buttonBg = '#26a970'; theme.buttonColor = '#ffffff'; + theme.mentionHighlightBg = '#fff2bb'; + theme.mentionHighlightLink = '#2f81b7'; + theme.codeTheme = 'github'; let user = UserStore.getCurrentUser(); user.theme_props = theme; diff --git a/web/react/components/user_settings/user_settings_display.jsx b/web/react/components/user_settings/user_settings_display.jsx index 3c12ead23..43c8d33d1 100644 --- a/web/react/components/user_settings/user_settings_display.jsx +++ b/web/react/components/user_settings/user_settings_display.jsx @@ -172,13 +172,13 @@ export default class UserSettingsDisplay extends React.Component { </label> <br/> </div> - <div><br/>{'How should other users be shown in Direct Messages list?'}</div> + <div><br/>{'Set what name to display in the Direct Messages list.'}</div> </div> ]; nameFormatSection = ( <SettingItemMax - title='Show real names, nick names or usernames?' + title='Teammate Name Display' inputs={inputs} submit={this.handleSubmit} server_error={serverError} @@ -200,7 +200,7 @@ export default class UserSettingsDisplay extends React.Component { nameFormatSection = ( <SettingItemMin - title='Show real names, nick names or usernames?' + title='Teammate Name Display' describe={describe} updateSection={() => { this.props.updateSection('name_format'); |