Add space around brackets

webapp/src/App.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-#app(:class="{'has-background-room': backgroundRoom, 'override-sidebar-collapse': overrideSidebarCollapse}", :style="[themeVariables, browserhackStyle, mediaConstraintsStyle]", :key="`${userLocale}-${userTimezone}`")
+#app(:class="{ 'has-background-room': backgroundRoom, 'override-sidebar-collapse': overrideSidebarCollapse }", :style="[themeVariables, browserhackStyle, mediaConstraintsStyle]", :key="`${userLocale}-${userTimezone}`")
 	.fatal-connection-error(v-if="fatalConnectionError")
 		template(v-if="fatalConnectionError.code === 'world.unknown_world'")
 			.mdi.mdi-help-circle

webapp/src/components/AVDevicePrompt.vue

@@ -15,7 +15,7 @@ prompt.c-av-device-prompt(@close="$emit('close')")
 import Prompt from 'components/Prompt'
 
 export default {
-	components: {Prompt},
+	components: { Prompt },
 	props: {},
 	data() {
 		return {
@@ -88,7 +88,7 @@ export default {
 			}
 			const constraints = {
 				audio: {},
-				video: {deviceId: this.videoInput ? {exact: this.videoInput} : undefined},
+				video: { deviceId: this.videoInput ? { exact: this.videoInput } : undefined },
 			}
 			navigator.mediaDevices.getUserMedia(constraints).then((stream) => {
 				this.stream = stream

webapp/src/components/AppBar.vue

@@ -1,7 +1,7 @@
 <template lang="pug">
 .c-app-bar
 	bunt-icon-button(v-if="showActions", @click="$emit('toggleSidebar')", @touchend.native="$emit('toggleSidebar')") menu
-	router-link.logo(:to="{name: 'home'}", :class="{anonymous: isAnonymous}")
+	router-link.logo(:to="{ name: 'home' }", :class="{ anonymous: isAnonymous }")
 		img(:src="theme.logo.url", :alt="world.title")
 	.user(v-if="showUser")
 		p(v-if="isAnonymous") {{ $t('AppBar:user-anonymous') }}

webapp/src/components/Avatar.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-.c-avatar(:style="{'--avatar-size': size + 'px'}", :class="{deleted: user.deleted}")
+.c-avatar(:style="{ '--avatar-size': size + 'px' }", :class="{ deleted: user.deleted }")
 	img(v-if="imageUrl", :src="imageUrl")
 	identicon(v-else, :user="user")
 </template>

webapp/src/components/ChannelBrowser.vue

@@ -19,7 +19,7 @@ prompt.c-channel-browser(@close="$emit('close')", :scrollable="false")
 			.no-results(v-if="search && searchedChannels.length === 0") {{ $t('ChannelBrowser:search:empty') }}
 </template>
 <script>
-import {mapGetters, mapState} from 'vuex'
+import { mapGetters, mapState } from 'vuex'
 import Prompt from 'components/Prompt'
 import fuzzysearch from 'lib/fuzzysearch'
 
@@ -37,7 +37,7 @@ export default {
 		channels() {
 			return this.rooms
 				.filter(room => room.modules.length === 1 && room.modules[0].type === 'chat.native')
-				.map(room => ({room, channelJoined: this.joinedChannels.some(channel => channel.id === room.modules[0].channel_id)}))
+				.map(room => ({ room, channelJoined: this.joinedChannels.some(channel => channel.id === room.modules[0].channel_id) }))
 		},
 		searchedChannels() {
 			if (!this.search) return this.channels

webapp/src/components/Chat.vue

@@ -9,7 +9,7 @@
 					chat-message(:message="message", :previousMessage="filteredTimeline[index - 1]", :nextMessage="filteredTimeline[index + 1]", :mode="mode", :key="message.event_id", @showUserCard="showUserCard")
 			.warning(v-if="mergedWarning")
 				.content
-					ChatContent(:content="$t('Chat:warning:missed-users', {count: mergedWarning.missed_users.length, missedUsers: mergedWarning.missed_users})", @clickMention="showUserCard")
+					ChatContent(:content="$t('Chat:warning:missed-users', { count: mergedWarning.missed_users.length, missedUsers: mergedWarning.missed_users })", @clickMention="showUserCard")
 				bunt-icon-button(@click="$store.dispatch('chat/dismissWarnings')") close
 			.chat-input
 				.no-permission(v-if="room && !room.permissions.includes('room:chat.join')") {{ $t('Chat:permission-block:room:chat.join') }}
@@ -102,7 +102,7 @@ export default {
 		connected(value) {
 			if (value) {
 				// resubscribe
-				this.$store.dispatch('chat/subscribe', {channel: this.module.channel_id, config: this.module.config})
+				this.$store.dispatch('chat/subscribe', { channel: this.module.channel_id, config: this.module.config })
 			}
 		},
 		async filteredTimeline() {
@@ -115,7 +115,7 @@ export default {
 		}
 	},
 	created() {
-		this.$store.dispatch('chat/subscribe', {channel: this.module.channel_id, config: this.module.config})
+		this.$store.dispatch('chat/subscribe', { channel: this.module.channel_id, config: this.module.config })
 	},
 	beforeDestroy() {
 		this.$store.dispatch('chat/unsubscribe')
@@ -140,7 +140,7 @@ export default {
 			this.$store.dispatch('chat/join')
 		},
 		send(content) {
-			this.$store.dispatch('chat/sendMessage', {content})
+			this.$store.dispatch('chat/sendMessage', { content })
 		},
 		async showUserCard(event, user, placement = 'left-start') {
 			console.log(user.id)

webapp/src/components/ChatInput.vue

@@ -23,7 +23,7 @@ bunt-input-outline-container.c-chat-input
 		.autocomplete-dropdown(:style="autocompleteCoordinates")
 			template(v-if="autocomplete.options")
 				template(v-for="option, index of autocomplete.options")
-					.user(:class="{selected: index === autocomplete.selected}", :title="option.profile.display_name", @mouseover="selectMention(index)", @click.stop="handleMention")
+					.user(:class="{ selected: index === autocomplete.selected }", :title="option.profile.display_name", @mouseover="selectMention(index)", @click.stop="handleMention")
 						avatar(:user="option", :size="24")
 						.name {{ option.profile.display_name }}
 			bunt-progress-circular(v-else, size="large", :page="true")
@@ -74,7 +74,7 @@ export default {
 			// TODO debounce?
 			if (!this.autocomplete) return
 			if (this.autocomplete.type === 'mention') {
-				const { results } = await api.call('user.list.search', {search_term: search, page: 1, include_banned: false})
+				const { results } = await api.call('user.list.search', { search_term: search, page: 1, include_banned: false })
 				this.autocomplete.options = results
 				// if (results.length === 1) {
 				// 	this.autocomplete.selected = 0
@@ -224,7 +224,7 @@ export default {
 					body: text
 				})
 			}
-			this.quill.setContents([{insert: '\n'}])
+			this.quill.setContents([{ insert: '\n' }])
 		},
 		async attachFiles(event) {
 			const files = Array.from(event.target.files)
@@ -251,7 +251,7 @@ export default {
 		addEmoji(emoji) {
 			// TODO skin color
 			const selection = this.quill.getSelection(true)
-			this.quill.updateContents(new Delta().retain(selection.index).delete(selection.length).insert({emoji: emoji.native}), 'user')
+			this.quill.updateContents(new Delta().retain(selection.index).delete(selection.length).insert({ emoji: emoji.native }), 'user')
 			this.quill.setSelection(selection.index + 1, 0)
 		},
 		removeFile(file) {

webapp/src/components/ChatMessage.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-.c-chat-message(:class="[mode, {selected, readonly, 'system-message': isSystemMessage, 'merge-with-previous-message': mergeWithPreviousMessage, 'merge-with-next-message': mergeWithNextMessage, 'sender-deleted': sender.deleted}]")
+.c-chat-message(:class="[mode, { selected, readonly, 'system-message': isSystemMessage, 'merge-with-previous-message': mergeWithPreviousMessage, 'merge-with-next-message': mergeWithNextMessage, 'sender-deleted': sender.deleted }]")
 	.avatar-column(v-if="message.event_type !== 'channel.poll'")
 		avatar(v-if="!mergeWithPreviousMessage", :user="sender", :size="avatarSize", @click.native="$emit('showUserCard', $event, sender, 'right-start')", ref="avatar")
 		.timestamp(v-if="mergeWithPreviousMessage") {{ shortTimestamp }}
@@ -30,7 +30,7 @@
 				.title {{ message.content.preview_card.title }}
 				.description {{ message.content.preview_card.description }}
 			.reactions(v-if="Object.keys(message.reactions).length > 0")
-				.reaction(v-for="users, emoji of message.reactions", :class="{'reacted-by-me': users.includes(user.id)}", @click="toggleReaction(emoji, users)", @pointerenter="initReactionTooltip($event, {emoji, users})", @pointerleave="reactionTooltip = null")
+				.reaction(v-for="users, emoji of message.reactions", :class="{ 'reacted-by-me': users.includes(user.id) }", @click="toggleReaction(emoji, users)", @pointerenter="initReactionTooltip($event, { emoji, users })", @pointerleave="reactionTooltip = null")
 					span.emoji(:style="nativeEmojiToStyle(emoji)")
 					.count {{ users.length }}
 				emoji-picker-button(@selected="addReaction", strategy="fixed", placement="top-start", :offset="[0, 3]", icon-style="plus")
@@ -45,7 +45,7 @@
 		.actions(v-if="!readonly")
 			emoji-picker-button(@selected="addReaction", strategy="fixed", placement="bottom-end", :offset="[36, 3]", icon-style="plus")
 			menu-dropdown(v-if="(hasPermission('room:chat.moderate') || message.sender === user.id)", v-model="selected", placement="bottom-end", strategy="fixed", :offset="[0, 3]")
-				template(v-slot:button="{toggle}")
+				template(v-slot:button="{ toggle }")
 					bunt-icon-button(@click="toggle") dots-vertical
 				template(v-slot:menu)
 					.edit-message(v-if="message.sender === user.id && message.content.type !== 'call'", @click="startEditingMessage") {{ $t('ChatMessage:message-edit:label') }}
@@ -159,19 +159,19 @@ export default {
 	methods: {
 		getUserName,
 		addReaction(emoji) {
-			this.$store.dispatch('chat/addReaction', {message: this.message, reaction: emoji.native})
+			this.$store.dispatch('chat/addReaction', { message: this.message, reaction: emoji.native })
 		},
 		toggleReaction(emoji, users) {
 			if (users.includes(this.user.id)) {
 				if (users.length === 1) {
 					this.reactionTooltip = null
 				}
-				this.$store.dispatch('chat/removeReaction', {message: this.message, reaction: emoji})
+				this.$store.dispatch('chat/removeReaction', { message: this.message, reaction: emoji })
 			} else {
-				this.$store.dispatch('chat/addReaction', {message: this.message, reaction: emoji})
+				this.$store.dispatch('chat/addReaction', { message: this.message, reaction: emoji })
 			}
 		},
-		async initReactionTooltip(event, {emoji, users}) {
+		async initReactionTooltip(event, { emoji, users }) {
 			this.reactionTooltip = {
 				emoji,
 				// TODO 'and you'
@@ -193,7 +193,7 @@ export default {
 		},
 		editMessage(content) {
 			this.editing = false
-			this.$store.dispatch('chat/editMessage', {message: this.message, content})
+			this.$store.dispatch('chat/editMessage', { message: this.message, content })
 		},
 		deleteMessage() {
 			this.$store.dispatch('chat/deleteMessage', this.message)

webapp/src/components/ChatUserCard.vue

@@ -1,7 +1,7 @@
 <template lang="pug">
 .c-chat-user-card
 	.ui-background-blocker(v-if="!userAction", @click="$emit('close')")
-	.user-card(v-if="!userAction", :class="{deleted: user.deleted}", ref="card", @mousedown="showMoreActions=false")
+	.user-card(v-if="!userAction", :class="{ deleted: user.deleted }", ref="card", @mousedown="showMoreActions=false")
 		scrollbars(y)
 			avatar(:user="user", :size="128")
 			.name
@@ -14,7 +14,7 @@
 				bunt-button.btn-dm(v-if="hasPermission('world:chat.direct')", @click="openDM") {{ $t('UserAction:action.dm:label') }}
 				bunt-button.btn-call(v-if="hasPermission('world:chat.direct')", @click="startCall") {{ $t('UserAction:action.call:label') }}
 				menu-dropdown(v-model="showMoreActions", :blockBackground="false", @mousedown.native.stop="")
-					template(v-slot:button="{toggle}")
+					template(v-slot:button="{ toggle }")
 						bunt-icon-button(@click="toggle") dots-vertical
 					template(v-slot:menu)
 						.unblock(v-if="isBlocked", @click="userAction = 'unblock'") {{ $t('UserAction:action.unblock:label') }}
@@ -74,18 +74,18 @@ export default {
 		}
 	},
 	async created() {
-		this.onlineStatus = (await api.call('user.online_status', {ids: [this.user.id]}))[this.user.id]
+		this.onlineStatus = (await api.call('user.online_status', { ids: [this.user.id] }))[this.user.id]
 		this.blockedUsers = (await api.call('user.list.blocked')).users
 	},
 	methods: {
 		getUserName,
 		async openDM() {
 			// TODO loading indicator
-			await this.$store.dispatch('chat/openDirectMessage', {users: [this.user]})
+			await this.$store.dispatch('chat/openDirectMessage', { users: [this.user] })
 		},
 		async startCall() {
-			const channel = await this.$store.dispatch('chat/openDirectMessage', {users: [this.user]})
-			await this.$store.dispatch('chat/startCall', {channel})
+			const channel = await this.$store.dispatch('chat/openDirectMessage', { users: [this.user] })
+			await this.$store.dispatch('chat/startCall', { channel })
 		}
 	}
 }

webapp/src/components/ColorPicker.vue

@@ -1,6 +1,6 @@
 <template lang="pug">
 .c-color-picker
-	.color(:style="{'--color': value}")
+	.color(:style="{ '--color': value }")
 	bunt-input(v-bind="$attrs", :value="value", @input="$emit('input', $event)")
 
 	input.color-picker(type="color", :value="value", @change="$emit('input', $event.target.value)")

webapp/src/components/ContactExhibitorPrompt.vue

@@ -6,7 +6,7 @@ prompt.c-contact-exhibitor-prompt(@close="cancel", :allowCancel="false")
 		template(v-if="timer > 0")
 			.timer-explanation {{ $t('ContactRequest:request:text') }}
 			.timer
-				svg.timer-ring(:style="{'--timer': 1 - timer / 30}")
+				svg.timer-ring(:style="{ '--timer': 1 - timer / 30 }")
 					circle(cx="75.5", cy="75.5", r="60")
 				.timer-text {{ timer }}s
 		.timer-explanation(v-else) {{ $t('ContactRequest:timeout:text') }}
@@ -31,7 +31,7 @@ export default {
 	async created() {
 		// TODO error handling
 		this.tickTimer()
-		this.request = (await api.call('exhibition.contact', {exhibitor: this.exhibitor.id})).contact_request
+		this.request = (await api.call('exhibition.contact', { exhibitor: this.exhibitor.id })).contact_request
 	},
 	beforeDestroy() {
 		clearTimeout(this.ticker)
@@ -42,11 +42,11 @@ export default {
 				this.timer--
 				this.ticker = setTimeout(this.tickTimer, 1000)
 			} else {
-				await api.call('exhibition.contact_cancel', {contact_request: this.request.id})
+				await api.call('exhibition.contact_cancel', { contact_request: this.request.id })
 			}
 		},
 		async cancel() {
-			if (this.timer > 0) await api.call('exhibition.contact_cancel', {contact_request: this.request.id})
+			if (this.timer > 0) await api.call('exhibition.contact_cancel', { contact_request: this.request.id })
 			this.$emit('close')
 		},
 	}

webapp/src/components/CopyableText.vue

@@ -2,7 +2,7 @@
 .c-copyable-text(@click="copy")
 	.text {{ text }}
 	.mdi.mdi-content-copy
-	.copy-success(v-if="copied", v-tooltip="{text: 'Copied!', show: true, placement: 'top', fixed: true}")
+	.copy-success(v-if="copied", v-tooltip="{ text: 'Copied!', show: true, placement: 'top', fixed: true }")
 </template>
 <script>
 export default {

webapp/src/components/CreateChatPrompt.vue

@@ -10,11 +10,11 @@ prompt.c-create-chat-prompt(@close="$emit('close')")
 					.label {{ option.label }}
 			bunt-input(name="name", :label="$t('CreateChatPrompt:name:label')", :icon="selectedType.icon", :placeholder="$t('CreateChatPrompt:name:placeholder')", v-model="name")
 			bunt-input-outline-container(:label="$t('CreateChatPrompt:description:label')")
-				textarea(v-model="description", slot-scope="{focus, blur}", @focus="focus", @blur="blur")
+				textarea(v-model="description", slot-scope="{ focus, blur }", @focus="focus", @blur="blur")
 			bunt-button(type="submit", :loading="loading") {{ $t('CreateChatPrompt:submit:label') }}
 </template>
 <script>
-import {mapGetters} from 'vuex'
+import { mapGetters } from 'vuex'
 import Prompt from 'components/Prompt'
 
 export default {

webapp/src/components/CreateDmPrompt.vue

@@ -6,7 +6,7 @@ prompt.c-create-dm-prompt(:scrollable="false", @close="$emit('close')")
 		user-select(:button-label="$t('CreateDMPrompt:create-button:label')", @selected="create", :exclude="[this.user.id]")
 </template>
 <script>
-import {mapGetters, mapState} from 'vuex'
+import { mapGetters, mapState } from 'vuex'
 import Prompt from 'components/Prompt'
 import UserSelect from 'components/UserSelect'
 
@@ -24,7 +24,7 @@ export default {
 	methods: {
 		async create(users) {
 			// TODO error handling, progress
-			await this.$store.dispatch('chat/openDirectMessage', {users: users})
+			await this.$store.dispatch('chat/openDirectMessage', { users: users })
 			this.$emit('close')
 		}
 	}

webapp/src/components/CreateStagePrompt.vue

@@ -6,7 +6,7 @@ prompt.c-create-stage-prompt(@close="$emit('close')")
 			bunt-input(name="name", :label="$t('CreateStagePrompt:name:label')", icon="theater", :placeholder="$t('CreateStagePrompt:name:placeholder')", v-model="name", :validation="$v.name")
 			bunt-input(name="url", :label="$t('CreateStagePrompt:url:label')", icon="link", placeholder="https://example.com/stream.m3u8", v-model="url", :validation="$v.url")
 			bunt-input-outline-container(:label="$t('CreateChatPrompt:description:label')")
-				textarea(v-model="description", slot-scope="{focus, blur}", @focus="focus", @blur="blur")
+				textarea(v-model="description", slot-scope="{ focus, blur }", @focus="focus", @blur="blur")
 			bunt-button(type="submit", :loading="loading", :error-message="error") {{ $t('CreateStagePrompt:submit:label') }}
 </template>
 <script>

webapp/src/components/Exhibition.vue

@@ -23,7 +23,7 @@ export default {
 	},
 	computed: {},
 	async created() {
-		this.exhibitors = (await api.call('exhibition.list', {room: this.room.id})).exhibitors
+		this.exhibitors = (await api.call('exhibition.list', { room: this.room.id })).exhibitors
 	},
 	mounted() {
 		this.$nextTick(() => {

webapp/src/components/FeedbackPrompt.vue

@@ -5,7 +5,7 @@ prompt.c-feedback-prompt(@close="$emit('close')")
 		p {{ $t('FeedbackPrompt:intro:text') }}
 		form(@submit.prevent="submit")
 			bunt-input-outline-container(:label="$t('FeedbackPrompt:message:label')")
-				textarea(v-model="message", slot-scope="{focus, blur}", @focus="focus", @blur="blur")
+				textarea(v-model="message", slot-scope="{ focus, blur }", @focus="focus", @blur="blur")
 			p.privacy {{ $t('FeedbackPrompt:privacy:text') }}
 			bunt-button(type="submit", :loading="loading") {{ $t('FeedbackPrompt:submit:label') }}
 </template>

webapp/src/components/IframePage.vue

@@ -4,7 +4,7 @@
 	iframe-blocker(:src="url", allow="camera *; autoplay *; microphone *; fullscreen *; display-capture *", allowfullscreen, allowusermedia, @load="loaded")
 </template>
 <script>
-import {mapState} from 'vuex'
+import { mapState } from 'vuex'
 import IframeBlocker from './IframeBlocker'
 
 export default {
@@ -25,8 +25,8 @@ export default {
 
 		url() {
 			let url = this.module.config.url
-			url = url.replace('{display_name}', encodeURIComponent(this.user.profile.display_name))
-			url = url.replace('{id}', encodeURIComponent(this.user.id))
+			url = url.replace('{ display_name }', encodeURIComponent(this.user.profile.display_name))
+			url = url.replace('{ id }', encodeURIComponent(this.user.id))
 			return url
 		}
 	},

webapp/src/components/JanusCall.vue

@@ -8,7 +8,7 @@ import api from 'lib/api'
 import JanusConference from 'components/janus/JanusConference'
 
 export default {
-	components: {JanusConference},
+	components: { JanusConference },
 	props: {
 		room: {
 			type: Object,
@@ -41,7 +41,7 @@ export default {
 		this.loading = true
 		this.error = null
 		try {
-			const {server, roomId, token, sessionId, iceServers} = await api.call('januscall.room_url', {room: this.room.id})
+			const { server, roomId, token, sessionId, iceServers } = await api.call('januscall.room_url', { room: this.room.id })
 			if (!this.$el || this._isDestroyed) return
 			this.roomId = roomId
 			this.token = token

webapp/src/components/JanusChannelCall.vue

@@ -6,7 +6,7 @@
 import JanusVideoroom from 'components/janus/JanusVideoroom'
 
 export default {
-	components: {JanusVideoroom},
+	components: { JanusVideoroom },
 	props: {
 		call: {
 			type: Object,