Add option to select role on roomCreation
Signed-off-by: Ajay Bura <ajbura@gmail.com>
This commit is contained in:
parent
f53f54af7f
commit
e25dc46863
3 changed files with 34 additions and 2 deletions
|
@ -5,6 +5,7 @@ import './CreateRoom.scss';
|
||||||
import initMatrix from '../../../client/initMatrix';
|
import initMatrix from '../../../client/initMatrix';
|
||||||
import { isRoomAliasAvailable } from '../../../util/matrixUtil';
|
import { isRoomAliasAvailable } from '../../../util/matrixUtil';
|
||||||
import * as roomActions from '../../../client/action/room';
|
import * as roomActions from '../../../client/action/room';
|
||||||
|
import { selectRoom } from '../../../client/action/navigation';
|
||||||
|
|
||||||
import Text from '../../atoms/text/Text';
|
import Text from '../../atoms/text/Text';
|
||||||
import Button from '../../atoms/button/Button';
|
import Button from '../../atoms/button/Button';
|
||||||
|
@ -12,6 +13,7 @@ import Toggle from '../../atoms/button/Toggle';
|
||||||
import IconButton from '../../atoms/button/IconButton';
|
import IconButton from '../../atoms/button/IconButton';
|
||||||
import Input from '../../atoms/input/Input';
|
import Input from '../../atoms/input/Input';
|
||||||
import Spinner from '../../atoms/spinner/Spinner';
|
import Spinner from '../../atoms/spinner/Spinner';
|
||||||
|
import SegmentControl from '../../atoms/segmented-controls/SegmentedControls';
|
||||||
import PopupWindow from '../../molecules/popup-window/PopupWindow';
|
import PopupWindow from '../../molecules/popup-window/PopupWindow';
|
||||||
import SettingTile from '../../molecules/setting-tile/SettingTile';
|
import SettingTile from '../../molecules/setting-tile/SettingTile';
|
||||||
|
|
||||||
|
@ -28,6 +30,7 @@ function CreateRoom({ isOpen, onRequestClose }) {
|
||||||
const [titleValue, updateTitleValue] = useState(undefined);
|
const [titleValue, updateTitleValue] = useState(undefined);
|
||||||
const [topicValue, updateTopicValue] = useState(undefined);
|
const [topicValue, updateTopicValue] = useState(undefined);
|
||||||
const [addressValue, updateAddressValue] = useState(undefined);
|
const [addressValue, updateAddressValue] = useState(undefined);
|
||||||
|
const [roleIndex, setRoleIndex] = useState(0);
|
||||||
|
|
||||||
const addressRef = useRef(null);
|
const addressRef = useRef(null);
|
||||||
const topicRef = useRef(null);
|
const topicRef = useRef(null);
|
||||||
|
@ -45,6 +48,7 @@ function CreateRoom({ isOpen, onRequestClose }) {
|
||||||
updateTitleValue(undefined);
|
updateTitleValue(undefined);
|
||||||
updateTopicValue(undefined);
|
updateTopicValue(undefined);
|
||||||
updateAddressValue(undefined);
|
updateAddressValue(undefined);
|
||||||
|
setRoleIndex(0);
|
||||||
}
|
}
|
||||||
|
|
||||||
async function createRoom() {
|
async function createRoom() {
|
||||||
|
@ -60,12 +64,15 @@ function CreateRoom({ isOpen, onRequestClose }) {
|
||||||
if (roomAlias.trim() === '') roomAlias = undefined;
|
if (roomAlias.trim() === '') roomAlias = undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const powerLevel = roleIndex === 1 ? 101 : undefined;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await roomActions.create({
|
const result = await roomActions.create({
|
||||||
name, topic, isPublic, roomAlias, isEncrypted,
|
name, topic, isPublic, roomAlias, isEncrypted, powerLevel,
|
||||||
});
|
});
|
||||||
|
|
||||||
resetForm();
|
resetForm();
|
||||||
|
selectRoom(result.room_id);
|
||||||
onRequestClose();
|
onRequestClose();
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
if (e.message === 'M_UNKNOWN: Invalid characters in room alias') {
|
if (e.message === 'M_UNKNOWN: Invalid characters in room alias') {
|
||||||
|
@ -139,6 +146,19 @@ function CreateRoom({ isOpen, onRequestClose }) {
|
||||||
content={<Text variant="b3">You can’t disable this later. Bridges & most bots won’t work yet.</Text>}
|
content={<Text variant="b3">You can’t disable this later. Bridges & most bots won’t work yet.</Text>}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
|
<SettingTile
|
||||||
|
title="Select your role"
|
||||||
|
options={(
|
||||||
|
<SegmentControl
|
||||||
|
selected={roleIndex}
|
||||||
|
segments={[{ text: 'Admin' }, { text: 'Founder' }]}
|
||||||
|
onSelect={setRoleIndex}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
content={(
|
||||||
|
<Text variant="b3">Override the default (100) power level.</Text>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
<Input value={topicValue} onChange={handleTopicChange} forwardRef={topicRef} minHeight={174} resizable label="Topic (optional)" />
|
<Input value={topicValue} onChange={handleTopicChange} forwardRef={topicRef} minHeight={174} resizable label="Topic (optional)" />
|
||||||
<div className="create-room__name-wrapper">
|
<div className="create-room__name-wrapper">
|
||||||
<Input value={titleValue} onChange={handleTitleChange} forwardRef={nameRef} label="Room name" required />
|
<Input value={titleValue} onChange={handleTitleChange} forwardRef={nameRef} label="Room name" required />
|
||||||
|
|
|
@ -9,6 +9,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
& .segment-btn {
|
||||||
|
padding: var(--sp-ultra-tight) 0;
|
||||||
|
&__base {
|
||||||
|
padding: 0 var(--sp-tight);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&__address {
|
&__address {
|
||||||
display: flex;
|
display: flex;
|
||||||
&__label {
|
&__label {
|
||||||
|
|
|
@ -132,9 +132,11 @@ function leave(roomId) {
|
||||||
* @param {boolean} [opts.isEncrypted=false] Makes room encrypted
|
* @param {boolean} [opts.isEncrypted=false] Makes room encrypted
|
||||||
* @param {boolean} [opts.isDirect=false] Makes room as direct message
|
* @param {boolean} [opts.isDirect=false] Makes room as direct message
|
||||||
* @param {string[]} [opts.invite=[]] An array of userId's to invite
|
* @param {string[]} [opts.invite=[]] An array of userId's to invite
|
||||||
|
* @param{number} [opts.powerLevel=100] My power level
|
||||||
*/
|
*/
|
||||||
async function create(opts) {
|
async function create(opts) {
|
||||||
const mx = initMatrix.matrixClient;
|
const mx = initMatrix.matrixClient;
|
||||||
|
const customPowerLevels = [101];
|
||||||
const options = {
|
const options = {
|
||||||
name: opts.name,
|
name: opts.name,
|
||||||
topic: opts.topic,
|
topic: opts.topic,
|
||||||
|
@ -144,6 +146,9 @@ async function create(opts) {
|
||||||
invite: opts.invite || [],
|
invite: opts.invite || [],
|
||||||
initial_state: [],
|
initial_state: [],
|
||||||
preset: opts.isDirect === true ? 'trusted_private_chat' : undefined,
|
preset: opts.isDirect === true ? 'trusted_private_chat' : undefined,
|
||||||
|
power_level_content_override: customPowerLevels.indexOf(opts.powerLevel) === -1 ? undefined : {
|
||||||
|
users: { [initMatrix.matrixClient.getUserId()]: opts.powerLevel },
|
||||||
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
if (opts.isPublic !== true && opts.isEncrypted === true) {
|
if (opts.isPublic !== true && opts.isEncrypted === true) {
|
||||||
|
|
Loading…
Reference in a new issue