summaryrefslogtreecommitdiffstats
path: root/web/react/components
diff options
context:
space:
mode:
Diffstat (limited to 'web/react/components')
-rw-r--r--web/react/components/admin_console/user_item.jsx90
-rw-r--r--web/react/components/center_panel.jsx4
-rw-r--r--web/react/components/channel_invite_modal.jsx21
-rw-r--r--web/react/components/channel_members_modal.jsx35
-rw-r--r--web/react/components/create_post.jsx4
-rw-r--r--web/react/components/member_list.jsx2
-rw-r--r--web/react/components/member_list_team_item.jsx70
-rw-r--r--web/react/components/sidebar.jsx2
-rw-r--r--web/react/components/sidebar_header.jsx2
-rw-r--r--web/react/components/team_members.jsx10
-rw-r--r--web/react/components/user_settings/import_theme_modal.jsx6
-rw-r--r--web/react/components/user_settings/user_settings_display.jsx6
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');
generated by cgit v1.2.3-1-g7c22 (git 2.25.1) at 2024-10-30 20:28:46 +0000