[NEW] Broadcast Channels (#9950)

* [NEW] Broadcast Channels

* code guidelines

* fix createroom type p extradata

* fix private room can change join_code

* test to show member list

* Code cleanup

* Update message.js

packages/rocketchat-channel-settings/client/views/channelSettings.html

@@ -163,6 +163,23 @@
 			</div>
 			{{/if}}
 		{{/with}}
+		{{#with settings.broadcast}}
+			{{#if canView}}
+			<div class="rc-user-info__row">
+				<div class="rc-switch rc-switch--blue">
+					<label class="rc-switch__label">
+						<span class="rc-switch__text">
+							{{_ label}}{{equal default value '*'}}
+						</span>
+						<input type="checkbox" class="rc-switch__input js-input-check" name="archived" checked="{{checked}}" disabled>
+						<span class="rc-switch__button">
+							<span class="rc-switch__button-inside"></span>
+						</span>
+					</label>
+				</div>
+			</div>
+			{{/if}}
+		{{/with}}
 		{{#with settings.joinCode}}
 			<div class="rc-user-info__row">
 				<div class="rc-input">
@@ -228,7 +245,11 @@ <h3 title="{{name}}" class="rc-user-info__name">{{> icon block="rc-header__icon"
 					{{unscape topic}}
 				</div>
 			</label>
-
+			{{#if broadcast}}
+				<label class="rc-user-info__label">
+					<b>{{_ "Broadcast_channel"}}:</b> {{_ "Broadcast_channel_Description"}}
+				</label>
+			{{/if}}
 		{{/with}}
 		{{#each channelSettings}}
 			<div class="rc-user-info__row">

packages/rocketchat-channel-settings/client/views/channelSettings.js

@@ -225,7 +225,7 @@ Template.channelSettingsEditing.onCreated(function() {
 				return RocketChat.roomTypes.roomTypes[room.t].allowRoomSettingChange(room, RoomSettingsEnum.READ_ONLY);
 			},
 			canEdit() {
-				return RocketChat.authz.hasAllPermission('set-readonly', room._id);
+				return !room.broadcast && RocketChat.authz.hasAllPermission('set-readonly', room._id);
 			},
 			save(value) {
 				return call('saveRoomSettings', room._id, RoomSettingsEnum.READ_ONLY, value).then(() => toastr.success(TAPi18n.__('Read_only_changed_successfully')));
@@ -237,10 +237,10 @@ Template.channelSettingsEditing.onCreated(function() {
 			isToggle: true,
 			processing: new ReactiveVar(false),
 			canView() {
-				return RocketChat.roomTypes.roomTypes[room.t].allowRoomSettingChange(room, RoomSettingsEnum.REACT_WHEN_READ_ONLY) && room.ro;
+				return RocketChat.roomTypes.roomTypes[room.t].allowRoomSettingChange(room, RoomSettingsEnum.REACT_WHEN_READ_ONLY);
 			},
 			canEdit() {
-				return RocketChat.authz.hasAllPermission('set-react-when-readonly', room._id);
+				return !room.broadcast && RocketChat.authz.hasAllPermission('set-react-when-readonly', room._id);
 			},
 			save(value) {
 				return call('saveRoomSettings', room._id, 'reactWhenReadOnly', value).then(() => {
@@ -289,6 +289,21 @@ Template.channelSettingsEditing.onCreated(function() {
 				});
 			}
 		},
+		broadcast: {
+			type: 'boolean',
+			label: 'Broadcast_channel',
+			isToggle: true,
+			processing: new ReactiveVar(false),
+			canView() {
+				return RocketChat.roomTypes.roomTypes[room.t].allowRoomSettingChange(room, RoomSettingsEnum.BROADCAST);
+			},
+			canEdit() {
+				return false;
+			},
+			save() {
+				return Promise.resolve();
+			}
+		},
 		joinCode: {
 			type: 'text',
 			label: 'Password',
@@ -452,6 +467,9 @@ Template.channelSettingsInfo.helpers({
 	description() {
 		return Template.instance().room.description;
 	},
+	broadcast() {
+		return Template.instance().room.broadcast;
+	},
 	announcement() {
 		return Template.instance().room.announcement ? Template.instance().room.announcement.message : '';
 	},

packages/rocketchat-channel-settings/server/methods/saveRoomSettings.js

@@ -31,8 +31,15 @@ Meteor.methods({
 			});
 		}
 
-
 		const room = RocketChat.models.Rooms.findOneById(rid);
+
+		if (room.broadcast && (settings.readOnly || settings.reactWhenReadOnly)) {
+			throw new Meteor.Error('error-action-not-allowed', 'Editing readOnly/reactWhenReadOnly are not allowed for broadcast rooms', {
+				method: 'saveRoomSettings',
+				action: 'Editing_room'
+			});
+		}
+
 		if (!room) {
 			throw new Meteor.Error('error-invalid-room', 'Invalid room', {
 				method: 'saveRoomSettings'

packages/rocketchat-i18n/i18n/en.i18n.json

@@ -267,6 +267,7 @@
   "Application_added": "Application added",
   "Application_Name": "Application Name",
   "Application_updated": "Application updated",
+  "Apply": "Apply",
   "Apply_and_refresh_all_clients": "Apply and refresh all clients",
   "Archive": "Archive",
   "archive-room": "Archive Room",
@@ -343,6 +344,8 @@
   "BotHelpers_userFields": "User Fields",
   "BotHelpers_userFields_Description": "CSV of user fields that can be accessed by bots helper methods.",
   "Branch": "Branch",
+  "Broadcast_channel": "Broadcast Channel",
+  "Broadcast_channel_Description": "Only authorized users can write new messages, but the other users will be able to reply",
   "Broadcast_Connected_Instances": "Broadcast Connected Instances",
   "Bugsnag_api_key": "Bugsnag API Key",
   "Build_Environment": "Build Environment",

packages/rocketchat-lib/client/defaultTabBars.js

@@ -22,7 +22,19 @@ RocketChat.TabBar.addButton({
 	i18nTitle: 'Members_List',
 	icon: 'team',
 	template: 'membersList',
-	order: 2
+	order: 2,
+	condition() {
+		const rid = Session.get('openedRoom');
+		const room = RocketChat.models.Rooms.findOne({
+			_id: rid
+		});
+
+		if (!room || !room.broadcast) {
+			return true;
+		}
+
+		return RocketChat.authz.hasRole(Meteor.userId(), ['admin', 'moderator', 'owner'], rid);
+	}
 });
 
 RocketChat.TabBar.addButton({

packages/rocketchat-lib/lib/RoomTypeConfig.js

@@ -6,7 +6,8 @@ export const RoomSettingsEnum = {
 	READ_ONLY: 'readOnly',
 	REACT_WHEN_READ_ONLY: 'reactWhenReadOnly',
 	ARCHIVE_OR_UNARCHIVE: 'archiveOrUnarchive',
-	JOIN_CODE: 'joinCode'
+	JOIN_CODE: 'joinCode',
+	BROADCAST: 'broadcast'
 };
 
 export const UiTextContext = {

packages/rocketchat-lib/lib/roomTypes/private.js

@@ -60,6 +60,12 @@ export class PrivateRoomType extends RoomTypeConfig {
 		switch (setting) {
 			case RoomSettingsEnum.JOIN_CODE:
 				return false;
+			case RoomSettingsEnum.BROADCAST:
+				return room.broadcast;
+			case RoomSettingsEnum.READ_ONLY:
+				return !room.broadcast;
+			case RoomSettingsEnum.REACT_WHEN_READ_ONLY:
+				return !room.broadcast && room.ro;
 			default:
 				return true;
 		}

packages/rocketchat-lib/lib/roomTypes/public.js

@@ -1,5 +1,5 @@
 /* globals openRoom */
-import {RoomTypeConfig, RoomTypeRouteConfig, UiTextContext} from '../RoomTypeConfig';
+import { RoomTypeConfig, RoomTypeRouteConfig, RoomSettingsEnum, UiTextContext } from '../RoomTypeConfig';
 
 export class PublicRoomRoute extends RoomTypeRouteConfig {
 	constructor() {
@@ -63,12 +63,21 @@ export class PublicRoomType extends RoomTypeConfig {
 		return RocketChat.authz.hasAtLeastOnePermission(['add-user-to-any-c-room', 'add-user-to-joined-room'], room._id);
 	}
 
-	allowRoomSettingChange() {
+	enableMembersListProfile() {
 		return true;
 	}
 
-	enableMembersListProfile() {
-		return true;
+	allowRoomSettingChange(room, setting) {
+		switch (setting) {
+			case RoomSettingsEnum.BROADCAST:
+				return room.broadcast;
+			case RoomSettingsEnum.READ_ONLY:
+				return !room.broadcast;
+			case RoomSettingsEnum.REACT_WHEN_READ_ONLY:
+				return !room.broadcast && room.ro;
+			default:
+				return true;
+		}
 	}
 
 	getUiText(context) {

packages/rocketchat-lib/server/functions/createRoom.js

@@ -20,6 +20,11 @@ RocketChat.createRoom = function(type, name, owner, members, readOnly, extraData
 		members.push(owner.username);
 	}
 
+	if (extraData.broadcast) {
+		readOnly = true;
+		delete extraData.reactWhenReadOnly;
+	}
+
 	const now = new Date();
 	let room = Object.assign({
 		name,

packages/rocketchat-lib/server/methods/createChannel.js

@@ -1,5 +1,5 @@
 Meteor.methods({
-	createChannel(name, members, readOnly = false, customFields = {}) {
+	createChannel(name, members, readOnly = false, customFields = {}, extraData = {}) {
 		check(name, String);
 		check(members, Match.Optional([String]));
 
@@ -10,7 +10,6 @@ Meteor.methods({
 		if (!RocketChat.authz.hasPermission(Meteor.userId(), 'create-c')) {
 			throw new Meteor.Error('error-not-allowed', 'Not allowed', { method: 'createChannel' });
 		}
-
-		return RocketChat.createRoom('c', name, Meteor.user() && Meteor.user().username, members, readOnly, {customFields});
+		return RocketChat.createRoom('c', name, Meteor.user() && Meteor.user().username, members, readOnly, {customFields, ...extraData});
 	}
 });

packages/rocketchat-theme/client/imports/components/header.css

@@ -9,6 +9,10 @@
 
 		margin: 0 -0.5rem;
 
+
+		display: flex;
+		flex: 0 0 auto;
+
 		padding: var(--header-padding);
 
 		white-space: nowrap;

packages/rocketchat-theme/client/imports/forms/button.css

@@ -140,6 +140,15 @@
 			border-radius: 50%;
 		}
 	}
+
+	&-broadcast {
+		margin: 10px 0;
+		padding: 0 1rem;
+
+		&__icon {
+			margin: 0 5px;
+		}
+	}
 }
 
 @media (width < 780px) {

packages/rocketchat-theme/client/imports/forms/input.css

@@ -112,6 +112,9 @@
 	}
 
 	&--error {
+		.rc-tags {
+			border-color: var(--input-error-color);
+		}
 		& .rc-input {
 			&__element {
 				border-color: var(--input-error-color);

packages/rocketchat-theme/client/imports/forms/popup-list.css

@@ -1,6 +1,8 @@
 .rc-popup-list {
 	position: absolute;
 
+	z-index: 1;
+
 	width: 100%;
 
 	padding: 0 4px;

packages/rocketchat-theme/client/imports/forms/switch.css

@@ -28,6 +28,17 @@
 	&__input {
 		display: none;
 
+		&:checked {
+			& + .rc-switch__button {
+				border-color: #26d198;
+				background-color: var(--rc-color-success);
+
+				& .rc-switch__button-inside {
+					transform: translate3d(13px, 1px, 0);
+				}
+			}
+		}
+
 		&:disabled {
 			& + .rc-switch__button {
 				cursor: default;
@@ -40,17 +51,6 @@
 				cursor: default;
 			}
 		}
-
-		&:checked {
-			& + .rc-switch__button {
-				border-color: #26d198;
-				background-color: var(--rc-color-success);
-
-				& .rc-switch__button-inside {
-					transform: translate3d(13px, 1px, 0);
-				}
-			}
-		}
 	}
 
 	&__button {

packages/rocketchat-ui-message/client/message.html

@@ -111,6 +111,11 @@
 				</li>
 			{{/each}}
 		</ul>
+		{{# if broadcast}}
+			{{#with u}}
+				<button type="button" class="rc-button rc-button--outline rc-button--primary rc-button-broadcast js-reply-broadcast" name="button">{{> icon block="rc-button-broadcast__icon" icon="reply"}} {{_'Reply'}} </button>
+			{{/with}}
+		{{/if}}
 		<ul class="reactions {{hideReactions}}">
 			{{#each reaction in reactions}}
 				<li data-emoji="{{reaction.emoji}}" {{markUserReaction reaction}}>

packages/rocketchat-ui-message/client/message.js

@@ -6,6 +6,10 @@ Template.message.helpers({
 	encodeURI(text) {
 		return encodeURI(text);
 	},
+	broadcast() {
+		const instance = Template.instance();
+		return this.u._id !== Meteor.userId() && instance.room && instance.room.broadcast;
+	},
 	isIgnored() {
 		return this.ignored;
 	},
@@ -48,12 +52,12 @@ Template.message.helpers({
 		});
 	},
 	isGroupable() {
-		if (this.groupable === false) {
+		if (Template.instance().room.broadcast || this.groupable === false) {
 			return 'false';
 		}
 	},
 	isSequential() {
-		return this.groupable !== false;
+		return this.groupable !== false && !Template.instance().room.broadcast;
 	},
 	sequentialClass() {
 		if (this.groupable !== false) {
@@ -316,6 +320,14 @@ Template.message.onCreated(function() {
 
 	this.wasEdited = (msg.editedAt != null) && !RocketChat.MessageTypes.isSystemMessage(msg);
 
+	this.room = RocketChat.models.Rooms.findOne({
+		_id: msg.rid
+	}, {
+		fields: {
+			broadcast: 1
+		}
+	});
+
 	return this.body = (() => {
 		const isSystemMessage = RocketChat.MessageTypes.isSystemMessage(msg);
 		const messageType = RocketChat.MessageTypes.getType(msg)||{};

packages/rocketchat-ui-message/client/messageBox.js

@@ -649,8 +649,6 @@ Template.messageBox.onRendered(function() {
 	}).on('autogrow', () => {
 		this.data && this.data.onResize && this.data.onResize();
 	}).focus()[0];
-
-	chatMessages[RocketChat.openedRoom].restoreText(RocketChat.openedRoom);
 });
 
 Template.messageBox.onCreated(function() {
@@ -685,6 +683,7 @@ Meteor.startup(function() {
 		setTimeout(()=> {
 			if (chatMessages[RocketChat.openedRoom].input) {
 				chatMessages[RocketChat.openedRoom].input.focus();
+				chatMessages[RocketChat.openedRoom].restoreText(RocketChat.openedRoom);
 			}
 		}, 200);
 	});