From 18ae7bd5f366598d46a65e9da1312c98f7bb00e7 Mon Sep 17 00:00:00 2001
From: shpuld <shp@cock.li>
Date: Sun, 3 Feb 2019 11:58:49 +0200
Subject: [PATCH] Combine friends/followers
---
.../follow_list.js} | 23 +++----
src/components/follow_list/follow_list.vue | 33 ++++++++++
.../followers_list/followers_list.vue | 12 ----
src/components/friends_list/friends_list.js | 61 -------------------
src/components/friends_list/friends_list.vue | 12 ----
src/components/user_profile/user_profile.js | 6 +-
src/components/user_profile/user_profile.vue | 4 +-
src/i18n/en.json | 10 +--
src/i18n/fi.json | 4 +-
9 files changed, 58 insertions(+), 107 deletions(-)
rename src/components/{followers_list/followers_list.js => follow_list/follow_list.js} (69%)
create mode 100644 src/components/follow_list/follow_list.vue
delete mode 100644 src/components/followers_list/followers_list.vue
delete mode 100644 src/components/friends_list/friends_list.js
delete mode 100644 src/components/friends_list/friends_list.vue
diff --git a/src/components/followers_list/followers_list.js b/src/components/follow_list/follow_list.js
similarity index 69%
rename from src/components/followers_list/followers_list.js
rename to src/components/follow_list/follow_list.js
index 13aace18..6d00eb94 100644
--- a/src/components/followers_list/followers_list.js
+++ b/src/components/follow_list/follow_list.js
@@ -1,6 +1,6 @@
import UserCard from '../user_card/user_card.vue'
-const FollowersList = {
+const FollowList = {
data () {
return {
loading: false,
@@ -8,11 +8,11 @@ const FollowersList = {
error: false
}
},
- props: ['userId'],
+ props: ['userId', 'showFollowers'],
created () {
window.addEventListener('scroll', this.scrollLoad)
- if (this.user.followers.length === 0) {
- this.fetchFollowers()
+ if (this.entries.length === 0) {
+ this.fetchEntries()
}
},
destroyed () {
@@ -23,18 +23,19 @@ const FollowersList = {
user () {
return this.$store.getters.userById(this.userId)
},
- followers () {
- return this.user.followers
+ entries () {
+ return this.showFollowers ? this.user.followers : this.user.friends
}
},
methods: {
- fetchFollowers () {
+ fetchEntries () {
if (!this.loading) {
+ const command = this.showFollowers ? 'addFollowers' : 'addFriends'
this.loading = true
- this.$store.dispatch('addFollowers', this.userId).then(followers => {
+ this.$store.dispatch(command, this.userId).then(entries => {
this.error = false
this.loading = false
- this.bottomedOut = followers.length === 0
+ this.bottomedOut = entries.length === 0
}).catch(() => {
this.error = true
this.loading = false
@@ -49,7 +50,7 @@ const FollowersList = {
this.$el.offsetHeight > 0 &&
(window.innerHeight + window.pageYOffset) >= (height - 750)
) {
- this.fetchFollowers()
+ this.fetchEntries()
}
}
},
@@ -58,4 +59,4 @@ const FollowersList = {
}
}
-export default FollowersList
+export default FollowList
diff --git a/src/components/follow_list/follow_list.vue b/src/components/follow_list/follow_list.vue
new file mode 100644
index 00000000..24ab97d8
--- /dev/null
+++ b/src/components/follow_list/follow_list.vue
@@ -0,0 +1,33 @@
+<template>
+ <div class="follow-list">
+ <user-card
+ v-for="entry in entries"
+ :key="entry.id" :user="entry"
+ :showFollows="true"
+ />
+ <div class="text-center panel-footer">
+ <a v-if="error" @click="fetchEntries" class="alert error">
+ {{$t('general.generic_error')}}
+ </a>
+ <i v-else-if="loading" class="icon-spin3 animate-spin"/>
+ <span v-else-if="bottomedOut"></span>
+ <a v-else @click="fetchEntries">{{$t('general.more')}}</a>
+ </div>
+ </div>
+</template>
+
+<script src="./follow_list.js"></script>
+
+<style lang="scss">
+
+.follow-list {
+ .panel-footer {
+ padding: 10px;
+ }
+
+ .error {
+ font-size: 14px;
+ }
+}
+
+</style>
diff --git a/src/components/followers_list/followers_list.vue b/src/components/followers_list/followers_list.vue
deleted file mode 100644
index b6bd35e1..00000000
--- a/src/components/followers_list/followers_list.vue
+++ /dev/null
@@ -1,12 +0,0 @@
-<template>
- <div>
- <user-card v-for="follower in followers" :key="follower.id" :user="follower" :showFollows="true"></user-card>
- <div @click="fetchFollowers" class="new-status-notification text-center panel-footer">
- <span v-if="error" class="alert error">Error loading followers</span>
- <i v-else-if="loading" class="icon-spin3 animate-spin"/>
- <span v-else-if="bottomedOut"></span>
- </div>
- </div>
-</template>
-
-<script src="./followers_list.js" />
diff --git a/src/components/friends_list/friends_list.js b/src/components/friends_list/friends_list.js
deleted file mode 100644
index d5c1837a..00000000
--- a/src/components/friends_list/friends_list.js
+++ /dev/null
@@ -1,61 +0,0 @@
-import UserCard from '../user_card/user_card.vue'
-
-const FriendsList = {
- data () {
- return {
- loading: false,
- bottomedOut: false,
- error: false
- }
- },
- props: ['userId'],
- created () {
- window.addEventListener('scroll', this.scrollLoad)
- if (this.user.followers.length === 0) {
- this.fetchFriends()
- }
- },
- destroyed () {
- window.removeEventListener('scroll', this.scrollLoad)
- this.$store.dispatch('clearFriendsAndFollowers', this.userId)
- },
- computed: {
- user () {
- return this.$store.getters.userById(this.userId)
- },
- friends () {
- return this.user.friends
- }
- },
- methods: {
- fetchFriends () {
- if (!this.loading) {
- this.loading = true
- this.$store.dispatch('addFriends', this.userId).then(friends => {
- this.error = false
- this.loading = false
- this.bottomedOut = friends.length === 0
- }).catch(() => {
- this.error = true
- this.loading = false
- })
- }
- },
- scrollLoad (e) {
- const bodyBRect = document.body.getBoundingClientRect()
- const height = Math.max(bodyBRect.height, -(bodyBRect.y))
- if (this.loading === false &&
- this.bottomedOut === false &&
- this.$el.offsetHeight > 0 &&
- (window.innerHeight + window.pageYOffset) >= (height - 750)
- ) {
- this.fetchFriends()
- }
- }
- },
- components: {
- UserCard
- }
-}
-
-export default FriendsList
diff --git a/src/components/friends_list/friends_list.vue b/src/components/friends_list/friends_list.vue
deleted file mode 100644
index 75657cc8..00000000
--- a/src/components/friends_list/friends_list.vue
+++ /dev/null
@@ -1,12 +0,0 @@
-<template>
- <div>
- <user-card v-for="friend in friends" :key="friend.id" :user="friend" :showFollows="true"></user-card>
- <div @click="fetchFriends" class="new-status-notification text-center panel-footer">
- <span v-if="error" class="alert error">Error loading follows</span>
- <i v-else-if="loading" class="icon-spin3 animate-spin"/>
- <span v-else-if="bottomedOut"></span>
- </div>
- </div>
-</template>
-
-<script src="./friends_list.js" />
diff --git a/src/components/user_profile/user_profile.js b/src/components/user_profile/user_profile.js
index 0361d253..7b0ab705 100644
--- a/src/components/user_profile/user_profile.js
+++ b/src/components/user_profile/user_profile.js
@@ -1,8 +1,7 @@
import UserCardContent from '../user_card_content/user_card_content.vue'
import UserCard from '../user_card/user_card.vue'
import Timeline from '../timeline/timeline.vue'
-import FriendsList from '../friends_list/friends_list.vue'
-import FollowersList from '../followers_list/followers_list.vue'
+import FollowList from '../follow_list/follow_list.vue'
const UserProfile = {
created () {
@@ -102,8 +101,7 @@ const UserProfile = {
UserCardContent,
UserCard,
Timeline,
- FriendsList,
- FollowersList
+ FollowList
}
}
diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue
index c431c729..6d5b00d1 100644
--- a/src/components/user_profile/user_profile.vue
+++ b/src/components/user_profile/user_profile.vue
@@ -16,13 +16,13 @@
:user-id="fetchBy"
/>
<div :label="$t('user_card.followees')">
- <FriendsList v-if="user.friends_count > 0" :userId="userId" />
+ <FollowList v-if="user.friends_count > 0" :userId="userId" :showFollowers="false" />
<div class="userlist-placeholder" v-else>
<i class="icon-spin3 animate-spin"></i>
</div>
</div>
<div :label="$t('user_card.followers')">
- <FollowersList v-if="user.followers_count > 0" :userId="userId" />
+ <FollowList v-if="user.followers_count > 0" :userId="userId" :showFollowers="true" />
<div class="userlist-placeholder" v-else>
<i class="icon-spin3 animate-spin"></i>
</div>
diff --git a/src/i18n/en.json b/src/i18n/en.json
index d3b0e407..dc10fa7f 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -17,7 +17,9 @@
},
"general": {
"apply": "Apply",
- "submit": "Submit"
+ "submit": "Submit",
+ "more": "More",
+ "generic_error": "An error occured"
},
"login": {
"login": "Log in",
@@ -365,9 +367,9 @@
},
"upload":{
"error": {
- "base": "Upload failed.",
- "file_too_big": "File too big [{filesize}{filesizeunit} / {allowedsize}{allowedsizeunit}]",
- "default": "Try again later"
+ "base": "Upload failed.",
+ "file_too_big": "File too big [{filesize}{filesizeunit} / {allowedsize}{allowedsizeunit}]",
+ "default": "Try again later"
},
"file_size_units": {
"B": "B",
diff --git a/src/i18n/fi.json b/src/i18n/fi.json
index 0d62f295..5a0c1ea8 100644
--- a/src/i18n/fi.json
+++ b/src/i18n/fi.json
@@ -17,7 +17,9 @@
},
"general": {
"apply": "Aseta",
- "submit": "Lähetä"
+ "submit": "Lähetä",
+ "more": "Lisää",
+ "generic_error": "Virhe tapahtui"
},
"login": {
"login": "Kirjaudu sisään",