take buttons into account that are active over multiple phases when toggling
parent
02792132e1
commit
483b7fc14d
|
@ -23,6 +23,15 @@ import HeaderButton from './HeaderButton';
|
||||||
import HeaderButtons from './HeaderButtons';
|
import HeaderButtons from './HeaderButtons';
|
||||||
import RightPanel from '../../structures/RightPanel';
|
import RightPanel from '../../structures/RightPanel';
|
||||||
|
|
||||||
|
const GROUP_PHASES = [
|
||||||
|
RightPanel.Phase.GroupMemberInfo,
|
||||||
|
RightPanel.Phase.GroupMemberList,
|
||||||
|
];
|
||||||
|
const ROOM_PHASES = [
|
||||||
|
RightPanel.Phase.GroupRoomList,
|
||||||
|
RightPanel.Phase.GroupRoomInfo,
|
||||||
|
];
|
||||||
|
|
||||||
export default class GroupHeaderButtons extends HeaderButtons {
|
export default class GroupHeaderButtons extends HeaderButtons {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props, RightPanel.Phase.GroupMemberList);
|
super(props, RightPanel.Phase.GroupMemberList);
|
||||||
|
@ -53,33 +62,24 @@ export default class GroupHeaderButtons extends HeaderButtons {
|
||||||
}
|
}
|
||||||
|
|
||||||
_onMembersClicked() {
|
_onMembersClicked() {
|
||||||
this.togglePhase(RightPanel.Phase.GroupMemberList);
|
this.togglePhase(RightPanel.Phase.GroupMemberList, GROUP_PHASES);
|
||||||
}
|
}
|
||||||
|
|
||||||
_onRoomsClicked() {
|
_onRoomsClicked() {
|
||||||
this.togglePhase(RightPanel.Phase.GroupRoomList);
|
this.togglePhase(RightPanel.Phase.GroupRoomList, ROOM_PHASES);
|
||||||
}
|
}
|
||||||
|
|
||||||
renderButtons() {
|
renderButtons() {
|
||||||
const groupPhases = [
|
|
||||||
RightPanel.Phase.GroupMemberInfo,
|
|
||||||
RightPanel.Phase.GroupMemberList,
|
|
||||||
];
|
|
||||||
const roomPhases = [
|
|
||||||
RightPanel.Phase.GroupRoomList,
|
|
||||||
RightPanel.Phase.GroupRoomInfo,
|
|
||||||
];
|
|
||||||
|
|
||||||
return [
|
return [
|
||||||
<HeaderButton key="groupMembersButton" name="groupMembersButton"
|
<HeaderButton key="groupMembersButton" name="groupMembersButton"
|
||||||
title={_t('Members')}
|
title={_t('Members')}
|
||||||
isHighlighted={this.isPhase(groupPhases)}
|
isHighlighted={this.isPhase(GROUP_PHASES)}
|
||||||
onClick={this._onMembersClicked}
|
onClick={this._onMembersClicked}
|
||||||
analytics={['Right Panel', 'Group Member List Button', 'click']}
|
analytics={['Right Panel', 'Group Member List Button', 'click']}
|
||||||
/>,
|
/>,
|
||||||
<HeaderButton key="roomsButton" name="roomsButton"
|
<HeaderButton key="roomsButton" name="roomsButton"
|
||||||
title={_t('Rooms')}
|
title={_t('Rooms')}
|
||||||
isHighlighted={this.isPhase(roomPhases)}
|
isHighlighted={this.isPhase(ROOM_PHASES)}
|
||||||
onClick={this._onRoomsClicked}
|
onClick={this._onRoomsClicked}
|
||||||
analytics={['Right Panel', 'Group Room List Button', 'click']}
|
analytics={['Right Panel', 'Group Room List Button', 'click']}
|
||||||
/>,
|
/>,
|
||||||
|
|
|
@ -60,8 +60,8 @@ export default class HeaderButtons extends React.Component {
|
||||||
}, extras));
|
}, extras));
|
||||||
}
|
}
|
||||||
|
|
||||||
togglePhase(phase) {
|
togglePhase(phase, validPhases = [phase]) {
|
||||||
if (this.state.phase === phase) {
|
if (validPhases.includes(this.state.phase)) {
|
||||||
dis.dispatch({
|
dis.dispatch({
|
||||||
action: 'hide_right_panel',
|
action: 'hide_right_panel',
|
||||||
});
|
});
|
||||||
|
|
|
@ -23,6 +23,12 @@ import HeaderButton from './HeaderButton';
|
||||||
import HeaderButtons from './HeaderButtons';
|
import HeaderButtons from './HeaderButtons';
|
||||||
import RightPanel from '../../structures/RightPanel';
|
import RightPanel from '../../structures/RightPanel';
|
||||||
|
|
||||||
|
const MEMBER_PHASES = [
|
||||||
|
RightPanel.Phase.RoomMemberList,
|
||||||
|
RightPanel.Phase.RoomMemberInfo,
|
||||||
|
RightPanel.Phase.Room3pidMemberInfo,
|
||||||
|
];
|
||||||
|
|
||||||
export default class RoomHeaderButtons extends HeaderButtons {
|
export default class RoomHeaderButtons extends HeaderButtons {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props, RightPanel.Phase.RoomMemberList);
|
super(props, RightPanel.Phase.RoomMemberList);
|
||||||
|
@ -51,7 +57,7 @@ export default class RoomHeaderButtons extends HeaderButtons {
|
||||||
}
|
}
|
||||||
|
|
||||||
_onMembersClicked() {
|
_onMembersClicked() {
|
||||||
this.togglePhase(RightPanel.Phase.RoomMemberList);
|
this.togglePhase(RightPanel.Phase.RoomMemberList, MEMBER_PHASES);
|
||||||
}
|
}
|
||||||
|
|
||||||
_onFilesClicked() {
|
_onFilesClicked() {
|
||||||
|
@ -63,16 +69,10 @@ export default class RoomHeaderButtons extends HeaderButtons {
|
||||||
}
|
}
|
||||||
|
|
||||||
renderButtons() {
|
renderButtons() {
|
||||||
const membersPhases = [
|
|
||||||
RightPanel.Phase.RoomMemberList,
|
|
||||||
RightPanel.Phase.RoomMemberInfo,
|
|
||||||
RightPanel.Phase.Room3pidMemberInfo,
|
|
||||||
];
|
|
||||||
|
|
||||||
return [
|
return [
|
||||||
<HeaderButton key="membersButton" name="membersButton"
|
<HeaderButton key="membersButton" name="membersButton"
|
||||||
title={_t('Members')}
|
title={_t('Members')}
|
||||||
isHighlighted={this.isPhase(membersPhases)}
|
isHighlighted={this.isPhase(MEMBER_PHASES)}
|
||||||
onClick={this._onMembersClicked}
|
onClick={this._onMembersClicked}
|
||||||
analytics={['Right Panel', 'Member List Button', 'click']}
|
analytics={['Right Panel', 'Member List Button', 'click']}
|
||||||
/>,
|
/>,
|
||||||
|
|
Loading…
Reference in New Issue