use SelectableList for blocks/mutes list

This commit is contained in:
taehoon 2019-04-03 22:48:00 -04:00
parent 23b9d1eaa3
commit d9b3f5be47
3 changed files with 23 additions and 12 deletions

View file

@ -4,12 +4,11 @@ const SelectableList = {
components: {
Checkbox
},
props: ['checked'],
data () {
},
computed: {
},
methods: {
props: {
items: {
type: Array,
default: () => []
}
}
}

View file

@ -1,10 +1,22 @@
<template>
<div>
<Checkbox v-model="checked" />
<div class="selectable-list">
<div v-for="item in items">
<Checkbox v-model="checked" />
<slot name="item" :item="item" />
</div>
<div class="selectable-list-empty-content faint" v-if="items.length === 0">
<slot name="empty" />
</div>
</div>
</template>
<script src="./selectable_row.js"></script>
<script src="./selectable_list.js"></script>
<style lang="scss">
.selectable-list {
&-empty-content {
text-align: center;
padding: 10px;
}
}
</style>

View file

@ -9,7 +9,7 @@ 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 List from '../list/list.vue'
import SelectableList from '../selectable_list/selectable_list.vue'
import EmojiInput from '../emoji-input/emoji-input.vue'
import Autosuggest from '../autosuggest/autosuggest.vue'
import withSubscription from '../../hocs/with_subscription/with_subscription'
@ -19,13 +19,13 @@ const BlockList = withSubscription({
fetch: (props, $store) => $store.dispatch('fetchBlocks'),
select: (props, $store) => get($store.state.users.currentUser, 'blockIds', []),
childPropName: 'items'
})(List)
})(SelectableList)
const MuteList = withSubscription({
fetch: (props, $store) => $store.dispatch('fetchMutes'),
select: (props, $store) => get($store.state.users.currentUser, 'muteIds', []),
childPropName: 'items'
})(List)
})(SelectableList)
const UserSettings = {
data () {