-
Notifications
You must be signed in to change notification settings - Fork 5
Expand file tree
/
Copy pathposts.server.ts
More file actions
84 lines (74 loc) · 2.45 KB
/
Copy pathposts.server.ts
File metadata and controls
84 lines (74 loc) · 2.45 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
import { queryOptions } from '@tanstack/react-query'
import { notFound } from '@tanstack/react-router'
import { createServerFn } from '@tanstack/react-start'
import axios from 'redaxios'
export type PostType = {
id: string
title: string
body: string
}
export const fetchPosts = createServerFn({ method: 'GET' }).handler(
async () => {
console.info('Fetching posts...')
return axios
.get<Array<PostType>>('https://jsonplaceholder.typicode.com/posts')
.then((r) => r.data.slice(0, 10))
},
)
export const postsQueryOptions = () =>
queryOptions({
queryKey: ['posts'],
queryFn: () => fetchPosts(),
})
// Server function: paginated posts
export const fetchPostsPage = createServerFn({ method: 'GET' })
.inputValidator((data: { page: number; limit: number }) => data)
.handler(async ({ data }) => {
const { page, limit } = data
console.info(`Fetching posts page=${page} limit=${limit}...`)
const res = await axios.get<Array<PostType>>(
`https://jsonplaceholder.typicode.com/posts?_page=${page}&_limit=${limit}`,
)
return res.data
})
export const postsPageQueryOptions = (page: number, limit: number) =>
queryOptions({
queryKey: ['posts', 'page', { page, limit }],
queryFn: () => fetchPostsPage({ data: { page, limit } }),
})
export const fetchPost = createServerFn({ method: 'GET' })
.inputValidator((d: string) => d)
.handler(async ({ data }) => {
console.info(`Fetching post with id ${data}...`)
const post = await axios
.get<PostType>(`https://jsonplaceholder.typicode.com/posts/${data}`)
.then((r) => r.data)
.catch((err) => {
console.error(err)
if (err.status === 404) {
throw notFound()
}
throw err
})
return post
})
export const postQueryOptions = (postId: string) =>
queryOptions({
queryKey: ['post', postId],
queryFn: () => fetchPost({ data: postId }),
})
// Dependent query: posts by user
export const fetchPostsByUser = createServerFn({ method: 'GET' })
.inputValidator((userId: string) => userId)
.handler(async ({ data }) => {
console.info(`Fetching posts by user ${data}...`)
const res = await axios.get<Array<PostType>>(
`https://jsonplaceholder.typicode.com/posts?userId=${data}`,
)
return res.data
})
export const postsByUserQueryOptions = (userId: string) =>
queryOptions({
queryKey: ['posts', 'byUser', userId],
queryFn: () => fetchPostsByUser({ data: userId }),
})