Embedd timeline in profile page

Signed-off-by: Carl Schwan <carl@carlschwan.eu>

5 files changed, 98 insertions, 3 deletions

diff --git a/src/components/TimelineEntry.vue b/src/components/TimelineEntry.vue
index efa2af96..465359b3 100644
--- a/src/components/TimelineEntry.vue
+++ b/src/components/TimelineEntry.vue
@@ -11,7 +11,7 @@
 				<span class="icon-boost" />
 			</div>
 			<div class="boost">
-				<router-link v-if="item.actor_info" :to="{ name: 'profile', params: { account: item.local ? item.actor_info.preferredUsername : item.actor_info.account }}">
+				<router-link v-if="!isProfilePage && item.actor_info" :to="{ name: 'profile', params: { account: item.local ? item.actor_info.preferredUsername : item.actor_info.account }}">
 					<span v-tooltip.bottom="item.actor_info.account" class="post-author">
 						{{ userDisplayName(item.actor_info) }}
 					</span>
@@ -50,7 +50,14 @@ export default {
 		UserEntry
 	},
 	props: {
-		item: { type: Object, default: () => {} }
+		item: {
+			type: Object,
+			default: () => {}
+		},
+		isProfilePage: {
+			type: Boolean,
+			default: false,
+		},
 	},
 	data() {
 		return {
diff --git a/src/components/TimelinePost.vue b/src/components/TimelinePost.vue
index 7a85388a..eb07ff9d 100644
--- a/src/components/TimelinePost.vue
+++ b/src/components/TimelinePost.vue
@@ -32,7 +32,7 @@
 		<div v-if="hasAttachments" class="post-attachments">
 			<post-attachment :attachments="item.attachment" />
 		</div>
-		<div v-if="this.$route.params.type !== 'notifications' && !serverData.public" class="post-actions">
+		<div v-if="this.$route && this.$route.params.type !== 'notifications' && !serverData.public" class="post-actions">
 			<NcButton type="tertiary-no-background"
 				v-tooltip="t('social', 'Reply')"
 				@click="reply">
diff --git a/src/mixins/serverData.js b/src/mixins/serverData.js
index eff54329..42fd4a03 100644
--- a/src/mixins/serverData.js
+++ b/src/mixins/serverData.js
@@ -37,6 +37,9 @@ export default {
 		 * @property 		setup
 		 */
 		serverData() {
+			if (!this.$store) {
+				return {}
+			}
 			return this.$store.getters.getServerData
 		},
 		hostname() {
diff --git a/src/profile.js b/src/profile.js
new file mode 100644
index 00000000..d0066453
--- /dev/null
+++ b/src/profile.js
@@ -0,0 +1,26 @@
+// SPDX-FileCopyrigthText: 2022 Carl Schwan <carl@carlschwan.eu>
+// SPDX-License-Identifier: AGPL-3.0-or-later
+
+// eslint-disable-next-line
+__webpack_nonce__ = btoa(OC.requestToken)
+// eslint-disable-next-line
+__webpack_public_path__ = OC.linkTo('social', 'js/')
+
+import ProfilePageIntegration from './views/ProfilePageIntegration.vue' 
+import Vue from 'vue'
+import { sync } from 'vuex-router-sync'
+
+if (!OCA?.Core?.ProfileSections) {
+	exit();
+}
+
+Vue.prototype.t = t
+Vue.prototype.n = n
+Vue.prototype.OC = OC
+Vue.prototype.OCA = OCA
+
+const View = Vue.extend(ProfilePageIntegration)
+
+OCA.Core.ProfileSections.registerSection((el, userId) => {
+	return View
+})
diff --git a/src/views/ProfilePageIntegration.vue b/src/views/ProfilePageIntegration.vue
new file mode 100644
index 00000000..b2d083d6
--- /dev/null
+++ b/src/views/ProfilePageIntegration.vue
@@ -0,0 +1,59 @@
+<template>
+	<div>
+		<h2>Social</h2>
+		<transition-group name="list" tag="div">
+			<TimelineEntry v-for="entry in timeline" :key="entry.id" :item="entry" :isProfilePage="true" />
+		</transition-group>
+	</div>
+</template>
+
+<script>
+import ProfileInfo from './../components/ProfileInfo.vue'
+import TimelineEntry from './../components/TimelineEntry.vue'
+import axios from '@nextcloud/axios'
+import { generateUrl } from '@nextcloud/router'
+
+export default {
+	name: 'ProfilePageIntegration',
+	props: {
+		userId: {
+			type: String,
+			default: '',
+		},
+	},
+	data() {
+		return {
+			accountInfo: null,
+			timeline: [],
+		}
+	},
+	components: {
+		ProfileInfo,
+		TimelineEntry,
+	},
+	computed: {
+		getCount() {
+			let account = this.accountInfo
+			return (field) => account.details.count ? account.details.count[field] : ''
+		},
+	},
+	// Start fetching account information before mounting the component
+	beforeMount() {
+		let fetchMethod = 'fetchPublicAccountInfo'
+
+		let uid = this.userId
+
+		axios.get(generateUrl(`apps/social/api/v1/account/${uid}/info`)).then((response) => {
+			this.accountInfo = response.data.result.account
+			console.log(this.accountInfo)
+		})
+
+		const since = Math.floor(Date.now() / 1000) + 1
+
+		axios.get(generateUrl(`apps/social/api/v1/account/${uid}/stream?limit=25&since=${since}`)).then(({ data }) => {
+			console.log(this.timeline)
+			this.timeline = data.result
+		})
+	}
+}
+</script>