✌️

src/web/app/mobile/views/components/index.ts

@@ -18,6 +18,7 @@ import notifications from './notifications.vue';
 import notificationPreview from './notification-preview.vue';
 import usersList from './users-list.vue';
 import userPreview from './user-preview.vue';
+import userTimeline from './user-timeline.vue';
 
 Vue.component('mk-ui', ui);
 Vue.component('mk-home', home);
@@ -37,3 +38,4 @@ Vue.component('mk-notifications', notifications);
 Vue.component('mk-notification-preview', notificationPreview);
 Vue.component('mk-users-list', usersList);
 Vue.component('mk-user-preview', userPreview);
+Vue.component('mk-user-timeline', userTimeline);

src/web/app/mobile/views/components/timeline.vue

@@ -9,9 +9,9 @@
 			%fa:R comments%
 			%i18n:mobile.tags.mk-home-timeline.empty-timeline%
 		</div>
-		<button v-if="!fetching && posts.length != 0" @click="more" :disabled="fetching" slot="tail">
+		<button v-if="!fetching && existMore" @click="more" :disabled="moreFetching" slot="tail">
-			<span v-if="!fetching">%i18n:mobile.tags.mk-timeline.load-more%</span>
+			<span v-if="!moreFetching">%i18n:mobile.tags.mk-timeline.load-more%</span>
-			<span v-if="fetching">%i18n:common.loading%<mk-ellipsis/></span>
+			<span v-if="moreFetching">%i18n:common.loading%<mk-ellipsis/></span>
 		</button>
 	</mk-posts>
 </div>
@@ -19,6 +19,9 @@
 
 <script lang="ts">
 import Vue from 'vue';
+
+const limit = 10;
+
 export default Vue.extend({
 	props: {
 		date: {
@@ -31,6 +34,7 @@ export default Vue.extend({
 			fetching: true,
 			moreFetching: false,
 			posts: [],
+			existMore: false,
 			connection: null,
 			connectionId: null
 		};
@@ -59,10 +63,14 @@ export default Vue.extend({
 	methods: {
 		fetch(cb?) {
 			this.fetching = true;
-
 			(this as any).api('posts/timeline', {
+				limit: limit + 1,
 				until_date: this.date ? (this.date as any).getTime() : undefined
 			}).then(posts => {
+				if (posts.length == limit + 1) {
+					posts.pop();
+					this.existMore = true;
+				}
 				this.posts = posts;
 				this.fetching = false;
 				this.$emit('loaded');
@@ -70,11 +78,17 @@ export default Vue.extend({
 			});
 		},
 		more() {
-			if (this.moreFetching || this.fetching || this.posts.length == 0) return;
 			this.moreFetching = true;
 			(this as any).api('posts/timeline', {
+				limit: limit + 1,
 				until_id: this.posts[this.posts.length - 1].id
 			}).then(posts => {
+				if (posts.length == limit + 1) {
+					posts.pop();
+					this.existMore = true;
+				} else {
+					this.existMore = false;
+				}
 				this.posts = this.posts.concat(posts);
 				this.moreFetching = false;
 			});

src/web/app/mobile/views/components/user-timeline.vue

@@ -8,9 +8,9 @@
 			%fa:R comments%
 			{{ withMedia ? '%i18n:mobile.tags.mk-user-timeline.no-posts-with-media%' : '%i18n:mobile.tags.mk-user-timeline.no-posts%' }}
 		</div>
-		<button v-if="canFetchMore" @click="more" :disabled="fetching" slot="tail">
+		<button v-if="!fetching && existMore" @click="more" :disabled="moreFetching" slot="tail">
-			<span v-if="!fetching">%i18n:mobile.tags.mk-user-timeline.load-more%</span>
+			<span v-if="!moreFetching">%i18n:mobile.tags.mk-user-timeline.load-more%</span>
-			<span v-if="fetching">%i18n:common.loading%<mk-ellipsis/></span>
+			<span v-if="moreFetching">%i18n:common.loading%<mk-ellipsis/></span>
 		</button>
 	</mk-posts>
 </div>
@@ -18,23 +18,53 @@
 
 <script lang="ts">
 import Vue from 'vue';
+
+const limit = 10;
+
 export default Vue.extend({
 	props: ['user', 'withMedia'],
 	data() {
 		return {
 			fetching: true,
-			posts: []
+			posts: [],
+			existMore: false,
+			moreFetching: false
 		};
 	},
 	mounted() {
 		(this as any).api('users/posts', {
 			user_id: this.user.id,
-			with_media: this.withMedia
+			with_media: this.withMedia,
+			limit: limit + 1
 		}).then(posts => {
+			if (posts.length == limit + 1) {
+				posts.pop();
+				this.existMore = true;
+			}
 			this.posts = posts;
 			this.fetching = false;
 			this.$emit('loaded');
 		});
+	},
+	methods: {
+		more() {
+			this.moreFetching = true;
+			(this as any).api('users/posts', {
+				user_id: this.user.id,
+				with_media: this.withMedia,
+				limit: limit + 1,
+				until_id: this.posts[this.posts.length - 1].id
+			}).then(posts => {
+				if (posts.length == limit + 1) {
+					posts.pop();
+					this.existMore = true;
+				} else {
+					this.existMore = false;
+				}
+				this.posts = this.posts.concat(posts);
+				this.moreFetching = false;
+			});
+		}
 	}
 });
 </script>

src/web/app/mobile/views/pages/user.vue

@@ -66,15 +66,11 @@ export default Vue.extend({
 	components: {
 		XHome
 	},
-	props: {
-		page: {
-			default: 'home'
-		}
-	},
 	data() {
 		return {
 			fetching: true,
-			user: null
+			user: null,
+			page: 'home'
 		};
 	},
 	computed: {