No OneTemporary
Actions

Size

33 KB

Referenced Files

None

Subscribers

None

View Options

	diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js
	index 3fdc534037..7f6e45cb6e 100644
	--- a/src/components/user_settings/user_settings.js
	+++ b/src/components/user_settings/user_settings.js
	@@ -1,374 +1,381 @@
	import unescape from 'lodash/unescape'
	import get from 'lodash/get'
	import map from 'lodash/map'
	import reject from 'lodash/reject'
	import TabSwitcher from '../tab_switcher/tab_switcher.js'
	import ImageCropper from '../image_cropper/image_cropper.vue'
	import StyleSwitcher from '../style_switcher/style_switcher.vue'
	import ScopeSelector from '../scope_selector/scope_selector.vue'
	import fileSizeFormatService from '../../services/file_size_format/file_size_format.js'
	import BlockCard from '../block_card/block_card.vue'
	import MuteCard from '../mute_card/mute_card.vue'
	import SelectableList from '../selectable_list/selectable_list.vue'
	import ProgressButton from '../progress_button/progress_button.vue'
	import EmojiInput from '../emoji_input/emoji_input.vue'
	import suggestor from '../emoji_input/suggestor.js'
	import Autosuggest from '../autosuggest/autosuggest.vue'
	import Importer from '../importer/importer.vue'
	import Exporter from '../exporter/exporter.vue'
	import withSubscription from '../../hocs/with_subscription/with_subscription'
	import Checkbox from '../checkbox/checkbox.vue'
	import Mfa from './mfa.vue'

	const BlockList = withSubscription({
	fetch: (props, $store) => $store.dispatch('fetchBlocks'),
	select: (props, $store) => get($store.state.users.currentUser, 'blockIds', []),
	childPropName: 'items'
	})(SelectableList)

	const MuteList = withSubscription({
	fetch: (props, $store) => $store.dispatch('fetchMutes'),
	select: (props, $store) => get($store.state.users.currentUser, 'muteIds', []),
	childPropName: 'items'
	})(SelectableList)

	+const DomainMuteList = withSubscription({
	+ fetch: (props, $store) => $store.dispatch('fetchDomainMutes'),
	+ select: (props, $store) => get($store.state.users.currentUser, 'domainMutes', []),
	+ childPropName: 'items'
	+})(SelectableList)
	+
	const UserSettings = {
	data () {
	return {
	newEmail: '',
	newName: this.$store.state.users.currentUser.name,
	newBio: unescape(this.$store.state.users.currentUser.description),
	newLocked: this.$store.state.users.currentUser.locked,
	newNoRichText: this.$store.state.users.currentUser.no_rich_text,
	newDefaultScope: this.$store.state.users.currentUser.default_scope,
	hideFollows: this.$store.state.users.currentUser.hide_follows,
	hideFollowers: this.$store.state.users.currentUser.hide_followers,
	hideFollowsCount: this.$store.state.users.currentUser.hide_follows_count,
	hideFollowersCount: this.$store.state.users.currentUser.hide_followers_count,
	showRole: this.$store.state.users.currentUser.show_role,
	role: this.$store.state.users.currentUser.role,
	discoverable: this.$store.state.users.currentUser.discoverable,
	pickAvatarBtnVisible: true,
	bannerUploading: false,
	backgroundUploading: false,
	banner: null,
	bannerPreview: null,
	background: null,
	backgroundPreview: null,
	bannerUploadError: null,
	backgroundUploadError: null,
	changeEmailError: false,
	changeEmailPassword: '',
	changedEmail: false,
	deletingAccount: false,
	deleteAccountConfirmPasswordInput: '',
	deleteAccountError: false,
	changePasswordInputs: [ '', '', '' ],
	changedPassword: false,
	changePasswordError: false,
	activeTab: 'profile',
	notificationSettings: this.$store.state.users.currentUser.notification_settings
	}
	},
	created () {
	this.$store.dispatch('fetchTokens')
	},
	components: {
	StyleSwitcher,
	ScopeSelector,
	TabSwitcher,
	ImageCropper,
	BlockList,
	MuteList,
	+ DomainMuteList,
	EmojiInput,
	Autosuggest,
	BlockCard,
	MuteCard,
	ProgressButton,
	Importer,
	Exporter,
	Mfa,
	Checkbox
	},
	computed: {
	user () {
	return this.$store.state.users.currentUser
	},
	emojiUserSuggestor () {
	return suggestor({
	emoji: [
	...this.$store.state.instance.emoji,
	...this.$store.state.instance.customEmoji
	],
	users: this.$store.state.users.users,
	updateUsersList: (input) => this.$store.dispatch('searchUsers', input)
	})
	},
	emojiSuggestor () {
	return suggestor({ emoji: [
	...this.$store.state.instance.emoji,
	...this.$store.state.instance.customEmoji
	] })
	},
	pleromaBackend () {
	return this.$store.state.instance.pleromaBackend
	},
	minimalScopesMode () {
	return this.$store.state.instance.minimalScopesMode
	},
	vis () {
	return {
	public: { selected: this.newDefaultScope === 'public' },
	unlisted: { selected: this.newDefaultScope === 'unlisted' },
	private: { selected: this.newDefaultScope === 'private' },
	direct: { selected: this.newDefaultScope === 'direct' }
	}
	},
	currentSaveStateNotice () {
	return this.$store.state.interface.settings.currentSaveStateNotice
	},
	oauthTokens () {
	return this.$store.state.oauthTokens.tokens.map(oauthToken => {
	return {
	id: oauthToken.id,
	appName: oauthToken.app_name,
	validUntil: new Date(oauthToken.valid_until).toLocaleDateString()
	}
	})
	}
	},
	methods: {
	updateProfile () {
	this.$store.state.api.backendInteractor
	.updateProfile({
	params: {
	note: this.newBio,
	locked: this.newLocked,
	// Backend notation.
	/* eslint-disable camelcase */
	display_name: this.newName,
	default_scope: this.newDefaultScope,
	no_rich_text: this.newNoRichText,
	hide_follows: this.hideFollows,
	hide_followers: this.hideFollowers,
	discoverable: this.discoverable,
	hide_follows_count: this.hideFollowsCount,
	hide_followers_count: this.hideFollowersCount,
	show_role: this.showRole
	/* eslint-enable camelcase */
	} }).then((user) => {
	this.$store.commit('addNewUsers', [user])
	this.$store.commit('setCurrentUser', user)
	})
	},
	updateNotificationSettings () {
	this.$store.state.api.backendInteractor
	.updateNotificationSettings({ settings: this.notificationSettings })
	},
	changeVis (visibility) {
	this.newDefaultScope = visibility
	},
	uploadFile (slot, e) {
	const file = e.target.files[0]
	if (!file) { return }
	if (file.size > this.$store.state.instance[slot + 'limit']) {
	const filesize = fileSizeFormatService.fileSizeFormat(file.size)
	const allowedsize = fileSizeFormatService.fileSizeFormat(this.$store.state.instance[slot + 'limit'])
	this[slot + 'UploadError'] = this.$t('upload.error.base') + ' ' + this.$t('upload.error.file_too_big', { filesize: filesize.num, filesizeunit: filesize.unit, allowedsize: allowedsize.num, allowedsizeunit: allowedsize.unit })
	return
	}
	// eslint-disable-next-line no-undef
	const reader = new FileReader()
	reader.onload = ({ target }) => {
	const img = target.result
	this[slot + 'Preview'] = img
	this[slot] = file
	}
	reader.readAsDataURL(file)
	},
	submitAvatar (cropper, file) {
	const that = this
	return new Promise((resolve, reject) => {
	function updateAvatar (avatar) {
	that.$store.state.api.backendInteractor.updateAvatar({ avatar })
	.then((user) => {
	that.$store.commit('addNewUsers', [user])
	that.$store.commit('setCurrentUser', user)
	resolve()
	})
	.catch((err) => {
	reject(new Error(that.$t('upload.error.base') + ' ' + err.message))
	})
	}

	if (cropper) {
	cropper.getCroppedCanvas().toBlob(updateAvatar, file.type)
	} else {
	updateAvatar(file)
	}
	})
	},
	clearUploadError (slot) {
	this[slot + 'UploadError'] = null
	},
	submitBanner () {
	if (!this.bannerPreview) { return }

	this.bannerUploading = true
	this.$store.state.api.backendInteractor.updateBanner({ banner: this.banner })
	.then((user) => {
	this.$store.commit('addNewUsers', [user])
	this.$store.commit('setCurrentUser', user)
	this.bannerPreview = null
	})
	.catch((err) => {
	this.bannerUploadError = this.$t('upload.error.base') + ' ' + err.message
	})
	.then(() => { this.bannerUploading = false })
	},
	submitBg () {
	if (!this.backgroundPreview) { return }
	let background = this.background
	this.backgroundUploading = true
	this.$store.state.api.backendInteractor.updateBg({ background }).then((data) => {
	if (!data.error) {
	this.$store.commit('addNewUsers', [data])
	this.$store.commit('setCurrentUser', data)
	this.backgroundPreview = null
	} else {
	this.backgroundUploadError = this.$t('upload.error.base') + data.error
	}
	this.backgroundUploading = false
	})
	},
	importFollows (file) {
	return this.$store.state.api.backendInteractor.importFollows(file)
	.then((status) => {
	if (!status) {
	throw new Error('failed')
	}
	})
	},
	importBlocks (file) {
	return this.$store.state.api.backendInteractor.importBlocks(file)
	.then((status) => {
	if (!status) {
	throw new Error('failed')
	}
	})
	},
	generateExportableUsersContent (users) {
	// Get addresses
	return users.map((user) => {
	// check is it's a local user
	if (user && user.is_local) {
	// append the instance address
	// eslint-disable-next-line no-undef
	return user.screen_name + '@' + location.hostname
	}
	return user.screen_name
	}).join('\n')
	},
	getFollowsContent () {
	return this.$store.state.api.backendInteractor.exportFriends({ id: this.$store.state.users.currentUser.id })
	.then(this.generateExportableUsersContent)
	},
	getBlocksContent () {
	return this.$store.state.api.backendInteractor.fetchBlocks()
	.then(this.generateExportableUsersContent)
	},
	confirmDelete () {
	this.deletingAccount = true
	},
	deleteAccount () {
	this.$store.state.api.backendInteractor.deleteAccount({ password: this.deleteAccountConfirmPasswordInput })
	.then((res) => {
	if (res.status === 'success') {
	this.$store.dispatch('logout')
	this.$router.push({ name: 'root' })
	} else {
	this.deleteAccountError = res.error
	}
	})
	},
	changePassword () {
	const params = {
	password: this.changePasswordInputs[0],
	newPassword: this.changePasswordInputs[1],
	newPasswordConfirmation: this.changePasswordInputs[2]
	}
	this.$store.state.api.backendInteractor.changePassword(params)
	.then((res) => {
	if (res.status === 'success') {
	this.changedPassword = true
	this.changePasswordError = false
	this.logout()
	} else {
	this.changedPassword = false
	this.changePasswordError = res.error
	}
	})
	},
	changeEmail () {
	const params = {
	email: this.newEmail,
	password: this.changeEmailPassword
	}
	this.$store.state.api.backendInteractor.changeEmail(params)
	.then((res) => {
	if (res.status === 'success') {
	this.changedEmail = true
	this.changeEmailError = false
	} else {
	this.changedEmail = false
	this.changeEmailError = res.error
	}
	})
	},
	activateTab (tabName) {
	this.activeTab = tabName
	},
	logout () {
	this.$store.dispatch('logout')
	this.$router.replace('/')
	},
	revokeToken (id) {
	if (window.confirm(`${this.$i18n.t('settings.revoke_token')}?`)) {
	this.$store.dispatch('revokeToken', id)
	}
	},
	filterUnblockedUsers (userIds) {
	return reject(userIds, (userId) => {
	const user = this.$store.getters.findUser(userId)
	return !user \|\| user.statusnet_blocking \|\| user.id === this.$store.state.users.currentUser.id
	})
	},
	filterUnMutedUsers (userIds) {
	return reject(userIds, (userId) => {
	const user = this.$store.getters.findUser(userId)
	return !user \|\| user.muted \|\| user.id === this.$store.state.users.currentUser.id
	})
	},
	queryUserIds (query) {
	return this.$store.dispatch('searchUsers', query)
	.then((users) => map(users, 'id'))
	},
	blockUsers (ids) {
	return this.$store.dispatch('blockUsers', ids)
	},
	unblockUsers (ids) {
	return this.$store.dispatch('unblockUsers', ids)
	},
	muteUsers (ids) {
	return this.$store.dispatch('muteUsers', ids)
	},
	unmuteUsers (ids) {
	return this.$store.dispatch('unmuteUsers', ids)
	},
	identity (value) {
	return value
	}
	}
	}

	export default UserSettings
	diff --git a/src/components/user_settings/user_settings.vue b/src/components/user_settings/user_settings.vue
	index 3f1982a6bb..52e225cdde 100644
	--- a/src/components/user_settings/user_settings.vue
	+++ b/src/components/user_settings/user_settings.vue
	@@ -1,646 +1,650 @@
	<template>
	<div class="settings panel panel-default">
	<div class="panel-heading">
	<div class="title">
	{{ $t('settings.user_settings') }}
	</div>
	<transition name="fade">
	<template v-if="currentSaveStateNotice">
	<div
	v-if="currentSaveStateNotice.error"
	class="alert error"
	@click.prevent
	>
	{{ $t('settings.saving_err') }}
	</div>

	<div
	v-if="!currentSaveStateNotice.error"
	class="alert transparent"
	@click.prevent
	>
	{{ $t('settings.saving_ok') }}
	</div>
	</template>
	</transition>
	</div>
	<div class="panel-body profile-edit">
	<tab-switcher>
	<div :label="$t('settings.profile_tab')">
	<div class="setting-item">
	<h2>{{ $t('settings.name_bio') }}</h2>
	<p>{{ $t('settings.name') }}</p>
	<EmojiInput
	v-model="newName"
	enable-emoji-picker
	:suggest="emojiSuggestor"
	>
	<input
	id="username"
	v-model="newName"
	classname="name-changer"
	>
	</EmojiInput>
	<p>{{ $t('settings.bio') }}</p>
	<EmojiInput
	v-model="newBio"
	enable-emoji-picker
	:suggest="emojiUserSuggestor"
	>
	<textarea
	v-model="newBio"
	classname="bio"
	/>
	</EmojiInput>
	<p>
	<Checkbox v-model="newLocked">
	{{ $t('settings.lock_account_description') }}
	</Checkbox>
	</p>
	<div>
	<label for="default-vis">{{ $t('settings.default_vis') }}</label>
	<div
	id="default-vis"
	class="visibility-tray"
	>
	<scope-selector
	:show-all="true"
	:user-default="newDefaultScope"
	:initial-scope="newDefaultScope"
	:on-scope-change="changeVis"
	/>
	</div>
	</div>
	<p>
	<Checkbox v-model="newNoRichText">
	{{ $t('settings.no_rich_text_description') }}
	</Checkbox>
	</p>
	<p>
	<Checkbox v-model="hideFollows">
	{{ $t('settings.hide_follows_description') }}
	</Checkbox>
	</p>
	<p class="setting-subitem">
	<Checkbox
	v-model="hideFollowsCount"
	:disabled="!hideFollows"
	>
	{{ $t('settings.hide_follows_count_description') }}
	</Checkbox>
	</p>
	<p>
	<Checkbox
	v-model="hideFollowers"
	>
	{{ $t('settings.hide_followers_description') }}
	</Checkbox>
	</p>
	<p class="setting-subitem">
	<Checkbox
	v-model="hideFollowersCount"
	:disabled="!hideFollowers"
	>
	{{ $t('settings.hide_followers_count_description') }}
	</Checkbox>
	</p>
	<p v-if="role === 'admin' \|\| role === 'moderator'">
	<Checkbox v-model="showRole">
	<template v-if="role === 'admin'">
	{{ $t('settings.show_admin_badge') }}
	</template>
	<template v-if="role === 'moderator'">
	{{ $t('settings.show_moderator_badge') }}
	</template>
	</Checkbox>
	</p>
	<p>
	<Checkbox v-model="discoverable">
	{{ $t('settings.discoverable') }}
	</Checkbox>
	</p>
	<button
	:disabled="newName && newName.length === 0"
	class="btn btn-default"
	@click="updateProfile"
	>
	{{ $t('general.submit') }}
	</button>
	</div>
	<div class="setting-item">
	<h2>{{ $t('settings.avatar') }}</h2>
	<p class="visibility-notice">
	{{ $t('settings.avatar_size_instruction') }}
	</p>
	<p>{{ $t('settings.current_avatar') }}</p>
	<img
	:src="user.profile_image_url_original"
	class="current-avatar"
	>
	<p>{{ $t('settings.set_new_avatar') }}</p>
	<button
	v-show="pickAvatarBtnVisible"
	id="pick-avatar"
	class="btn"
	type="button"
	>
	{{ $t('settings.upload_a_photo') }}
	</button>
	<image-cropper
	trigger="#pick-avatar"
	:submit-handler="submitAvatar"
	@open="pickAvatarBtnVisible=false"
	@close="pickAvatarBtnVisible=true"
	/>
	</div>
	<div class="setting-item">
	<h2>{{ $t('settings.profile_banner') }}</h2>
	<p>{{ $t('settings.current_profile_banner') }}</p>
	<img
	:src="user.cover_photo"
	class="banner"
	>
	<p>{{ $t('settings.set_new_profile_banner') }}</p>
	<img
	v-if="bannerPreview"
	class="banner"
	:src="bannerPreview"
	>
	<div>
	<input
	type="file"
	@change="uploadFile('banner', $event)"
	>
	</div>
	<i
	v-if="bannerUploading"
	class=" icon-spin4 animate-spin uploading"
	/>
	<button
	v-else-if="bannerPreview"
	class="btn btn-default"
	@click="submitBanner"
	>
	{{ $t('general.submit') }}
	</button>
	<div
	v-if="bannerUploadError"
	class="alert error"
	>
	Error: {{ bannerUploadError }}
	<i
	class="button-icon icon-cancel"
	@click="clearUploadError('banner')"
	/>
	</div>
	</div>
	<div class="setting-item">
	<h2>{{ $t('settings.profile_background') }}</h2>
	<p>{{ $t('settings.set_new_profile_background') }}</p>
	<img
	v-if="backgroundPreview"
	class="bg"
	:src="backgroundPreview"
	>
	<div>
	<input
	type="file"
	@change="uploadFile('background', $event)"
	>
	</div>
	<i
	v-if="backgroundUploading"
	class=" icon-spin4 animate-spin uploading"
	/>
	<button
	v-else-if="backgroundPreview"
	class="btn btn-default"
	@click="submitBg"
	>
	{{ $t('general.submit') }}
	</button>
	<div
	v-if="backgroundUploadError"
	class="alert error"
	>
	Error: {{ backgroundUploadError }}
	<i
	class="button-icon icon-cancel"
	@click="clearUploadError('background')"
	/>
	</div>
	</div>
	</div>

	<div :label="$t('settings.security_tab')">
	<div class="setting-item">
	<h2>{{ $t('settings.change_email') }}</h2>
	<div>
	<p>{{ $t('settings.new_email') }}</p>
	<input
	v-model="newEmail"
	type="email"
	autocomplete="email"
	>
	</div>
	<div>
	<p>{{ $t('settings.current_password') }}</p>
	<input
	v-model="changeEmailPassword"
	type="password"
	autocomplete="current-password"
	>
	</div>
	<button
	class="btn btn-default"
	@click="changeEmail"
	>
	{{ $t('general.submit') }}
	</button>
	<p v-if="changedEmail">
	{{ $t('settings.changed_email') }}
	</p>
	<template v-if="changeEmailError !== false">
	<p>{{ $t('settings.change_email_error') }}</p>
	<p>{{ changeEmailError }}</p>
	</template>
	</div>

	<div class="setting-item">
	<h2>{{ $t('settings.change_password') }}</h2>
	<div>
	<p>{{ $t('settings.current_password') }}</p>
	<input
	v-model="changePasswordInputs[0]"
	type="password"
	>
	</div>
	<div>
	<p>{{ $t('settings.new_password') }}</p>
	<input
	v-model="changePasswordInputs[1]"
	type="password"
	>
	</div>
	<div>
	<p>{{ $t('settings.confirm_new_password') }}</p>
	<input
	v-model="changePasswordInputs[2]"
	type="password"
	>
	</div>
	<button
	class="btn btn-default"
	@click="changePassword"
	>
	{{ $t('general.submit') }}
	</button>
	<p v-if="changedPassword">
	{{ $t('settings.changed_password') }}
	</p>
	<p v-else-if="changePasswordError !== false">
	{{ $t('settings.change_password_error') }}
	</p>
	<p v-if="changePasswordError">
	{{ changePasswordError }}
	</p>
	</div>

	<div class="setting-item">
	<h2>{{ $t('settings.oauth_tokens') }}</h2>
	<table class="oauth-tokens">
	<thead>
	<tr>
	<th>{{ $t('settings.app_name') }}</th>
	<th>{{ $t('settings.valid_until') }}</th>
	<th />
	</tr>
	</thead>
	<tbody>
	<tr
	v-for="oauthToken in oauthTokens"
	:key="oauthToken.id"
	>
	<td>{{ oauthToken.appName }}</td>
	<td>{{ oauthToken.validUntil }}</td>
	<td class="actions">
	<button
	class="btn btn-default"
	@click="revokeToken(oauthToken.id)"
	>
	{{ $t('settings.revoke_token') }}
	</button>
	</td>
	</tr>
	</tbody>
	</table>
	</div>
	<mfa />
	<div class="setting-item">
	<h2>{{ $t('settings.delete_account') }}</h2>
	<p v-if="!deletingAccount">
	{{ $t('settings.delete_account_description') }}
	</p>
	<div v-if="deletingAccount">
	<p>{{ $t('settings.delete_account_instructions') }}</p>
	<p>{{ $t('login.password') }}</p>
	<input
	v-model="deleteAccountConfirmPasswordInput"
	type="password"
	>
	<button
	class="btn btn-default"
	@click="deleteAccount"
	>
	{{ $t('settings.delete_account') }}
	</button>
	</div>
	<p v-if="deleteAccountError !== false">
	{{ $t('settings.delete_account_error') }}
	</p>
	<p v-if="deleteAccountError">
	{{ deleteAccountError }}
	</p>
	<button
	v-if="!deletingAccount"
	class="btn btn-default"
	@click="confirmDelete"
	>
	{{ $t('general.submit') }}
	</button>
	</div>
	</div>

	<div
	v-if="pleromaBackend"
	:label="$t('settings.notifications')"
	>
	<div class="setting-item">
	<div class="select-multiple">
	<span class="label">{{ $t('settings.notification_setting') }}</span>
	<ul class="option-list">
	<li>
	<Checkbox v-model="notificationSettings.follows">
	{{ $t('settings.notification_setting_follows') }}
	</Checkbox>
	</li>
	<li>
	<Checkbox v-model="notificationSettings.followers">
	{{ $t('settings.notification_setting_followers') }}
	</Checkbox>
	</li>
	<li>
	<Checkbox v-model="notificationSettings.non_follows">
	{{ $t('settings.notification_setting_non_follows') }}
	</Checkbox>
	</li>
	<li>
	<Checkbox v-model="notificationSettings.non_followers">
	{{ $t('settings.notification_setting_non_followers') }}
	</Checkbox>
	</li>
	</ul>
	</div>
	<p>{{ $t('settings.notification_mutes') }}</p>
	<p>{{ $t('settings.notification_blocks') }}</p>
	<button
	class="btn btn-default"
	@click="updateNotificationSettings"
	>
	{{ $t('general.submit') }}
	</button>
	</div>
	</div>

	<div
	v-if="pleromaBackend"
	:label="$t('settings.data_import_export_tab')"
	>
	<div class="setting-item">
	<h2>{{ $t('settings.follow_import') }}</h2>
	<p>{{ $t('settings.import_followers_from_a_csv_file') }}</p>
	<Importer
	:submit-handler="importFollows"
	:success-message="$t('settings.follows_imported')"
	:error-message="$t('settings.follow_import_error')"
	/>
	</div>
	<div class="setting-item">
	<h2>{{ $t('settings.follow_export') }}</h2>
	<Exporter
	:get-content="getFollowsContent"
	filename="friends.csv"
	:export-button-label="$t('settings.follow_export_button')"
	/>
	</div>
	<div class="setting-item">
	<h2>{{ $t('settings.block_import') }}</h2>
	<p>{{ $t('settings.import_blocks_from_a_csv_file') }}</p>
	<Importer
	:submit-handler="importBlocks"
	:success-message="$t('settings.blocks_imported')"
	:error-message="$t('settings.block_import_error')"
	/>
	</div>
	<div class="setting-item">
	<h2>{{ $t('settings.block_export') }}</h2>
	<Exporter
	:get-content="getBlocksContent"
	filename="blocks.csv"
	:export-button-label="$t('settings.block_export_button')"
	/>
	</div>
	</div>

	<div :label="$t('settings.blocks_tab')">
	<div class="profile-edit-usersearch-wrapper">
	<Autosuggest
	:filter="filterUnblockedUsers"
	:query="queryUserIds"
	:placeholder="$t('settings.search_user_to_block')"
	>
	<BlockCard
	slot-scope="row"
	:user-id="row.item"
	/>
	</Autosuggest>
	</div>
	<BlockList
	:refresh="true"
	:get-key="identity"
	>
	<template
	slot="header"
	slot-scope="{selected}"
	>
	<div class="profile-edit-bulk-actions">
	<ProgressButton
	v-if="selected.length > 0"
	class="btn btn-default"
	:click="() => blockUsers(selected)"
	>
	{{ $t('user_card.block') }}
	<template slot="progress">
	{{ $t('user_card.block_progress') }}
	</template>
	</ProgressButton>
	<ProgressButton
	v-if="selected.length > 0"
	class="btn btn-default"
	:click="() => unblockUsers(selected)"
	>
	{{ $t('user_card.unblock') }}
	<template slot="progress">
	{{ $t('user_card.unblock_progress') }}
	</template>
	</ProgressButton>
	</div>
	</template>
	<template
	slot="item"
	slot-scope="{item}"
	>
	<BlockCard :user-id="item" />
	</template>
	<template slot="empty">
	{{ $t('settings.no_blocks') }}
	</template>
	</BlockList>
	</div>

	<div :label="$t('settings.mutes_tab')">
	<div class="profile-edit-usersearch-wrapper">
	<Autosuggest
	:filter="filterUnMutedUsers"
	:query="queryUserIds"
	:placeholder="$t('settings.search_user_to_mute')"
	>
	<MuteCard
	slot-scope="row"
	:user-id="row.item"
	/>
	</Autosuggest>
	</div>
	<MuteList
	:refresh="true"
	:get-key="identity"
	>
	<template
	slot="header"
	slot-scope="{selected}"
	>
	<div class="profile-edit-bulk-actions">
	<ProgressButton
	v-if="selected.length > 0"
	class="btn btn-default"
	:click="() => muteUsers(selected)"
	>
	{{ $t('user_card.mute') }}
	<template slot="progress">
	{{ $t('user_card.mute_progress') }}
	</template>
	</ProgressButton>
	<ProgressButton
	v-if="selected.length > 0"
	class="btn btn-default"
	:click="() => unmuteUsers(selected)"
	>
	{{ $t('user_card.unmute') }}
	<template slot="progress">
	{{ $t('user_card.unmute_progress') }}
	</template>
	</ProgressButton>
	</div>
	</template>
	<template
	slot="item"
	slot-scope="{item}"
	>
	<MuteCard :user-id="item" />
	</template>
	<template slot="empty">
	{{ $t('settings.no_mutes') }}
	</template>
	</MuteList>
	</div>
	+
	+ <div label="Domain Mutes">
	+
	+ </div>
	</tab-switcher>
	</div>
	</div>
	</template>

	<script src="./user_settings.js">
	</script>

	<style lang="scss">
	@import '../../_variables.scss';

	.profile-edit {
	.bio {
	margin: 0;
	}

	.visibility-tray {
	padding-top: 5px;
	}

	input[type=file] {
	padding: 5px;
	height: auto;
	}

	.banner {
	max-width: 100%;
	}

	.uploading {
	font-size: 1.5em;
	margin: 0.25em;
	}

	.name-changer {
	width: 100%;
	}

	.bg {
	max-width: 100%;
	}

	.current-avatar {
	display: block;
	width: 150px;
	height: 150px;
	border-radius: $fallback--avatarRadius;
	border-radius: var(--avatarRadius, $fallback--avatarRadius);
	}

	.oauth-tokens {
	width: 100%;

	th {
	text-align: left;
	}

	.actions {
	text-align: right;
	}
	}

	&-usersearch-wrapper {
	padding: 1em;
	}

	&-bulk-actions {
	text-align: right;
	padding: 0 1em;
	min-height: 28px;

	button {
	width: 10em;
	}
	}

	.setting-subitem {
	margin-left: 1.75em;
	}
	}
	</style>

File Metadata

Mime Type: text/x-diff
Expires: Sun, Aug 9, 11:14 AM (1 d, 11 h)
Storage Engine: blob
Storage Format: Raw Data
Storage Handle: 1724488
Default Alt Text: (33 KB)

No OneTemporaryActions

View Options

File Metadata

Event Timeline

No OneTemporary
Actions