投稿検索ページ（#206） (#274)

#206 エラー修正

#206 updated_at の並び順修正

Merge remote-tracking branch 'origin/main' into feature/206

Merge branch 'main' into feature/206

Merge branch 'main' into feature/206

Merge branch 'main' into feature/206

#206

#206

#206

#206

#206

#206 タグ補完追加

#206

#206

#206

#206

#206

Merge remote-tracking branch 'origin/main' into feature/206

#206

Co-authored-by: miteruzo <miteruzo@naver.com>
Reviewed-on: #274

frontend/src/lib/posts.ts

@@ -1,25 +1,28 @@
 import { apiDelete, apiGet, apiPost } from '@/lib/api'
 
-import type { Post, PostTagChange } from '@/types'
+import type { FetchPostsParams, Post, PostTagChange } from '@/types'
 
 
 export const fetchPosts = async (
-    { tags, match, page, limit, cursor }: {
-	tags:     string
-	match:    'any' | 'all'
-	page?:    number
-	limit?:   number
-	cursor?:  string }
+    { url, title, tags, match, createdFrom, createdTo, updatedFrom, updatedTo,
+      originalCreatedFrom, originalCreatedTo, page, limit, order }: FetchPostsParams
 ): Promise<{
-    posts:      Post[]
-    count:      number
-    nextCursor: string }> =>
+    posts:  Post[]
+    count:  number }> =>
 	await apiGet ('/posts', { params: {
-	    tags,
-	    match,
+	    ...(url && { url }),
+	    ...(title && { title }),
+	    ...(tags && { tags }),
+	    ...(match && { match }),
+	    ...(createdFrom && { created_from: createdFrom }),
+	    ...(createdTo && { created_to: createdTo }),
+	    ...(updatedFrom && { updated_from: updatedFrom }),
+	    ...(updatedTo && { updated_to: updatedTo }),
+	    ...(originalCreatedFrom && { original_created_from: originalCreatedFrom }),
+	    ...(originalCreatedTo && { original_created_to: originalCreatedTo }),
 	    ...(page && { page }),
 	    ...(limit && { limit }),
-	    ...(cursor && { cursor }) } })
+	    ...(order && { order }) } })
 
 
 export const fetchPost = async (id: string): Promise<Post> => await apiGet (`/posts/${ id }`)

frontend/src/lib/prefetchers.ts

@@ -8,6 +8,8 @@ import { fetchWikiPage,
 	 fetchWikiPageByTitle,
 	 fetchWikiPages } from '@/lib/wiki'
 
+import type { FetchPostsOrder } from '@/types'
+
 type Prefetcher = (qc: QueryClient, url: URL) => Promise<void>
 
 const mPost = match<{ id: string }> ('/posts/:id')
@@ -59,7 +61,20 @@ const prefetchWikiPageShow: Prefetcher = async (qc, url) => {
   if (version)
     return
 
-  const p = { tags: effectiveTitle, match: 'all', page: 1, limit: 8 } as const
+  const p = {
+      tags: effectiveTitle,
+      match: 'all',
+      page: 1,
+      limit: 8,
+      url: '',
+      title: '',
+      originalCreatedFrom: '',
+      originalCreatedTo: '',
+      createdFrom: '',
+      createdTo: '',
+      updatedFrom: '',
+      updatedTo: '',
+      order: 'original_created_at:desc' } as const
   await qc.prefetchQuery ({
       queryKey: postsKeys.index (p),
       queryFn:  () => fetchPosts (p) })
@@ -68,13 +83,27 @@ const prefetchWikiPageShow: Prefetcher = async (qc, url) => {
 
 const prefetchPostsIndex: Prefetcher = async (qc, url) => {
   const tags = url.searchParams.get ('tags') ?? ''
-  const m = url.searchParams.get ('match') === 'any' ? 'any' : 'all'
+  const qURL = url.searchParams.get ('url') ?? ''
+  const title = url.searchParams.get ('title') ?? ''
+  const originalCreatedFrom = url.searchParams.get ('original_created_from') ?? ''
+  const originalCreatedTo = url.searchParams.get ('original_created_to') ?? ''
+  const createdFrom = url.searchParams.get ('created_from') ?? ''
+  const createdTo = url.searchParams.get ('created_to') ?? ''
+  const updatedFrom = url.searchParams.get ('updated_from') ?? ''
+  const updatedTo = url.searchParams.get ('updated_to') ?? ''
+  const m: 'all' | 'any' = url.searchParams.get ('match') === 'any' ? 'any' : 'all'
   const page = Number (url.searchParams.get ('page') || 1)
   const limit = Number (url.searchParams.get ('limit') || 20)
+  const order = (url.searchParams.get ('order') ?? 'original_created_at:desc') as FetchPostsOrder
+
+  const keys = {
+      tags, match: m, page, limit, url: qURL, title,
+      originalCreatedFrom, originalCreatedTo, createdFrom, createdTo,
+      updatedFrom, updatedTo, order }
 
   await qc.prefetchQuery ({
-      queryKey: postsKeys.index ({ tags, match: m, page, limit }),
-      queryFn:  () => fetchPosts ({ tags, match: m, page, limit }) })
+      queryKey: postsKeys.index (keys),
+      queryFn:  () => fetchPosts (keys) })
 }
 
 
@@ -103,8 +132,9 @@ const prefetchPostChanges: Prefetcher = async (qc, url) => {
 
 
 export const routePrefetchers: { test: (u: URL) => boolean; run: Prefetcher }[] = [
-    { test: u => u.pathname === '/' || u.pathname === '/posts', run: prefetchPostsIndex },
-    { test: u => (!(['/posts/new', '/posts/changes'].includes (u.pathname))
+    { test: u => ['/', '/posts', '/posts/search'].includes (u.pathname),
+      run: prefetchPostsIndex },
+    { test: u => (!(['/posts/new', '/posts/changes', '/posts/search'].includes (u.pathname))
 		  && Boolean (mPost (u.pathname))),
       run: prefetchPostShow },
     { test: u => u.pathname === '/posts/changes', run: prefetchPostChanges },
@@ -119,5 +149,6 @@ export const prefetchForURL = async (qc: QueryClient, urlLike: string): Promise<
   const r = routePrefetchers.find (x => x.test (u))
   if (!(r))
     return
+
   await r.run (qc, u)
 }

frontend/src/lib/queryKeys.ts

@@ -1,7 +1,8 @@
+import type { FetchPostsParams } from '@/types'
+
 export const postsKeys = {
     root:     ['posts'] as const,
-    index:    (p: { tags: string; match: 'any' | 'all'; page: number; limit: number }) =>
-		  ['posts', 'index', p] as const,
+    index:    (p: FetchPostsParams) => ['posts', 'index', p] as const,
     show:     (id: string) => ['posts', id] as const,
     related:  (id: string) => ['related', id] as const,
     changes:  (p: { id?: string; page: number; limit: number }) =>

frontend/src/lib/utils.ts

@@ -4,4 +4,23 @@ import { twMerge } from 'tailwind-merge'
 import type { ClassValue } from 'clsx'
 
 
+export const toDate = (d: string | Date): Date => typeof d === 'string' ? new Date (d) : d
+
+
 export const cn = (...inputs: ClassValue[]) => twMerge (clsx (...inputs))
+
+
+export const dateString = (d: string | Date): string =>
+    toDate (d).toLocaleString ('ja-JP-u-ca-japanese')
+
+
+// TODO: 表示形式きしょすぎるので何とかする
+export const originalCreatedAtString = (
+    f:  string | Date | null,
+    b:  string | Date | null,
+): string =>
+    ([f ? `${ dateString (f) } 以降` : '',
+      b ? `${ dateString (b) } より前` : '']
+     .filter (Boolean)
+     .join (' '))
+    || '不明'