| @@ -3,18 +3,28 @@ import { Link } from 'react-router-dom' | |||||
| import { LIGHT_COLOUR_SHADE, DARK_COLOUR_SHADE, TAG_COLOUR } from '@/consts' | import { LIGHT_COLOUR_SHADE, DARK_COLOUR_SHADE, TAG_COLOUR } from '@/consts' | ||||
| import { cn } from '@/lib/utils' | import { cn } from '@/lib/utils' | ||||
| import type { ComponentProps, HTMLAttributes } from 'react' | |||||
| import type { Tag } from '@/types' | import type { Tag } from '@/types' | ||||
| type Props = { tag: Tag | |||||
| linkFlg?: boolean | |||||
| withWiki?: boolean | |||||
| withCount?: boolean } | |||||
| type CommonProps = { tag: Tag | |||||
| withWiki?: boolean | |||||
| withCount?: boolean } | |||||
| type PropsWithLink = | |||||
| CommonProps & { linkFlg?: true } & Partial<ComponentProps<typeof Link>> | |||||
| type PropsWithoutLink = | |||||
| CommonProps & { linkFlg: false } & Partial<HTMLAttributes<HTMLSpanElement>> | |||||
| type Props = PropsWithLink | PropsWithoutLink | |||||
| export default ({ tag, | export default ({ tag, | ||||
| linkFlg = true, | linkFlg = true, | ||||
| withWiki = true, | withWiki = true, | ||||
| withCount = true }: Props) => { | |||||
| withCount = true, | |||||
| ...props }: Props) => { | |||||
| const spanClass = cn ( | const spanClass = cn ( | ||||
| `text-${ TAG_COLOUR[tag.category] }-${ LIGHT_COLOUR_SHADE }`, | `text-${ TAG_COLOUR[tag.category] }-${ LIGHT_COLOUR_SHADE }`, | ||||
| `dark:text-${ TAG_COLOUR[tag.category] }-${ DARK_COLOUR_SHADE }`) | `dark:text-${ TAG_COLOUR[tag.category] }-${ DARK_COLOUR_SHADE }`) | ||||
| @@ -35,11 +45,13 @@ export default ({ tag, | |||||
| {linkFlg | {linkFlg | ||||
| ? ( | ? ( | ||||
| <Link to={`/posts?${ (new URLSearchParams ({ tags: tag.name })).toString () }`} | <Link to={`/posts?${ (new URLSearchParams ({ tags: tag.name })).toString () }`} | ||||
| className={linkClass}> | |||||
| className={linkClass} | |||||
| {...props}> | |||||
| {tag.name} | {tag.name} | ||||
| </Link>) | </Link>) | ||||
| : ( | : ( | ||||
| <span className={spanClass}> | |||||
| <span className={spanClass} | |||||
| {...props}> | |||||
| {tag.name} | {tag.name} | ||||
| </span>)} | </span>)} | ||||
| {withCount && ( | {withCount && ( | ||||
| @@ -102,7 +102,9 @@ export default () => { | |||||
| <Tab name="Wiki" init={!(posts.length)}> | <Tab name="Wiki" init={!(posts.length)}> | ||||
| <WikiBody body={wikiPage.body} /> | <WikiBody body={wikiPage.body} /> | ||||
| <div className="my-2"> | <div className="my-2"> | ||||
| <Link to={`/wiki/${ encodeURIComponent (wikiPage.title) }`}>Wiki を見る</Link> | |||||
| <Link to={`/wiki/${ encodeURIComponent (wikiPage.title) }`}> | |||||
| Wiki を見る | |||||
| </Link> | |||||
| </div> | </div> | ||||
| </Tab>)} | </Tab>)} | ||||
| </TabGroup> | </TabGroup> | ||||
| @@ -102,20 +102,25 @@ export default () => { | |||||
| {(wikiPage && version) && ( | {(wikiPage && version) && ( | ||||
| <div className="text-sm flex gap-3 items-center justify-center border border-gray-700 rounded px-2 py-1 mb-4"> | <div className="text-sm flex gap-3 items-center justify-center border border-gray-700 rounded px-2 py-1 mb-4"> | ||||
| {wikiPage.pred ? ( | {wikiPage.pred ? ( | ||||
| <Link to={`/wiki/${ title }?version=${ wikiPage.pred }`}> | |||||
| <Link to={`/wiki/${ encodeURIComponent (title) }?version=${ wikiPage.pred }`}> | |||||
| < 古 | < 古 | ||||
| </Link>) : <>(最古)</>} | |||||
| </Link>) : '(最古)'} | |||||
| <span>{wikiPage.updatedAt}</span> | <span>{wikiPage.updatedAt}</span> | ||||
| {wikiPage.succ ? ( | {wikiPage.succ ? ( | ||||
| <Link to={`/wiki/${ title }?version=${ wikiPage.succ }`}> | |||||
| <Link to={`/wiki/${ encodeURIComponent (title) }?version=${ wikiPage.succ }`}> | |||||
| 新 > | 新 > | ||||
| </Link>) : <>(最新)</>} | |||||
| </Link>) : '(最新)'} | |||||
| </div>)} | </div>)} | ||||
| <PageTitle> | <PageTitle> | ||||
| <TagLink tag={tag} withWiki={false} withCount={false} /> | |||||
| <TagLink tag={tag} | |||||
| withWiki={false} | |||||
| withCount={false} | |||||
| to={version | |||||
| ? `/wiki/${ encodeURIComponent (title) }` | |||||
| : undefined} /> | |||||
| </PageTitle> | </PageTitle> | ||||
| <div className="prose mx-auto p-4"> | <div className="prose mx-auto p-4"> | ||||
| {wikiPage === undefined | {wikiPage === undefined | ||||
| @@ -123,7 +128,7 @@ export default () => { | |||||
| : <WikiBody body={wikiPage?.body || `このページは存在しません。[新規作成してください](/wiki/new?title=${ encodeURIComponent (title) })。`} />} | : <WikiBody body={wikiPage?.body || `このページは存在しません。[新規作成してください](/wiki/new?title=${ encodeURIComponent (title) })。`} />} | ||||
| </div> | </div> | ||||
| {posts.length > 0 && ( | |||||
| {(!(version) && posts.length > 0) && ( | |||||
| <TabGroup> | <TabGroup> | ||||
| <Tab name="広場"> | <Tab name="広場"> | ||||
| <PostList posts={posts} /> | <PostList posts={posts} /> | ||||