diff options
Diffstat (limited to 'src/components/user_settings')
| -rw-r--r-- | src/components/user_settings/user_settings.js | 28 | ||||
| -rw-r--r-- | src/components/user_settings/user_settings.vue | 16 |
2 files changed, 42 insertions, 2 deletions
diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js index b6a0479d..dd931e67 100644 --- a/src/components/user_settings/user_settings.js +++ b/src/components/user_settings/user_settings.js @@ -1,6 +1,8 @@ import { compose } from 'vue-compose' 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' @@ -9,8 +11,10 @@ import fileSizeFormatService from '../../services/file_size_format/file_size_for import BlockCard from '../block_card/block_card.vue' import MuteCard from '../mute_card/mute_card.vue' import EmojiInput from '../emoji-input/emoji-input.vue' +import Autosuggest from '../autosuggest/autosuggest.vue' import withSubscription from '../../hocs/with_subscription/with_subscription' import withList from '../../hocs/with_list/with_list' +import userSearchApi from '../../services/new_api/user_search.js' const BlockList = compose( withSubscription({ @@ -73,7 +77,10 @@ const UserSettings = { ImageCropper, BlockList, MuteList, - EmojiInput + EmojiInput, + Autosuggest, + BlockCard, + MuteCard }, computed: { user () { @@ -334,6 +341,25 @@ const UserSettings = { 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 userSearchApi.search({query, store: this.$store}) + .then((users) => { + this.$store.dispatch('addNewUsers', users) + return map(users, 'id') + }) } } } diff --git a/src/components/user_settings/user_settings.vue b/src/components/user_settings/user_settings.vue index c08698dc..9d37ffc4 100644 --- a/src/components/user_settings/user_settings.vue +++ b/src/components/user_settings/user_settings.vue @@ -22,7 +22,7 @@ <div class="setting-item" > <h2>{{$t('settings.name_bio')}}</h2> <p>{{$t('settings.name')}}</p> - <EmojiInput + <EmojiInput type="text" v-model="newName" id="username" @@ -195,12 +195,22 @@ </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" :userId="row.item"/> + </Autosuggest> + </div> <block-list :refresh="true"> <template slot="empty">{{$t('settings.no_blocks')}}</template> </block-list> </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" :userId="row.item"/> + </Autosuggest> + </div> <mute-list :refresh="true"> <template slot="empty">{{$t('settings.no_mutes')}}</template> </mute-list> @@ -262,5 +272,9 @@ text-align: right; } } + + &-usersearch-wrapper { + padding: 1em; + } } </style> |