From 6184c88ac70b33e66a87222142344f693406bd87 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Sun, 3 Mar 2019 15:15:41 +0200 Subject: Initial work on deprecating scopeModesEnabled in favor of minimalScopeMode --- src/components/user_settings/user_settings.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) (limited to 'src/components/user_settings/user_settings.js') diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js index d6972737..1911ab23 100644 --- a/src/components/user_settings/user_settings.js +++ b/src/components/user_settings/user_settings.js @@ -4,6 +4,7 @@ import get from 'lodash/get' 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' @@ -66,6 +67,7 @@ const UserSettings = { }, components: { StyleSwitcher, + ScopeSelector, TabSwitcher, ImageCropper, BlockList, @@ -78,8 +80,8 @@ const UserSettings = { pleromaBackend () { return this.$store.state.instance.pleromaBackend }, - scopeOptionsEnabled () { - return this.$store.state.instance.scopeOptionsEnabled + scopeOptionsMinimal () { + return this.$store.state.instance.scopeOptionsMinimal }, vis () { return { -- cgit v1.2.3-70-g09d2 From 4dc64438e929169770347c8868daa1e1c907290e Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Sat, 30 Mar 2019 12:41:42 +0200 Subject: aaaaggghh --- BREAKING_CHANGES.md | 4 ++-- src/components/features_panel/features_panel.js | 2 +- src/components/post_status_form/post_status_form.js | 4 ++-- src/components/user_settings/user_settings.js | 4 ++-- 4 files changed, 7 insertions(+), 7 deletions(-) (limited to 'src/components/user_settings/user_settings.js') diff --git a/BREAKING_CHANGES.md b/BREAKING_CHANGES.md index 45f7c74b..924c38da 100644 --- a/BREAKING_CHANGES.md +++ b/BREAKING_CHANGES.md @@ -1,7 +1,7 @@ # v1.0 ## Removed features/radically changed behavior -### scopeOptionsMinimal -As of !633, `scopeOptions` is no longer available and instead is changed for `scopeOptionsMinimal` (default: `false`) +### minimalScopesMode +As of !633, `scopeOptions` is no longer available and instead is changed for `minimalScopesMode` (default: `false`) Reasoning is that scopeOptions option originally existed mostly as a backwards-compatibility with GNU Social which only had `public` scope available and using scope selector would''t work. Since at some point we dropped GNU Social support, this option was mostly a nuisance (being default `false`'), however some people think scopes are an annoyance to a certain degree and want as less of that feature as possible. diff --git a/src/components/features_panel/features_panel.js b/src/components/features_panel/features_panel.js index 0a7234cc..5f0b7b25 100644 --- a/src/components/features_panel/features_panel.js +++ b/src/components/features_panel/features_panel.js @@ -6,7 +6,7 @@ const FeaturesPanel = { gopher: function () { return this.$store.state.instance.gopherAvailable }, whoToFollow: function () { return this.$store.state.instance.suggestionsEnabled }, mediaProxy: function () { return this.$store.state.instance.mediaProxyAvailable }, - scopeOptionsMinimal: function () { return this.$store.state.instance.scopeOptionsMinimal }, + minimalScopesMode: function () { return this.$store.state.instance.minimalScopesMode }, textlimit: function () { return this.$store.state.instance.textlimit } } } diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js index 499cbbfb..40e2610e 100644 --- a/src/components/post_status_form/post_status_form.js +++ b/src/components/post_status_form/post_status_form.js @@ -162,8 +162,8 @@ const PostStatusForm = { isOverLengthLimit () { return this.hasStatusLengthLimit && (this.charactersLeft < 0) }, - scopeOptionsMinimal () { - return this.$store.state.instance.scopeOptionsMinimal + minimalScopesMode () { + return this.$store.state.instance.minimalScopesMode }, alwaysShowSubject () { if (typeof this.$store.state.config.alwaysShowSubjectInput !== 'undefined') { diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js index 4b277b6c..b6a0479d 100644 --- a/src/components/user_settings/user_settings.js +++ b/src/components/user_settings/user_settings.js @@ -82,8 +82,8 @@ const UserSettings = { pleromaBackend () { return this.$store.state.instance.pleromaBackend }, - scopeOptionsMinimal () { - return this.$store.state.instance.scopeOptionsMinimal + minimalScopesMode () { + return this.$store.state.instance.minimalScopesMode }, vis () { return { -- cgit v1.2.3-70-g09d2 From da5844205c5e2ead4da42f89f1f9586683af693e Mon Sep 17 00:00:00 2001 From: taehoon Date: Tue, 2 Apr 2019 06:12:31 -0400 Subject: add user autosuggest component --- .../user_autosuggest/user_autosuggest.js | 41 ++++++++++ .../user_autosuggest/user_autosuggest.vue | 93 ++++++++++++++++++++++ src/components/user_settings/user_settings.js | 4 +- src/components/user_settings/user_settings.vue | 3 +- 4 files changed, 139 insertions(+), 2 deletions(-) create mode 100644 src/components/user_autosuggest/user_autosuggest.js create mode 100644 src/components/user_autosuggest/user_autosuggest.vue (limited to 'src/components/user_settings/user_settings.js') diff --git a/src/components/user_autosuggest/user_autosuggest.js b/src/components/user_autosuggest/user_autosuggest.js new file mode 100644 index 00000000..6612c2f3 --- /dev/null +++ b/src/components/user_autosuggest/user_autosuggest.js @@ -0,0 +1,41 @@ +import { VueAutosuggest } from 'vue-autosuggest' +import BasicUserCard from '../basic_user_card/basic_user_card.vue' +import userSearchApi from '../../services/new_api/user_search.js' + +export default { + components: { + VueAutosuggest, + BasicUserCard + }, + data () { + return { + results: [], + timeout: null, + selected: null, + debounceMilliseconds: 500, + inputProps: { + id: 'autosuggest__input', + onInputChange: this.fetchResults, + placeholder: 'Search...', + class: 'form-control' + }, + suggestions: [] + } + }, + methods: { + fetchResults (query) { + clearTimeout(this.timeout) + this.timeout = setTimeout(() => { + userSearchApi.search({query, store: this.$store}) + .then((data) => { this.suggestions = [{ data }] }) + }, this.debounceMilliseconds) + }, + clickHandler (item) { + return false + }, + clickUserHandler () { + console.log('clickUserHandler') + return false + } + } +} diff --git a/src/components/user_autosuggest/user_autosuggest.vue b/src/components/user_autosuggest/user_autosuggest.vue new file mode 100644 index 00000000..48fe350d --- /dev/null +++ b/src/components/user_autosuggest/user_autosuggest.vue @@ -0,0 +1,93 @@ + + + + + diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js index b6a0479d..d5772082 100644 --- a/src/components/user_settings/user_settings.js +++ b/src/components/user_settings/user_settings.js @@ -9,6 +9,7 @@ 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 UserAutoSuggest from '../user_autosuggest/user_autosuggest.vue' import withSubscription from '../../hocs/with_subscription/with_subscription' import withList from '../../hocs/with_list/with_list' @@ -73,7 +74,8 @@ const UserSettings = { ImageCropper, BlockList, MuteList, - EmojiInput + EmojiInput, + UserAutoSuggest }, computed: { user () { diff --git a/src/components/user_settings/user_settings.vue b/src/components/user_settings/user_settings.vue index c08698dc..d98a8eba 100644 --- a/src/components/user_settings/user_settings.vue +++ b/src/components/user_settings/user_settings.vue @@ -22,7 +22,7 @@

{{$t('settings.name_bio')}}

{{$t('settings.name')}}

-
+ -- cgit v1.2.3-70-g09d2 From 8410add39457ef075a14096fbcbceab24757588f Mon Sep 17 00:00:00 2001 From: taehoon Date: Tue, 2 Apr 2019 15:41:26 -0400 Subject: make UserAutoSuggest component more generic --- .../user_autosuggest/user_autosuggest.js | 33 +++++++++++----------- .../user_autosuggest/user_autosuggest.vue | 2 +- src/components/user_settings/user_settings.js | 16 +++++++++++ src/components/user_settings/user_settings.vue | 2 +- 4 files changed, 34 insertions(+), 19 deletions(-) (limited to 'src/components/user_settings/user_settings.js') diff --git a/src/components/user_autosuggest/user_autosuggest.js b/src/components/user_autosuggest/user_autosuggest.js index 75798b7e..6b95fc15 100644 --- a/src/components/user_autosuggest/user_autosuggest.js +++ b/src/components/user_autosuggest/user_autosuggest.js @@ -1,46 +1,45 @@ -import reject from 'lodash/reject' -import map from 'lodash/map' import BlockCard from '../block_card/block_card.vue' -import userSearchApi from '../../services/new_api/user_search.js' const debounceMilliseconds = 500 export default { + props: { + query: { // function to query results and return a promise + type: Function, + required: true + }, + filter: { // function to filter results in real time + type: Function + } + }, components: { BlockCard }, data () { return { - query: '', - results: [], + term: '', timeout: null, + results: [], resultsVisible: false } }, computed: { filtered () { - return reject(this.results, (userId) => { - const user = this.$store.getters.findUser(userId) - return !user || user.statusnet_blocking || user.id === this.$store.state.users.currentUser.id - }) + return this.filter ? this.filter(this.results) : this.results } }, watch: { - query (val) { + term (val) { this.fetchResults(val) } }, methods: { - fetchResults (query) { + fetchResults (term) { clearTimeout(this.timeout) this.timeout = setTimeout(() => { this.results = [] - if (query) { - userSearchApi.search({query, store: this.$store}) - .then((users) => { - this.$store.dispatch('addNewUsers', users) - this.results = map(users, 'id') - }) + if (term) { + this.query(term).then((results) => { this.results = results }) } }, debounceMilliseconds) }, diff --git a/src/components/user_autosuggest/user_autosuggest.vue b/src/components/user_autosuggest/user_autosuggest.vue index 930216a7..48cffc78 100644 --- a/src/components/user_autosuggest/user_autosuggest.vue +++ b/src/components/user_autosuggest/user_autosuggest.vue @@ -1,6 +1,6 @@ diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js index 259e3418..2cae2d00 100644 --- a/src/components/user_settings/user_settings.js +++ b/src/components/user_settings/user_settings.js @@ -78,7 +78,8 @@ const UserSettings = { BlockList, MuteList, EmojiInput, - UserAutoSuggest + UserAutoSuggest, + BlockCard }, computed: { user () { diff --git a/src/components/user_settings/user_settings.vue b/src/components/user_settings/user_settings.vue index 3dde5ae1..69d3dc53 100644 --- a/src/components/user_settings/user_settings.vue +++ b/src/components/user_settings/user_settings.vue @@ -196,7 +196,9 @@
- + + +
-- cgit v1.2.3-70-g09d2 From 0bdb0e5a8124508edff12a265174bd51a09c37e6 Mon Sep 17 00:00:00 2001 From: taehoon Date: Tue, 2 Apr 2019 16:10:03 -0400 Subject: rename Autosuggest component --- src/components/autosuggest/autosuggest.js | 52 ++++++++++++++++++++++ src/components/autosuggest/autosuggest.vue | 46 +++++++++++++++++++ .../user_autosuggest/user_autosuggest.js | 52 ---------------------- .../user_autosuggest/user_autosuggest.vue | 46 ------------------- src/components/user_settings/user_settings.js | 4 +- src/components/user_settings/user_settings.vue | 4 +- 6 files changed, 102 insertions(+), 102 deletions(-) create mode 100644 src/components/autosuggest/autosuggest.js create mode 100644 src/components/autosuggest/autosuggest.vue delete mode 100644 src/components/user_autosuggest/user_autosuggest.js delete mode 100644 src/components/user_autosuggest/user_autosuggest.vue (limited to 'src/components/user_settings/user_settings.js') diff --git a/src/components/autosuggest/autosuggest.js b/src/components/autosuggest/autosuggest.js new file mode 100644 index 00000000..d4efe912 --- /dev/null +++ b/src/components/autosuggest/autosuggest.js @@ -0,0 +1,52 @@ +const debounceMilliseconds = 500 + +export default { + props: { + query: { // function to query results and return a promise + type: Function, + required: true + }, + filter: { // function to filter results in real time + type: Function + }, + placeholder: { + type: String, + default: 'Search...' + } + }, + data () { + return { + term: '', + timeout: null, + results: [], + resultsVisible: false + } + }, + computed: { + filtered () { + return this.filter ? this.filter(this.results) : this.results + } + }, + watch: { + term (val) { + this.fetchResults(val) + } + }, + methods: { + fetchResults (term) { + clearTimeout(this.timeout) + this.timeout = setTimeout(() => { + this.results = [] + if (term) { + this.query(term).then((results) => { this.results = results }) + } + }, debounceMilliseconds) + }, + onInputClick () { + this.resultsVisible = true + }, + onClickOutside () { + this.resultsVisible = false + } + } +} diff --git a/src/components/autosuggest/autosuggest.vue b/src/components/autosuggest/autosuggest.vue new file mode 100644 index 00000000..ae1e312d --- /dev/null +++ b/src/components/autosuggest/autosuggest.vue @@ -0,0 +1,46 @@ + + + + + diff --git a/src/components/user_autosuggest/user_autosuggest.js b/src/components/user_autosuggest/user_autosuggest.js deleted file mode 100644 index d4efe912..00000000 --- a/src/components/user_autosuggest/user_autosuggest.js +++ /dev/null @@ -1,52 +0,0 @@ -const debounceMilliseconds = 500 - -export default { - props: { - query: { // function to query results and return a promise - type: Function, - required: true - }, - filter: { // function to filter results in real time - type: Function - }, - placeholder: { - type: String, - default: 'Search...' - } - }, - data () { - return { - term: '', - timeout: null, - results: [], - resultsVisible: false - } - }, - computed: { - filtered () { - return this.filter ? this.filter(this.results) : this.results - } - }, - watch: { - term (val) { - this.fetchResults(val) - } - }, - methods: { - fetchResults (term) { - clearTimeout(this.timeout) - this.timeout = setTimeout(() => { - this.results = [] - if (term) { - this.query(term).then((results) => { this.results = results }) - } - }, debounceMilliseconds) - }, - onInputClick () { - this.resultsVisible = true - }, - onClickOutside () { - this.resultsVisible = false - } - } -} diff --git a/src/components/user_autosuggest/user_autosuggest.vue b/src/components/user_autosuggest/user_autosuggest.vue deleted file mode 100644 index 6eaecbaa..00000000 --- a/src/components/user_autosuggest/user_autosuggest.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - - diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js index 2cae2d00..a0dfbc67 100644 --- a/src/components/user_settings/user_settings.js +++ b/src/components/user_settings/user_settings.js @@ -11,7 +11,7 @@ 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 UserAutoSuggest from '../user_autosuggest/user_autosuggest.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' @@ -78,7 +78,7 @@ const UserSettings = { BlockList, MuteList, EmojiInput, - UserAutoSuggest, + Autosuggest, BlockCard }, computed: { diff --git a/src/components/user_settings/user_settings.vue b/src/components/user_settings/user_settings.vue index 69d3dc53..d79abd0f 100644 --- a/src/components/user_settings/user_settings.vue +++ b/src/components/user_settings/user_settings.vue @@ -196,9 +196,9 @@
- + - +
-- cgit v1.2.3-70-g09d2 From d58e08cf52c5953914f0bf1b6c9fb120168c6160 Mon Sep 17 00:00:00 2001 From: taehoon Date: Tue, 2 Apr 2019 16:14:45 -0400 Subject: add search to the mutes tab as well --- src/components/user_settings/user_settings.js | 9 ++++++++- src/components/user_settings/user_settings.vue | 5 +++++ 2 files changed, 13 insertions(+), 1 deletion(-) (limited to 'src/components/user_settings/user_settings.js') diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js index a0dfbc67..dd931e67 100644 --- a/src/components/user_settings/user_settings.js +++ b/src/components/user_settings/user_settings.js @@ -79,7 +79,8 @@ const UserSettings = { MuteList, EmojiInput, Autosuggest, - BlockCard + BlockCard, + MuteCard }, computed: { user () { @@ -347,6 +348,12 @@ const UserSettings = { 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) => { diff --git a/src/components/user_settings/user_settings.vue b/src/components/user_settings/user_settings.vue index d79abd0f..8fcf4c07 100644 --- a/src/components/user_settings/user_settings.vue +++ b/src/components/user_settings/user_settings.vue @@ -206,6 +206,11 @@
+
+ + + +
-- cgit v1.2.3-70-g09d2 From 1cec2b696952ef2c472219329961bc102ed315df Mon Sep 17 00:00:00 2001 From: taehoon Date: Wed, 3 Apr 2019 22:17:42 -0400 Subject: use reusable List vue component instead of withList hoc Using slot is the preferred way in vue --- src/components/list/list.vue | 28 ++++++++++++++++++++++++++ src/components/user_settings/user_settings.js | 27 ++++++++++--------------- src/components/user_settings/user_settings.vue | 14 +++++++++---- 3 files changed, 49 insertions(+), 20 deletions(-) create mode 100644 src/components/list/list.vue (limited to 'src/components/user_settings/user_settings.js') diff --git a/src/components/list/list.vue b/src/components/list/list.vue new file mode 100644 index 00000000..f361e3b1 --- /dev/null +++ b/src/components/list/list.vue @@ -0,0 +1,28 @@ + + + + + diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js index dd931e67..057d1cec 100644 --- a/src/components/user_settings/user_settings.js +++ b/src/components/user_settings/user_settings.js @@ -10,29 +10,24 @@ 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 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({ - fetch: (props, $store) => $store.dispatch('fetchBlocks'), - select: (props, $store) => get($store.state.users.currentUser, 'blockIds', []), - childPropName: 'entries' - }), - withList({ getEntryProps: userId => ({ userId }) }) -)(BlockCard) +const BlockList = withSubscription({ + fetch: (props, $store) => $store.dispatch('fetchBlocks'), + select: (props, $store) => get($store.state.users.currentUser, 'blockIds', []), + childPropName: 'items' +})(List) -const MuteList = compose( - withSubscription({ - fetch: (props, $store) => $store.dispatch('fetchMutes'), - select: (props, $store) => get($store.state.users.currentUser, 'muteIds', []), - childPropName: 'entries' - }), - withList({ getEntryProps: userId => ({ userId }) }) -)(MuteCard) +const MuteList = withSubscription({ + fetch: (props, $store) => $store.dispatch('fetchMutes'), + select: (props, $store) => get($store.state.users.currentUser, 'muteIds', []), + childPropName: 'items' +})(List) const UserSettings = { data () { diff --git a/src/components/user_settings/user_settings.vue b/src/components/user_settings/user_settings.vue index 9d37ffc4..741fbe3f 100644 --- a/src/components/user_settings/user_settings.vue +++ b/src/components/user_settings/user_settings.vue @@ -200,9 +200,12 @@
- + + - +
@@ -211,9 +214,12 @@
- + + - +
-- cgit v1.2.3-70-g09d2 From 0bf451bb36c888fe98aa186239ba35d72e533cc7 Mon Sep 17 00:00:00 2001 From: taehoon Date: Wed, 3 Apr 2019 22:31:17 -0400 Subject: remove withList hoc --- src/components/user_profile/user_profile.js | 2 -- src/components/user_settings/user_settings.js | 2 -- src/hocs/with_list/with_list.js | 40 --------------------------- src/hocs/with_list/with_list.scss | 6 ---- 4 files changed, 50 deletions(-) delete mode 100644 src/hocs/with_list/with_list.js delete mode 100644 src/hocs/with_list/with_list.scss (limited to 'src/components/user_settings/user_settings.js') diff --git a/src/components/user_profile/user_profile.js b/src/components/user_profile/user_profile.js index 8dbf8dac..1ef247cd 100644 --- a/src/components/user_profile/user_profile.js +++ b/src/components/user_profile/user_profile.js @@ -1,4 +1,3 @@ -import { compose } from 'vue-compose' import get from 'lodash/get' import UserCard from '../user_card/user_card.vue' import FollowCard from '../follow_card/follow_card.vue' @@ -6,7 +5,6 @@ import Timeline from '../timeline/timeline.vue' import ModerationTools from '../moderation_tools/moderation_tools.vue' import List from '../list/list.vue' import withLoadMore from '../../hocs/with_load_more/with_load_more' -import withList from '../../hocs/with_list/with_list' const FollowerList = withLoadMore({ fetch: (props, $store) => $store.dispatch('fetchFollowers', props.userId), diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js index 057d1cec..2bbb01db 100644 --- a/src/components/user_settings/user_settings.js +++ b/src/components/user_settings/user_settings.js @@ -1,4 +1,3 @@ -import { compose } from 'vue-compose' import unescape from 'lodash/unescape' import get from 'lodash/get' import map from 'lodash/map' @@ -14,7 +13,6 @@ import List from '../list/list.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 = withSubscription({ diff --git a/src/hocs/with_list/with_list.js b/src/hocs/with_list/with_list.js deleted file mode 100644 index 896f8fc8..00000000 --- a/src/hocs/with_list/with_list.js +++ /dev/null @@ -1,40 +0,0 @@ -import Vue from 'vue' -import map from 'lodash/map' -import isEmpty from 'lodash/isEmpty' -import './with_list.scss' - -const defaultEntryPropsGetter = entry => ({ entry }) -const defaultKeyGetter = entry => entry.id - -const withList = ({ - getEntryProps = defaultEntryPropsGetter, // function to accept entry and index values and return props to be passed into the item component - getKey = defaultKeyGetter // funciton to accept entry and index values and return key prop value -}) => (ItemComponent) => ( - Vue.component('withList', { - props: [ - 'entries', // array of entry - 'entryProps', // additional props to be passed into each entry - 'entryListeners' // additional event listeners to be passed into each entry - ], - render (createElement) { - return ( -
- {map(this.entries, (entry, index) => { - const props = { - key: getKey(entry, index), - props: { - ...this.$props.entryProps, - ...getEntryProps(entry, index) - }, - on: this.$props.entryListeners - } - return - })} - {isEmpty(this.entries) && this.$slots.empty &&
{this.$slots.empty}
} -
- ) - } - }) -) - -export default withList diff --git a/src/hocs/with_list/with_list.scss b/src/hocs/with_list/with_list.scss deleted file mode 100644 index c6e13d5b..00000000 --- a/src/hocs/with_list/with_list.scss +++ /dev/null @@ -1,6 +0,0 @@ -.with-list { - &-empty-content { - text-align: center; - padding: 10px; - } -} \ No newline at end of file -- cgit v1.2.3-70-g09d2 From d9b3f5be4733f0eef4d3c8dff982224cd1a5303e Mon Sep 17 00:00:00 2001 From: taehoon Date: Wed, 3 Apr 2019 22:48:00 -0400 Subject: use SelectableList for blocks/mutes list --- src/components/selectable_list/selectable_list.js | 11 +++++------ src/components/selectable_list/selectable_list.vue | 18 +++++++++++++++--- src/components/user_settings/user_settings.js | 6 +++--- 3 files changed, 23 insertions(+), 12 deletions(-) (limited to 'src/components/user_settings/user_settings.js') diff --git a/src/components/selectable_list/selectable_list.js b/src/components/selectable_list/selectable_list.js index cd431eeb..138e63ab 100644 --- a/src/components/selectable_list/selectable_list.js +++ b/src/components/selectable_list/selectable_list.js @@ -4,12 +4,11 @@ const SelectableList = { components: { Checkbox }, - props: ['checked'], - data () { - }, - computed: { - }, - methods: { + props: { + items: { + type: Array, + default: () => [] + } } } diff --git a/src/components/selectable_list/selectable_list.vue b/src/components/selectable_list/selectable_list.vue index 11853672..2e0671ef 100644 --- a/src/components/selectable_list/selectable_list.vue +++ b/src/components/selectable_list/selectable_list.vue @@ -1,10 +1,22 @@ - + diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js index 2bbb01db..f8742cd4 100644 --- a/src/components/user_settings/user_settings.js +++ b/src/components/user_settings/user_settings.js @@ -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 () { -- cgit v1.2.3-70-g09d2 From 8fa639f252b20ddb550fe0cf71ba7ea2dfe47168 Mon Sep 17 00:00:00 2001 From: taehoon Date: Thu, 4 Apr 2019 13:30:34 -0400 Subject: add bulk action buttons --- src/components/user_settings/user_settings.js | 4 +++- src/components/user_settings/user_settings.vue | 26 ++++++++++++++++++++++++++ 2 files changed, 29 insertions(+), 1 deletion(-) (limited to 'src/components/user_settings/user_settings.js') diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js index f8742cd4..022c847b 100644 --- a/src/components/user_settings/user_settings.js +++ b/src/components/user_settings/user_settings.js @@ -10,6 +10,7 @@ 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 SelectableList from '../selectable_list/selectable_list.vue' +import ProgressButton from '../progress_button/progress_button.vue' import EmojiInput from '../emoji-input/emoji-input.vue' import Autosuggest from '../autosuggest/autosuggest.vue' import withSubscription from '../../hocs/with_subscription/with_subscription' @@ -73,7 +74,8 @@ const UserSettings = { EmojiInput, Autosuggest, BlockCard, - MuteCard + MuteCard, + ProgressButton }, computed: { user () { diff --git a/src/components/user_settings/user_settings.vue b/src/components/user_settings/user_settings.vue index e6100ced..8bce431a 100644 --- a/src/components/user_settings/user_settings.vue +++ b/src/components/user_settings/user_settings.vue @@ -201,6 +201,22 @@ + @@ -282,5 +298,15 @@ &-usersearch-wrapper { padding: 1em; } + + .bulk-actions-wrapper { + text-align: right; + padding: 0 1em; + min-height: 28px; + + button { + width: 10em; + } + } } -- cgit v1.2.3-70-g09d2 From 13c8f10f4b42c1d698bc99694cd3556c691ac880 Mon Sep 17 00:00:00 2001 From: taehoon Date: Thu, 4 Apr 2019 13:54:52 -0400 Subject: wire up bulk action buttons to vuex --- src/components/user_settings/user_settings.js | 6 +++++ src/components/user_settings/user_settings.vue | 4 +-- src/modules/users.js | 36 ++++++++++++++++++-------- 3 files changed, 33 insertions(+), 13 deletions(-) (limited to 'src/components/user_settings/user_settings.js') diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js index 022c847b..a9fe84b8 100644 --- a/src/components/user_settings/user_settings.js +++ b/src/components/user_settings/user_settings.js @@ -355,6 +355,12 @@ const UserSettings = { this.$store.dispatch('addNewUsers', users) return map(users, 'id') }) + }, + blockUsers (ids) { + return this.$store.dispatch('blockUsers', ids) + }, + unblockUsers (ids) { + return this.$store.dispatch('unblockUsers', ids) } } } diff --git a/src/components/user_settings/user_settings.vue b/src/components/user_settings/user_settings.vue index 8bce431a..5e0b71bf 100644 --- a/src/components/user_settings/user_settings.vue +++ b/src/components/user_settings/user_settings.vue @@ -203,13 +203,13 @@