This commit is contained in:
tangly1024
2022-02-16 19:45:55 +08:00
parent 9d1e9b151f
commit ff08dd8ab4
2 changed files with 5 additions and 4 deletions

View File

@@ -12,7 +12,8 @@ const CategoryGroup = ({ currentCategory, categories }) => {
<div className='flex flex-wrap'>
{Object.keys(categories).map(category => {
const selected = currentCategory === category
return <CategoryItem key={category} selected={selected} category={category} categoryCount={categories[category]}/>
const categoryCount = +categories[category]
return <CategoryItem key={category} selected={selected} category={category} categoryCount={categoryCount}/>
})}
</div>
</div>

View File

@@ -2,14 +2,14 @@ import Link from 'next/link'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faFolderOpen, faFolder } from '@fortawesome/free-solid-svg-icons'
export default function CategoryItem ({ key, selected, category, categoryCount }) {
return <Link key={key || category} href={`/category/${category}`} passHref>
export default function CategoryItem ({ selected, category, categoryCount }) {
return <Link href={`/category/${category}`} passHref>
<a className={(selected
? 'hover:text-white dark:hover:text-white bg-gray-600 text-white '
: 'dark:text-gray-400 text-gray-500 hover:text-white dark:hover:text-white hover:bg-gray-600') +
' flex text-sm items-center duration-300 cursor-pointer py-1 font-light px-2 whitespace-nowrap'}>
<div><FontAwesomeIcon icon={selected ? faFolderOpen : faFolder}
className={'mr-2'} />{category} {categoryCount && ({ categoryCount })}
className={'mr-2'} />{category} {categoryCount && (categoryCount)}
</div>
</a>
</Link>