{ _t('Addresses') }
-
- { _t('The main address for this room is') }: { canonical_alias_section }
-
+
+ {canonical_alias_section}
- {
+ e.stopPropagation();
+ e.preventDefault();
+
+ this.refs.avatarUpload.click();
+ };
+
+ _saveProfile = async (e) => {
+ e.stopPropagation();
+ e.preventDefault();
+
+ if (!this.state.enableProfileSave) return;
+ this.setState({enableProfileSave: false});
+
+ const client = MatrixClientPeg.get();
+ const newState = {};
+
+ // TODO: What do we do about errors?
+
+ if (this.state.originalDisplayName !== this.state.displayName) {
+ await client.setRoomName(this.props.roomId, this.state.displayName);
+ newState.originalDisplayName = this.state.displayName;
+ }
+
+ if (this.state.avatarFile) {
+ const uri = await client.uploadContent(this.state.avatarFile);
+ await client.sendStateEvent(this.props.roomId, 'm.room.avatar', {url: uri}, '');
+ newState.avatarUrl = client.mxcUrlToHttp(uri, 96, 96, 'crop', false);
+ newState.originalAvatarUrl = newState.avatarUrl;
+ newState.avatarFile = null;
+ }
+
+ if (this.state.originalTopic !== this.state.topic) {
+ await client.setRoomTopic(this.props.roomId, this.state.topic);
+ newState.originalTopic = this.state.topic;
+ }
+
+ newState.enableProfileSave = true;
+ this.setState(newState);
+ };
+
+ _onDisplayNameChanged = (e) => {
+ this.setState({
+ displayName: e.target.value,
+ enableProfileSave: true,
+ });
+ };
+
+ _onTopicChanged = (e) => {
+ this.setState({
+ topic: e.target.value,
+ enableProfileSave: true,
+ });
+ };
+
+ _onAvatarChanged = (e) => {
+ if (!e.target.files || !e.target.files.length) {
+ this.setState({
+ avatarUrl: this.state.originalAvatarUrl,
+ avatarFile: null,
+ enableProfileSave: false,
+ });
+ return;
+ }
+
+ const file = e.target.files[0];
+ const reader = new FileReader();
+ reader.onload = (ev) => {
+ this.setState({
+ avatarUrl: ev.target.result,
+ avatarFile: file,
+ enableProfileSave: true,
+ });
+ };
+ reader.readAsDataURL(file);
+ };
+
+ render() {
+ // TODO: Why is rendering a box with an overlay so complicated? Can the DOM be reduced?
+
+ let showOverlayAnyways = true;
+ let avatarElement = ;
+ if (this.state.avatarUrl) {
+ showOverlayAnyways = false;
+ avatarElement = 
;
+ }
+
+ const avatarOverlayClasses = classNames({
+ "mx_ProfileSettings_avatarOverlay": true,
+ "mx_ProfileSettings_avatarOverlay_show": showOverlayAnyways,
+ });
+ let avatarHoverElement = (
+
{ _t('Flair') }
+ {_t("Upload room avatar")}
+
+ );
+ if (!this.state.canSetAvatar) {
+ if (!showOverlayAnyways) {
+ avatarHoverElement = null;
+ } else {
+ const disabledOverlayClasses = classNames({
+ "mx_ProfileSettings_avatarOverlay": true,
+ "mx_ProfileSettings_avatarOverlay_show": true,
+ "mx_ProfileSettings_avatarOverlay_disabled": true,
+ });
+ avatarHoverElement = (
+
+
+
+
+ {_t("No room avatar")}
+
+ );
+ }
+ }
+
+ return (
+
+ );
+ }
+}
diff --git a/src/components/views/room_settings/UrlPreviewSettings.js b/src/components/views/room_settings/UrlPreviewSettings.js
index fe2a2bacf4..1662692164 100644
--- a/src/components/views/room_settings/UrlPreviewSettings.js
+++ b/src/components/views/room_settings/UrlPreviewSettings.js
@@ -1,7 +1,7 @@
/*
Copyright 2016 OpenMarket Ltd
Copyright 2017 Travis Ralston
-Copyright 2018 New Vector Ltd
+Copyright 2018-2019 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@@ -16,12 +16,13 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
-import {MatrixClient} from "matrix-js-sdk";
const React = require('react');
import PropTypes from 'prop-types';
const sdk = require("../../../index");
import { _t, _td } from '../../../languageHandler';
import SettingsStore, {SettingLevel} from "../../../settings/SettingsStore";
+import dis from "../../../dispatcher";
+import MatrixClientPeg from "../../../MatrixClientPeg";
module.exports = React.createClass({
@@ -31,21 +32,16 @@ module.exports = React.createClass({
room: PropTypes.object,
},
- contextTypes: {
- matrixClient: PropTypes.instanceOf(MatrixClient).isRequired,
- },
-
- saveSettings: function() {
- const promises = [];
- if (this.refs.urlPreviewsRoom) promises.push(this.refs.urlPreviewsRoom.save());
- if (this.refs.urlPreviewsSelf) promises.push(this.refs.urlPreviewsSelf.save());
- return promises;
+ _onClickUserSettings: (e) => {
+ e.preventDefault();
+ e.stopPropagation();
+ dis.dispatch({action: 'view_user_settings'});
},
render: function() {
const SettingsFlag = sdk.getComponent("elements.SettingsFlag");
const roomId = this.props.room.roomId;
- const isEncrypted = this.context.matrixClient.isRoomEncrypted(roomId);
+ const isEncrypted = MatrixClientPeg.get().isRoomEncrypted(roomId);
let previewsForAccount = null;
let previewsForRoom = null;
@@ -56,13 +52,13 @@ module.exports = React.createClass({
if (accountEnabled) {
previewsForAccount = (
_t("You have enabled URL previews by default.", {}, {
- 'a': (sub)=>{ sub },
+ 'a': (sub)=>{ sub },
})
);
} else if (accountEnabled) {
previewsForAccount = (
_t("You have disabled URL previews by default.", {}, {
- 'a': (sub)=>{ sub },
+ 'a': (sub)=>{ sub },
})
);
}
@@ -73,9 +69,7 @@ module.exports = React.createClass({
-
{ _t("URL Previews") }
-
+
+
{ _t('When someone puts a URL in their message, a URL preview can be shown to give more ' +
'information about that link such as the title, description, and an image from the website.') }
-
+
+
{ previewsForAccount }
{ previewsForRoom }
diff --git a/src/components/views/settings/tabs/GeneralRoomSettingsTab.js b/src/components/views/settings/tabs/GeneralRoomSettingsTab.js
new file mode 100644
index 0000000000..2f7ef725b7
--- /dev/null
+++ b/src/components/views/settings/tabs/GeneralRoomSettingsTab.js
@@ -0,0 +1,118 @@
+/*
+Copyright 2019 New Vector Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import {_t} from "../../../../languageHandler";
+import RoomProfileSettings from "../../room_settings/RoomProfileSettings";
+import MatrixClientPeg from "../../../../MatrixClientPeg";
+import sdk from "../../../../index";
+import AccessibleButton from "../../elements/AccessibleButton";
+import {MatrixClient} from "matrix-js-sdk";
+import dis from "../../../../dispatcher";
+
+export default class GeneralRoomSettingsTab extends React.Component {
+ static childContextTypes = {
+ matrixClient: PropTypes.instanceOf(MatrixClient),
+ };
+
+ static propTypes = {
+ roomId: PropTypes.string.isRequired,
+ };
+
+ getChildContext() {
+ return {
+ matrixClient: MatrixClientPeg.get(),
+ };
+ }
+
+ _saveAliases = (e) => {
+ // TODO: Live modification?
+ if (!this.refs.aliasSettings) return;
+ this.refs.aliasSettings.saveSettings();
+ };
+
+ _saveGroups = (e) => {
+ // TODO: Live modification?
+ if (!this.refs.flairSettings) return;
+ this.refs.flairSettings.saveSettings();
+ };
+
+ _onLeaveClick = () => {
+ dis.dispatch({
+ action: 'leave_room',
+ room_id: this.props.roomId,
+ });
+ };
+
+ render() {
+ const AliasSettings = sdk.getComponent("room_settings.AliasSettings");
+ const RelatedGroupSettings = sdk.getComponent("room_settings.RelatedGroupSettings");
+ const UrlPreviewSettings = sdk.getComponent("room_settings.UrlPreviewSettings");
+
+ const client = MatrixClientPeg.get();
+ const room = client.getRoom(this.props.roomId);
+
+ const canSetAliases = true; // Previously, we arbitrarily only allowed admins to do this
+ const canSetCanonical = room.currentState.mayClientSendStateEvent("m.room.canonical_alias", client);
+ const canonicalAliasEv = room.currentState.getStateEvents("m.room.canonical_alias", '');
+ const aliasEvents = room.currentState.getStateEvents("m.room.aliases");
+
+ const canChangeGroups = room.currentState.mayClientSendStateEvent("m.room.related_groups", client);
+ const groupsEvent = room.currentState.getStateEvents("m.room.related_groups", "");
+
+ return (
+
+
+ );
+ }
+}
diff --git a/src/components/views/settings/tabs/GeneralSettingsTab.js b/src/components/views/settings/tabs/GeneralUserSettingsTab.js
similarity index 86%
rename from src/components/views/settings/tabs/GeneralSettingsTab.js
rename to src/components/views/settings/tabs/GeneralUserSettingsTab.js
index c3ad55cc7b..a504953cab 100644
--- a/src/components/views/settings/tabs/GeneralSettingsTab.js
+++ b/src/components/views/settings/tabs/GeneralUserSettingsTab.js
@@ -16,6 +16,11 @@ limitations under the License.
import React from 'react';
import {_t} from "../../../../languageHandler";
+import MatrixClientPeg from "../../../../MatrixClientPeg";
+import GroupUserSettings from "../../groups/GroupUserSettings";
+import PropTypes from "prop-types";
+import {MatrixClient} from "matrix-js-sdk";
+import { DragDropContext } from 'react-beautiful-dnd';
import ProfileSettings from "../ProfileSettings";
import EmailAddresses from "../EmailAddresses";
import PhoneNumbers from "../PhoneNumbers";
@@ -31,7 +36,11 @@ const sdk = require('../../../../index');
const Modal = require("../../../../Modal");
const dis = require("../../../../dispatcher");
-export default class GeneralSettingsTab extends React.Component {
+export default class GeneralUserSettingsTab extends React.Component {
+ static childContextTypes = {
+ matrixClient: PropTypes.instanceOf(MatrixClient),
+ };
+
constructor() {
super();
@@ -41,6 +50,12 @@ export default class GeneralSettingsTab extends React.Component {
};
}
+ getChildContext() {
+ return {
+ matrixClient: MatrixClientPeg.get(),
+ };
+ }
+
_onLanguageChange = (newLanguage) => {
if (this.state.language === newLanguage) return;
@@ -95,6 +110,11 @@ export default class GeneralSettingsTab extends React.Component {
{_t("General")}
+
+
+
+ {_t("Room Addresses")}
+
+
+ {_t("Save")}
+
+
+
+ {_t("Flair")}
+
+
+ {_t("Save")}
+
+
+
+ {_t("URL Previews")}
+
+
+
+ {_t("Leave room")}
+
+
+ { _t('Leave room') }
+
+
+
{_t("Profile")}
+
);
}
@@ -103,7 +123,7 @@ export default class GeneralSettingsTab extends React.Component {
const ChangePassword = sdk.getComponent("views.settings.ChangePassword");
const passwordChangeForm = (
{_t("Account")}
{_t("Set a new account password...")} @@ -132,7 +152,7 @@ export default class GeneralSettingsTab extends React.Component { return (
{_t("Language and region")}
-
);
@@ -142,7 +162,7 @@ export default class GeneralSettingsTab extends React.Component {
// TODO: Re-enable theme selection once the themes actually work
const SettingsFlag = sdk.getComponent("views.elements.SettingsFlag");
return (
-
+
{_t("Theme")}
diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json
index 4d67c33dad..4ae95f7559 100644
--- a/src/i18n/strings/en_EN.json
+++ b/src/i18n/strings/en_EN.json
@@ -267,8 +267,8 @@
"Increase performance by only loading room members on first view": "Increase performance by only loading room members on first view",
"Backup of encryption keys to server": "Backup of encryption keys to server",
"Render simple counters in room header": "Render simple counters in room header",
- "Enable Emoji suggestions while typing": "Enable Emoji suggestions while typing",
"Two-way device verification using short text": "Two-way device verification using short text",
+ "Enable Emoji suggestions while typing": "Enable Emoji suggestions while typing",
"Use compact timeline layout": "Use compact timeline layout",
"Show a placeholder for removed messages": "Show a placeholder for removed messages",
"Show join/leave messages (invites/kicks/bans unaffected)": "Show join/leave messages (invites/kicks/bans unaffected)",
@@ -430,11 +430,14 @@
"Upload profile picture": "Upload profile picture",
"Display Name": "Display Name",
"Save": "Save",
+ "General": "General",
+ "Room Addresses": "Room Addresses",
+ "Flair": "Flair",
+ "URL Previews": "URL Previews",
"Failed to change password. Is your password correct?": "Failed to change password. Is your password correct?",
"Success": "Success",
"Your password was successfully changed. You will not receive push notifications on other devices until you log back in to them": "Your password was successfully changed. You will not receive push notifications on other devices until you log back in to them",
"Profile": "Profile",
- "Flair": "Flair",
"Account": "Account",
"Set a new account password...": "Set a new account password...",
"Email addresses": "Email addresses",
@@ -448,7 +451,6 @@
"Account management": "Account management",
"Deactivating your account is a permanent action - be careful!": "Deactivating your account is a permanent action - be careful!",
"Close Account": "Close Account",
- "General": "General",
"Legal": "Legal",
"For help with using Riot, click here.": "For help with using Riot, click here.",
"For help with using Riot, click here or start a chat with our bot using the button below.": "For help with using Riot, click here or start a chat with our bot using the button below.",
@@ -760,11 +762,10 @@
"'%(alias)s' is not a valid format for an alias": "'%(alias)s' is not a valid format for an alias",
"Invalid address format": "Invalid address format",
"'%(alias)s' is not a valid format for an address": "'%(alias)s' is not a valid format for an address",
+ "Main address": "Main address",
"not specified": "not specified",
"not set": "not set",
"Remote addresses for this room:": "Remote addresses for this room:",
- "Addresses": "Addresses",
- "The main address for this room is": "The main address for this room is",
"Local addresses for this room:": "Local addresses for this room:",
"This room has no local addresses": "This room has no local addresses",
"New address (e.g. #foo:%(localDomain)s)": "New address (e.g. #foo:%(localDomain)s)",
@@ -773,12 +774,16 @@
"Showing flair for these communities:": "Showing flair for these communities:",
"This room is not showing flair for any communities": "This room is not showing flair for any communities",
"New community ID (e.g. +foo:%(localDomain)s)": "New community ID (e.g. +foo:%(localDomain)s)",
+ "Room avatar": "Room avatar",
+ "Upload room avatar": "Upload room avatar",
+ "No room avatar": "No room avatar",
+ "Room Name": "Room Name",
+ "Room Topic": "Room Topic",
"You have enabled URL previews by default.": "You have enabled URL previews by default.",
"You have disabled URL previews by default.": "You have disabled URL previews by default.",
"URL previews are enabled by default for participants in this room.": "URL previews are enabled by default for participants in this room.",
"URL previews are disabled by default for participants in this room.": "URL previews are disabled by default for participants in this room.",
"In encrypted rooms, like this one, URL previews are disabled by default to ensure that your homeserver (where the previews are generated) cannot gather information about links you see in this room.": "In encrypted rooms, like this one, URL previews are disabled by default to ensure that your homeserver (where the previews are generated) cannot gather information about links you see in this room.",
- "URL Previews": "URL Previews",
"When someone puts a URL in their message, a URL preview can be shown to give more information about that link such as the title, description, and an image from the website.": "When someone puts a URL in their message, a URL preview can be shown to give more information about that link such as the title, description, and an image from the website.",
"Members": "Members",
"Files": "Files",
diff --git a/src/stores/RoomViewStore.js b/src/stores/RoomViewStore.js
index 036a7c04fc..ba78e7687f 100644
--- a/src/stores/RoomViewStore.js
+++ b/src/stores/RoomViewStore.js
@@ -122,7 +122,9 @@ class RoomViewStore extends Store {
case 'open_room_settings':
if (SettingsStore.isFeatureEnabled("feature_tabbed_settings")) {
const RoomSettingsDialog = sdk.getComponent("dialogs.RoomSettingsDialog");
- Modal.createTrackedDialog('Room settings', '', RoomSettingsDialog, {}, 'mx_SettingsDialog');
+ Modal.createTrackedDialog('Room settings', '', RoomSettingsDialog, {
+ roomId: this._state.roomId,
+ }, 'mx_SettingsDialog');
} else {
this._setState({
isEditingSettings: true,
diff --git a/test/components/views/rooms/RoomSettings-test.js b/test/components/views/rooms/RoomSettings-test.js
index 3bccdcf825..dd91e812bc 100644
--- a/test/components/views/rooms/RoomSettings-test.js
+++ b/test/components/views/rooms/RoomSettings-test.js
@@ -1,191 +1,192 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import expect from 'expect';
-import jest from 'jest-mock';
-import Promise from 'bluebird';
-import * as testUtils from '../../../test-utils';
-import sdk from 'matrix-react-sdk';
-const WrappedRoomSettings = testUtils.wrapInMatrixClientContext(sdk.getComponent('views.rooms.RoomSettings'));
-import MatrixClientPeg from '../../../../src/MatrixClientPeg';
-import SettingsStore from '../../../../src/settings/SettingsStore';
-
-
-describe('RoomSettings', () => {
- let parentDiv = null;
- let sandbox = null;
- let client = null;
- let roomSettings = null;
- const room = testUtils.mkStubRoom('!DdJkzRliezrwpNebLk:matrix.org');
-
- function expectSentStateEvent(roomId, eventType, expectedEventContent) {
- let found = false;
- for (const call of client.sendStateEvent.mock.calls) {
- const [
- actualRoomId,
- actualEventType,
- actualEventContent,
- ] = call.slice(0, 3);
-
- if (roomId === actualRoomId && actualEventType === eventType) {
- expect(actualEventContent).toEqual(expectedEventContent);
- found = true;
- break;
- }
- }
- expect(found).toBe(true);
- }
-
- beforeEach(function(done) {
- testUtils.beforeEach(this);
- sandbox = testUtils.stubClient();
- client = MatrixClientPeg.get();
- client.credentials = {userId: '@me:domain.com'};
-
- client.setRoomName = jest.fn().mockReturnValue(Promise.resolve());
- client.setRoomTopic = jest.fn().mockReturnValue(Promise.resolve());
- client.setRoomDirectoryVisibility = jest.fn().mockReturnValue(Promise.resolve());
-
- // Covers any room state event (e.g. name, avatar, topic)
- client.sendStateEvent = jest.fn().mockReturnValue(Promise.resolve());
-
- // Covers room tagging
- client.setRoomTag = jest.fn().mockReturnValue(Promise.resolve());
- client.deleteRoomTag = jest.fn().mockReturnValue(Promise.resolve());
-
- // Covers any setting in the SettingsStore
- // (including local client settings not stored via matrix)
- SettingsStore.setValue = jest.fn().mockReturnValue(Promise.resolve());
-
- parentDiv = document.createElement('div');
- document.body.appendChild(parentDiv);
-
- const gatherWrappedRef = (r) => {roomSettings = r;};
-
- // get use wrappedRef because we're using wrapInMatrixClientContext
- ReactDOM.render(
-