feat: support onTagClick routing
This commit is contained in:
parent
4e32cad1fd
commit
1c6c718415
|
@ -1,16 +1,40 @@
|
|||
import { addTopicsToQuery } from '@/utils/search.utils'
|
||||
import { Tag } from '@acid-info/lsd-react'
|
||||
import styled from '@emotion/styled'
|
||||
import { useRouter } from 'next/router'
|
||||
|
||||
const Tags = ({ tags }: { tags: string[] }) =>
|
||||
tags.length > 0 ? (
|
||||
const Tags = ({ tags }: { tags: string[] }) => {
|
||||
const router = useRouter()
|
||||
|
||||
const onTagClick = (e: React.MouseEvent<HTMLElement>, tag: string) => {
|
||||
e.preventDefault()
|
||||
router.push(
|
||||
{
|
||||
pathname: '/search',
|
||||
query: {
|
||||
...addTopicsToQuery([tag]),
|
||||
},
|
||||
},
|
||||
undefined,
|
||||
{ shallow: true },
|
||||
)
|
||||
}
|
||||
|
||||
return tags.length > 0 ? (
|
||||
<TagContainer>
|
||||
{tags.map((tag) => (
|
||||
<Tag size="small" disabled={false} key={tag}>
|
||||
<Tag
|
||||
onClick={(e) => onTagClick(e, tag)}
|
||||
size="small"
|
||||
disabled={false}
|
||||
key={tag}
|
||||
>
|
||||
{tag}
|
||||
</Tag>
|
||||
))}
|
||||
</TagContainer>
|
||||
) : null
|
||||
}
|
||||
|
||||
const TagContainer = styled.div`
|
||||
display: flex;
|
||||
|
|
Loading…
Reference in New Issue