Rocket.Chat/app/push-notifications/client/views/pushNotificationsFlexTab.html

<template name="pushNotificationsFlexTab">
	<main class="rc-user-info__scroll">
		<div class="rc-user-info__row rc-user-info__row--separator">
			<div class="rc-switch-double">
				<div class="rc-switch-double__label {{#if notificationIsEnabled}}disabled{{/if}}">
					{{_ "Turn_OFF"}}
					<div class="rc-switch-double__description">
						{{_ "Mute_all_notifications"}}
					</div>
				</div>
				<div class="rc-switch rc-switch--blue">
					<label class="rc-switch__label">
							<input type="checkbox" class="rc-switch__input js-input-check" value="0" id="disableNotifications" name="disableNotifications" checked="{{$eq notificationIsEnabled true}}">
							<span class="rc-switch__button">
								<span class="rc-switch__button-inside"></span>
							</span>
					</label>
				</div>
				<div class="rc-switch-double__label {{#unless notificationIsEnabled}}disabled{{/unless}}">
					{{_ "Turn_ON"}}
					<div class="rc-switch-double__description">
						{{_ "Receive_alerts"}}
					</div>
				</div>
			</div>
		</div>
		<div class="rc-user-info__row rc-user-info__row--separator">
			<div class="rc-switch-double">
				<div class="rc-switch-double__label {{#if muteGroupMentions}}disabled{{/if}}">
					{{_ "Receive_Group_Mentions"}}
				</div>
				<div class="rc-switch rc-switch--blue">
					<label class="rc-switch__label">
						<input type="checkbox" class="rc-switch__input js-input-check" id="muteGroupMentions" name="muteGroupMentions" value="1" checked="{{$eq muteGroupMentions true}}">
						<span class="rc-switch__button">
							<span class="rc-switch__button-inside"></span>
						</span>
					</label>
				</div>
				<div class="rc-switch-double__label {{#unless muteGroupMentions}}disabled{{/unless}}">
					{{_ "Mute_Group_Mentions"}}
				</div>
			</div>
		</div>
		<div class="rc-user-info__row rc-user-info__row--separator">
			<div class="rc-switch-double">
				<div class="rc-switch-double__label {{#if showUnreadStatus}}disabled{{/if}}">
					{{_ "Hide_counter"}}
					<div class="rc-switch-double__description">
						{{_ "Do_not_display_unread_counter"}}
					</div>
				</div>
				<div class="rc-switch rc-switch--blue">
					<label class="rc-switch__label">
						<input type="checkbox" class="rc-switch__input js-input-check" id="hideUnreadStatus" name="hideUnreadStatus" value="1" checked="{{$eq showUnreadStatus true}}">
						<span class="rc-switch__button">
							<span class="rc-switch__button-inside"></span>
						</span>
					</label>
				</div>
				<div class="rc-switch-double__label {{#unless showUnreadStatus}}disabled{{/unless}}">
					{{_ "Show_counter"}}
					<div class="rc-switch-double__description">
						{{_ "Display_unread_counter"}}
					</div>
				</div>
			</div>
		</div>
		{{#if notificationIsEnabled}}
			<div class="rc-user-info__row rc-user-info__row--separator">
				<div class="rc-user-info__config">
					<div class="rc-user-info__config-header">
						{{> icon block="rc-user-info__config-icon" icon="computer"}}
						<span class="rc-user-info__config-label">{{_ "Desktop"}}</span>
					</div>
					<div class="rc-user-info__config-content">
						<div class="rc-user-info__config-name">{{_ "Alerts"}}:</div>
						{{# with "desktopNotifications"}}
							<div class="rc-user-info__config-value">
								{{subValue 'desktopNotifications'}}
								{{> icon block="rc-user-info__config-content-icon" icon="arrow-down"}}
							</div>
						{{/with}}
					</div>
					<div class="rc-user-info__config-content">
						<div class="rc-user-info__config-name">{{_ "Audio"}}:</div>
						{{# with "audioNotifications"}}
							<div class="rc-user-info__config-value">
								{{subValue 'audioNotifications'}}
								{{> icon block="rc-user-info__config-content-icon" icon="arrow-down"}}
							</div>
						{{/with}}
					</div>
					<div class="rc-user-info__config-content">
						<div class="rc-user-info__config-name">{{_ "Sound"}}:</div>
						{{# with "audioNotificationValue"}}
							<div class="rc-user-info__config-value">
								{{audioNotificationValue}}
								{{> icon block="rc-user-info__config-content-icon" icon="arrow-down"}}
							</div>
							<i class="icon-play-circled" data-play="{{audioNotificationValue}}"></i>
						{{/with}}
					</div>
					<div class="rc-user-info__config-content">
						<div class="rc-user-info__config-name">{{_ "Notifications_Duration"}}:</div>
						{{# with "desktopNotificationDuration"}}
							<div class="rc-user-info__config-value">
								{{#if desktopNotificationDuration }}
									{{_ "Duration"}} {{desktopNotificationDuration}} {{_ "seconds"}}
								{{else}}
									{{_ "Use_User_Preferences_or_Global_Settings"}}
								{{/if}}

								{{> icon block="rc-user-info__config-content-icon" icon="arrow-down"}}
							</div>
						{{/with}}
					</div>
				</div>
			</div>
			<div class="rc-user-info__row rc-user-info__row--separator">
				<div class="rc-user-info__config">
					<div class="rc-user-info__config-header">
						{{> icon block="rc-user-info__config-icon" icon="mobile"}}
						<span class="rc-user-info__config-label">{{_ "Mobile"}}</span>
					</div>
					<div class="rc-user-info__config-content">
							<div class="rc-user-info__config-name">{{_ "Alerts"}}:</div>
							{{# with "mobilePushNotifications"}}
								<div class="rc-user-info__config-value">
									{{subValue "mobilePushNotifications"}}
									{{> icon block="rc-user-info__config-content-icon" icon="arrow-down"}}
								</div>
							{{/with}}
					</div>
				</div>
			</div>
			<div class="rc-user-info__row rc-user-info__row--separator">
				<div class="rc-user-info__config">
					<div class="rc-user-info__config-header">
						{{> icon block="rc-user-info__config-icon" icon="mail"}}
						<span class="rc-user-info__config-label">{{_ "Email"}}</span>
					</div>
					<div class="rc-user-info__config-content">
							<div class="rc-user-info__config-name">{{_ "Alerts"}}:</div>
							{{# with "emailNotifications"}}
							<div class="rc-user-info__config-value">
								{{subValue 'emailNotifications'}}
								{{> icon block="rc-user-info__config-content-icon" icon="arrow-down"}}
							</div>
							{{/with}}
					</div>
				</div>
			</div>
		{{/if}}
	</main>
	<div class="rc-user-info__flex rc-user-info__row">
		<button class="rc-button js-cancel rc-button--outline" title="{{_ 'Cancel'}}">{{_ 'Cancel'}}</button>
		<button class="rc-button rc-button--primary js-save" title="{{_ 'Save'}}" disabled={{disabled}}>{{_ 'Save'}}</button>
	</div>
</template>
<!-- <div class="rc-user-info__row rc-user-info__row--separator">
			<div class="rc-switch-double">
				<div class="rc-switch-double__label">
					{{_ "User_default"}}
					<div class="rc-switch-double__description">
						{{_ "Keep_default_user_settings"}}
					</div>
				</div>
				<div class="rc-switch rc-switch--blue">
					<label class="rc-switch__label">
						<input type="checkbox" class="rc-switch__input js-input-check" id="customize" name="customize" value="1" checked="{{$eq customize true}}">
						<span class="rc-switch__button">
							<span class="rc-switch__button-inside"></span>
						</span>
					</label>
				</div>
				<div class="rc-switch-double__label">
					{{_ "Customize"}}
					<div class="rc-switch-double__description">
						{{_ "Create_unique_rules_for_this_channel"}}
					</div>
				</div>
			</div>
		</div> -->

<template name="pushNotificationsPopover">
	{{#each options}}
	<div class="rc-popover__item">
		<input type="radio" class="rc-popover__item-radio" id="{{id}}" name="{{name}}" value="{{value}}" />
		<label for="{{id}}" class="rc-popover__item-radio-label">{{_ label}}</label>
	</div>
	{{/each}}
</template>