37 lines
1.1 KiB
TypeScript
37 lines
1.1 KiB
TypeScript
|
import Link from 'next/link'
|
||
|
import classNames from 'classnames'
|
||
|
|
||
|
import { GuildsChannelsPath } from '../Application'
|
||
|
|
||
|
export interface ChannelsProps {
|
||
|
path: GuildsChannelsPath
|
||
|
}
|
||
|
|
||
|
export const Channels: React.FC<ChannelsProps> = (props) => {
|
||
|
const { path } = props
|
||
|
|
||
|
return (
|
||
|
<nav className='w-full'>
|
||
|
{new Array(100).fill(null).map((_, index) => {
|
||
|
return (
|
||
|
<Link key={index} href={`/application/${path.guildId}/${index}`}>
|
||
|
<a
|
||
|
className={classNames(
|
||
|
'hover:bg-gray-100 group flex items-center justify-between text-sm py-2 my-3 mx-3 transition-colors dark:hover:bg-gray-600 duration-200 rounded-lg',
|
||
|
{
|
||
|
'text-green-800 dark:text-green-400 font-semibold':
|
||
|
typeof path !== 'string' && path.channelId === index,
|
||
|
'text-gray-600 dark:text-gray-400 hover:text-gray-800 dark:hover:text-white font-normal':
|
||
|
typeof path === 'string'
|
||
|
}
|
||
|
)}
|
||
|
>
|
||
|
<span className='ml-2 mr-4'># Channel {index}</span>
|
||
|
</a>
|
||
|
</Link>
|
||
|
)
|
||
|
})}
|
||
|
</nav>
|
||
|
)
|
||
|
}
|