Add local timeline

This commit is contained in:
silverpill 2022-05-09 13:44:19 +00:00
parent 5a331819fe
commit def184af24
6 changed files with 79 additions and 2 deletions

View file

@ -82,6 +82,21 @@ export async function getHomeTimeline(
return data
}
export async function getPublicTimeline(
authToken: string,
maxId?: string,
): Promise<Post[]> {
const url = `${BACKEND_URL}/api/v1/timelines/public`
const queryParams = { max_id: maxId, limit: PAGE_SIZE }
const response = await http(url, {
method: "GET",
queryParams,
authToken,
})
const data = await response.json()
return data
}
export async function getTagTimeline(
authToken: string | null,
tagName: string,

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-server"><rect x="2" y="2" width="20" height="8" rx="2" ry="2"></rect><rect x="2" y="14" width="20" height="8" rx="2" ry="2"></rect><line x1="6" y1="6" x2="6.01" y2="6"></line><line x1="6" y1="18" x2="6.01" y2="18"></line></svg>

After

Width:  |  Height:  |  Size: 433 B

View file

@ -7,6 +7,10 @@
</div>
<span>Notifications</span>
</router-link>
<router-link class="sidebar-link" to="/local">
<div class="icon"><img :src="require('@/assets/feather/server.svg')"></div>
<span>Local</span>
</router-link>
<router-link class="sidebar-link" to="/profile-directory">
<div class="icon"><img :src="require('@/assets/feather/users.svg')"></div>
<span>Profile directory</span>

View file

@ -10,6 +10,7 @@ import ProfileView from "@/views/Profile.vue"
import ProfileForm from "@/views/ProfileForm.vue"
import PostDetail from "@/views/PostDetail.vue"
import PostOverlay from "@/views/PostOverlay.vue"
import PublicTimeline from "@/views/PublicTimeline.vue"
import TagTimeline from "@/views/TagTimeline.vue"
import SearchResultList from "@/views/SearchResultList.vue"
@ -56,6 +57,12 @@ const routes: Array<RouteRecordRaw> = [
component: HomeTimeline,
meta: { onlyAuthenticated: true },
},
{
path: "/local",
name: "local",
component: PublicTimeline,
meta: { onlyAuthenticated: true },
},
{
path: "/post/:postId",
name: "post",

View file

@ -12,7 +12,6 @@
import { Options, Vue, setup } from "vue-class-component"
import { Post, getHomeTimeline } from "@/api/posts"
import Avatar from "@/components/Avatar.vue"
import PostEditor from "@/components/PostEditor.vue"
import PostList from "@/components/PostList.vue"
import Sidebar from "@/components/Sidebar.vue"
@ -20,7 +19,6 @@ import { useCurrentUser } from "@/store/user"
@Options({
components: {
Avatar,
PostEditor,
PostList,
Sidebar,

View file

@ -0,0 +1,52 @@
<template>
<div id="main">
<div class="content posts">
<post-list :posts="posts" @load-next-page="loadNextPage"></post-list>
</div>
<sidebar></sidebar>
</div>
</template>
<script lang="ts">
import { Options, Vue, setup } from "vue-class-component"
import { Post, getPublicTimeline } from "@/api/posts"
import PostList from "@/components/PostList.vue"
import Sidebar from "@/components/Sidebar.vue"
import { useCurrentUser } from "@/store/user"
@Options({
components: {
PostList,
Sidebar,
},
})
export default class PublicTimeline extends Vue {
private store = setup(() => {
const { ensureAuthToken } = useCurrentUser()
return { ensureAuthToken }
})
posts: Post[] = []
async created() {
const authToken = this.store.ensureAuthToken()
this.posts = await getPublicTimeline(authToken)
}
insertPost(post: Post) {
this.posts = [post, ...this.posts]
}
async loadNextPage(maxId: string) {
const authToken = this.store.ensureAuthToken()
const posts = await getPublicTimeline(authToken, maxId)
this.posts.push(...posts)
}
}
</script>
<style scoped lang="scss">
</style>