Add local timeline
This commit is contained in:
parent
5a331819fe
commit
def184af24
6 changed files with 79 additions and 2 deletions
|
@ -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,
|
||||
|
|
1
src/assets/feather/server.svg
Normal file
1
src/assets/feather/server.svg
Normal 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 |
|
@ -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>
|
||||
|
|
|
@ -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",
|
||||
|
|
|
@ -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,
|
||||
|
|
52
src/views/PublicTimeline.vue
Normal file
52
src/views/PublicTimeline.vue
Normal 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>
|
Loading…
Reference in a new issue