diff --git a/frontend/src/components/PostList.tsx b/frontend/src/components/PostList.tsx new file mode 100644 index 0000000..4390acc --- /dev/null +++ b/frontend/src/components/PostList.tsx @@ -0,0 +1,22 @@ +import { Link } from 'react-router-dom' + +import type { Post } from '@/types' + +type Props = { posts: Post[] } + + +export default ({ posts }: Props) => ( +
+ {posts.map ((post, i) => ( + + {post.title + ))} +
) diff --git a/frontend/src/pages/posts/PostListPage.tsx b/frontend/src/pages/posts/PostListPage.tsx index 34dcd81..feba917 100644 --- a/frontend/src/pages/posts/PostListPage.tsx +++ b/frontend/src/pages/posts/PostListPage.tsx @@ -4,6 +4,7 @@ import { useEffect, useRef, useState } from 'react' import { Helmet } from 'react-helmet-async' import { Link, useLocation } from 'react-router-dom' +import PostList from '@/components/PostList' import TagSidebar from '@/components/TagSidebar' import WikiBody from '@/components/WikiBody' import TabGroup, { Tab } from '@/components/common/TabGroup' @@ -14,10 +15,10 @@ import type { Post, WikiPage } from '@/types' export default () => { - const [posts, setPosts] = useState ([]) - const [wikiPage, setWikiPage] = useState (null) const [cursor, setCursor] = useState ('') const [loading, setLoading] = useState (false) + const [posts, setPosts] = useState ([]) + const [wikiPage, setWikiPage] = useState (null) const loaderRef = useRef (null) @@ -25,7 +26,7 @@ export default () => { setLoading (true) const res = await axios.get (`${ API_BASE_URL }/posts`, { params: { tags: tags.join (' '), - match: (anyFlg ? 'any' : 'all'), + match: anyFlg ? 'any' : 'all', ...(withCursor ? { cursor } : { }) } }) const data = toCamel (res.data as any, { deep: true }) as { posts: Post[] nextCursor: string } @@ -92,21 +93,7 @@ export default () => { {posts.length - ? ( -
- {posts.map ((post, i) => ( - - {post.title - ))} -
) + ? : !(loading) && '広場には何もありませんよ.'} {loading && 'Loading...'}
diff --git a/frontend/src/pages/wiki/WikiDetailPage.tsx b/frontend/src/pages/wiki/WikiDetailPage.tsx index 8f0c261..1bfe735 100644 --- a/frontend/src/pages/wiki/WikiDetailPage.tsx +++ b/frontend/src/pages/wiki/WikiDetailPage.tsx @@ -4,13 +4,16 @@ import { useEffect, useState } from 'react' import { Helmet } from 'react-helmet-async' import { Link, useLocation, useNavigate, useParams } from 'react-router-dom' +import PostList from '@/components/PostList' +import TagLink from '@/components/TagLink' import WikiBody from '@/components/WikiBody' import PageTitle from '@/components/common/PageTitle' +import TabGroup, { Tab } from '@/components/common/TabGroup' import MainArea from '@/components/layout/MainArea' import { API_BASE_URL, SITE_TITLE } from '@/config' import { WikiIdBus } from '@/lib/eventBus/WikiIdBus' -import type { WikiPage } from '@/types' +import type { Post, Tag, WikiPage } from '@/types' export default () => { @@ -20,6 +23,10 @@ export default () => { const location = useLocation () const navigate = useNavigate () + const defaultTag = { name: title, category: 'general' } as Tag + + const [posts, setPosts] = useState ([]) + const [tag, setTag] = useState (defaultTag) const [wikiPage, setWikiPage] = useState (undefined) const query = new URLSearchParams (location.search) @@ -33,14 +40,16 @@ export default () => { const data = res.data as WikiPage navigate (`/wiki/${ data.title }`, { replace: true }) }) () + return } void (async () => { try { - const res = await axios.get (`${ API_BASE_URL }/wiki/title/${ encodeURIComponent (title) }`, - { params: { ...(version ? { version } : { }) } }) + const res = await axios.get ( + `${ API_BASE_URL }/wiki/title/${ encodeURIComponent (title) }`, + { params: version ? { version } : { } }) const data = toCamel (res.data as any, { deep: true }) as WikiPage setWikiPage (data) WikiIdBus.set (data.id) @@ -51,6 +60,36 @@ export default () => { } }) () + void (async () => { + try + { + const res = await axios.get ( + `${ API_BASE_URL }/posts?${ new URLSearchParams ({ tags: title, + limit: '8' }) }`) + const data = toCamel (res.data as any, + { deep: true }) as { posts: Post[] + nextCursor: string } + setPosts (data.posts) + } + catch + { + setPosts ([]) + } + }) () + + void (async () => { + try + { + const res = await axios.get ( + `${ API_BASE_URL }/tags/name/${ encodeURIComponent (title) }`) + setTag (toCamel (res.data as any, { deep: true }) as Tag) + } + catch + { + setTag (defaultTag) + } + }) () + return () => WikiIdBus.set (null) }, [title, location.search]) @@ -59,6 +98,7 @@ export default () => { {`${ title } Wiki | ${ SITE_TITLE }`} + {(wikiPage && version) && (
{wikiPage.pred ? ( @@ -73,11 +113,21 @@ export default () => { 新 > ) : <>(最新)}
)} - {title} + + + +
{wikiPage === undefined ? 'Loading...' - : } + : }
+ + {posts.length > 0 && ( + + + + + )} ) }