build(deps): bump Next.js to v13
This commit is contained in:
Divlo
@ -22,35 +22,31 @@ const ChannelMemo: React.FC<ChannelProps> = (props) => {
|
||||
const { member } = useGuildMember()
|
||||
|
||||
return (
|
||||
<Link href={`/application/${path.guildId}/${channel.id}`}>
|
||||
<a
|
||||
className={classNames(
|
||||
'group relative my-3 mx-3 flex items-center justify-between overflow-hidden rounded-lg py-2 text-sm transition-all duration-200 hover:bg-gray-100 dark:hover:bg-gray-600',
|
||||
{
|
||||
'font-semibold text-green-800 dark:text-green-400': selected
|
||||
}
|
||||
)}
|
||||
>
|
||||
<span
|
||||
className='max-[315px] ml-2 mr-4 break-all'
|
||||
data-cy='channel-name'
|
||||
<Link
|
||||
href={`/application/${path.guildId}/${channel.id}`}
|
||||
className={classNames(
|
||||
'group relative my-3 mx-3 flex items-center justify-between overflow-hidden rounded-lg py-2 text-sm transition-all duration-200 hover:bg-gray-100 dark:hover:bg-gray-600',
|
||||
{
|
||||
'font-semibold text-green-800 dark:text-green-400': selected
|
||||
}
|
||||
)}
|
||||
>
|
||||
<span className='max-[315px] ml-2 mr-4 break-all' data-cy='channel-name'>
|
||||
# {channel.name}
|
||||
</span>
|
||||
{member.isOwner && (
|
||||
<IconButton
|
||||
onClick={async () => {
|
||||
await router.push(
|
||||
`/application/${channel.guildId}/${channel.id}/settings`
|
||||
)
|
||||
}}
|
||||
className='bg-unherit absolute -right-10 h-full w-8 transition-all group-hover:right-0 group-hover:shadow-lg dark:group-hover:bg-gray-600'
|
||||
title='Settings'
|
||||
>
|
||||
# {channel.name}
|
||||
</span>
|
||||
{member.isOwner && (
|
||||
<IconButton
|
||||
onClick={async () => {
|
||||
await router.push(
|
||||
`/application/${channel.guildId}/${channel.id}/settings`
|
||||
)
|
||||
}}
|
||||
className='bg-unherit absolute -right-10 h-full w-8 transition-all group-hover:right-0 group-hover:shadow-lg dark:group-hover:bg-gray-600'
|
||||
title='Settings'
|
||||
>
|
||||
<CogIcon height={20} width={20} />
|
||||
</IconButton>
|
||||
)}
|
||||
</a>
|
||||
<CogIcon height={20} width={20} />
|
||||
</IconButton>
|
||||
)}
|
||||
</Link>
|
||||
)
|
||||
}
|
||||
|
||||
@ -28,20 +28,24 @@ export const GuildLeftSidebar: React.FC<GuildLeftSidebarProps> = (props) => {
|
||||
<Divider />
|
||||
<div className='mb-1 flex items-center justify-center space-x-6 p-2'>
|
||||
{member.isOwner && (
|
||||
<Link href={`/application/${path.guildId}/channels/create`} passHref>
|
||||
<a data-cy='link-add-channel'>
|
||||
<IconButton className='h-10 w-10' title='Add a Channel'>
|
||||
<PlusIcon />
|
||||
</IconButton>
|
||||
</a>
|
||||
<Link
|
||||
href={`/application/${path.guildId}/channels/create`}
|
||||
passHref
|
||||
data-cy='link-add-channel'
|
||||
>
|
||||
<IconButton className='h-10 w-10' title='Add a Channel'>
|
||||
<PlusIcon />
|
||||
</IconButton>
|
||||
</Link>
|
||||
)}
|
||||
<Link href={`/application/${path.guildId}/settings`} passHref>
|
||||
<a data-cy='link-settings-guild'>
|
||||
<IconButton className='h-7 w-7' title='Settings'>
|
||||
<CogIcon />
|
||||
</IconButton>
|
||||
</a>
|
||||
<Link
|
||||
href={`/application/${path.guildId}/settings`}
|
||||
passHref
|
||||
data-cy='link-settings-guild'
|
||||
>
|
||||
<IconButton className='h-7 w-7' title='Settings'>
|
||||
<CogIcon />
|
||||
</IconButton>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -14,35 +14,33 @@ const MemberMemo: React.FC<MemberProps> = (props) => {
|
||||
|
||||
return (
|
||||
<Link href={`/application/users/${member.user.id}`}>
|
||||
<a>
|
||||
<div className='flex cursor-pointer items-center overflow-hidden py-2 px-6 pr-10 hover:bg-gray-300 dark:hover:bg-gray-900'>
|
||||
<div className='flex min-w-[50px] rounded-full'>
|
||||
<Image
|
||||
src={
|
||||
member.user.logo == null
|
||||
? '/images/data/user-default.png'
|
||||
: member.user.logo
|
||||
}
|
||||
alt={"Users's profil picture"}
|
||||
height={50}
|
||||
width={50}
|
||||
draggable={false}
|
||||
className='rounded-full'
|
||||
/>
|
||||
</div>
|
||||
<div className='ml-5'>
|
||||
<p data-cy='member-user-name' className='flex truncate font-bold'>
|
||||
{member.user.name}
|
||||
{member.isOwner && (
|
||||
<span className='ml-4'>
|
||||
<Emoji value=':crown:' size={18} />
|
||||
</span>
|
||||
)}
|
||||
</p>
|
||||
{member.user.status != null && member.user.status}
|
||||
</div>
|
||||
<div className='flex cursor-pointer items-center overflow-hidden py-2 px-6 pr-10 hover:bg-gray-300 dark:hover:bg-gray-900'>
|
||||
<div className='flex min-w-[50px] rounded-full'>
|
||||
<Image
|
||||
src={
|
||||
member.user.logo == null
|
||||
? '/images/data/user-default.png'
|
||||
: member.user.logo
|
||||
}
|
||||
alt={"Users's profil picture"}
|
||||
height={50}
|
||||
width={50}
|
||||
draggable={false}
|
||||
className='rounded-full'
|
||||
/>
|
||||
</div>
|
||||
</a>
|
||||
<div className='ml-5'>
|
||||
<p data-cy='member-user-name' className='flex truncate font-bold'>
|
||||
{member.user.name}
|
||||
{member.isOwner && (
|
||||
<span className='ml-4'>
|
||||
<Emoji value=':crown:' size={18} />
|
||||
</span>
|
||||
)}
|
||||
</p>
|
||||
{member.user.status != null && member.user.status}
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
)
|
||||
}
|
||||
|
||||
@ -73,37 +73,33 @@ export const Message: React.FC<MessageProps> = (props) => {
|
||||
}}
|
||||
>
|
||||
<Link href={`/application/users/${message.member.user.id}`}>
|
||||
<a>
|
||||
<div className='mr-4 flex h-12 w-12 flex-shrink-0 items-center justify-center'>
|
||||
<div className='h-10 w-10 drop-shadow-md'>
|
||||
<Image
|
||||
quality={100}
|
||||
className='rounded-full'
|
||||
src={
|
||||
message.member.user.logo == null
|
||||
? '/images/data/user-default.png'
|
||||
: message.member.user.logo
|
||||
}
|
||||
alt={"Users's profil picture"}
|
||||
width={50}
|
||||
height={50}
|
||||
draggable={false}
|
||||
/>
|
||||
</div>
|
||||
<div className='mr-4 flex h-12 w-12 flex-shrink-0 items-center justify-center'>
|
||||
<div className='h-10 w-10 drop-shadow-md'>
|
||||
<Image
|
||||
quality={100}
|
||||
className='rounded-full'
|
||||
src={
|
||||
message.member.user.logo == null
|
||||
? '/images/data/user-default.png'
|
||||
: message.member.user.logo
|
||||
}
|
||||
alt={"Users's profil picture"}
|
||||
width={50}
|
||||
height={50}
|
||||
draggable={false}
|
||||
/>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</Link>
|
||||
<div className='relative w-full whitespace-pre-wrap break-words break-all'>
|
||||
<div className='flex w-max items-center'>
|
||||
<Link href={`/application/users/${message.member.user.id}`}>
|
||||
<a>
|
||||
<span
|
||||
data-cy='message-member-user-name'
|
||||
className='font-bold text-gray-900 dark:text-gray-200'
|
||||
>
|
||||
{message.member.user.name}
|
||||
</span>
|
||||
</a>
|
||||
<span
|
||||
data-cy='message-member-user-name'
|
||||
className='font-bold text-gray-900 dark:text-gray-200'
|
||||
>
|
||||
{message.member.user.name}
|
||||
</span>
|
||||
</Link>
|
||||
<span
|
||||
data-cy='message-date'
|
||||
|
||||
@ -23,11 +23,12 @@ export const PopupGuildCard: React.FC<PopupGuildCardProps> = (props) => {
|
||||
<p className='mt-6 px-8 text-center text-sm text-gray-200'>
|
||||
{description}
|
||||
</p>
|
||||
<Link href={link.href}>
|
||||
<a className='mb-6 flex h-10 w-4/5 items-center justify-center self-center rounded-2xl bg-green-400 font-bold tracking-wide text-white transition duration-200 ease-in-out hover:bg-green-600'>
|
||||
{link.icon}
|
||||
{link.text}
|
||||
</a>
|
||||
<Link
|
||||
href={link.href}
|
||||
className='mb-6 flex h-10 w-4/5 items-center justify-center self-center rounded-2xl bg-green-400 font-bold tracking-wide text-white transition duration-200 ease-in-out hover:bg-green-600'
|
||||
>
|
||||
{link.icon}
|
||||
{link.text}
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -312,16 +312,15 @@ export const UserSettings: React.FC = () => {
|
||||
<Language className='!top-12' />
|
||||
<div className='ml-auto flex'>
|
||||
<SwitchTheme />
|
||||
<Link href={`/application/users/${user.id}`}>
|
||||
<a
|
||||
className='group ml-3 flex h-8 w-8 cursor-pointer items-center justify-center rounded-lg bg-slate-200 transition-colors hover:bg-slate-300 dark:bg-slate-700 hover:dark:bg-slate-800'
|
||||
title='Preview Public Profile'
|
||||
>
|
||||
<EyeIcon
|
||||
height={20}
|
||||
className='opacity-50 transition-opacity group-hover:opacity-100'
|
||||
/>
|
||||
</a>
|
||||
<Link
|
||||
href={`/application/users/${user.id}`}
|
||||
className='group ml-3 flex h-8 w-8 cursor-pointer items-center justify-center rounded-lg bg-slate-200 transition-colors hover:bg-slate-300 dark:bg-slate-700 hover:dark:bg-slate-800'
|
||||
title='Preview Public Profile'
|
||||
>
|
||||
<EyeIcon
|
||||
height={20}
|
||||
className='opacity-50 transition-opacity group-hover:opacity-100'
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -139,11 +139,9 @@ export const Authentication: React.FC<AuthenticationProps> = (props) => {
|
||||
: '/authentication/signup'
|
||||
}
|
||||
>
|
||||
<a>
|
||||
{mode === 'signup'
|
||||
? t('authentication:already-have-an-account')
|
||||
: t('authentication:dont-have-an-account')}
|
||||
</a>
|
||||
{mode === 'signup'
|
||||
? t('authentication:already-have-an-account')
|
||||
: t('authentication:dont-have-an-account')}
|
||||
</Link>
|
||||
</p>
|
||||
</AuthenticationForm>
|
||||
|
||||
@ -23,10 +23,11 @@ export const ErrorPage: React.FC<ErrorPageProps> = (props) => {
|
||||
</h1>
|
||||
<p className='text-center text-lg'>
|
||||
{message}{' '}
|
||||
<Link href='/'>
|
||||
<a className='text-green-800 hover:underline dark:text-green-400'>
|
||||
{t('errors:return-to-home-page')}
|
||||
</a>
|
||||
<Link
|
||||
href='/'
|
||||
className='text-green-800 hover:underline dark:text-green-400'
|
||||
>
|
||||
{t('errors:return-to-home-page')}
|
||||
</Link>
|
||||
</p>
|
||||
|
||||
|
||||
@ -15,10 +15,11 @@ export const Footer: React.FC<FooterProps> = (props) => {
|
||||
return (
|
||||
<footer className='flex flex-col items-center justify-center border-t-2 border-gray-600 bg-white py-6 text-lg dark:border-gray-400 dark:bg-black'>
|
||||
<p>
|
||||
<Link href='/'>
|
||||
<a className='text-green-800 hover:underline dark:text-green-400'>
|
||||
Thream
|
||||
</a>
|
||||
<Link
|
||||
href='/'
|
||||
className='text-green-800 hover:underline dark:text-green-400'
|
||||
>
|
||||
Thream
|
||||
</Link>{' '}
|
||||
| {t('common:all-rights-reserved')}
|
||||
</p>
|
||||
|
||||
@ -9,20 +9,18 @@ export const Header: React.FC = () => {
|
||||
<header className='sticky top-0 z-50 flex w-full justify-center border-b-2 border-gray-600 bg-white px-6 py-2 dark:border-gray-400 dark:bg-black'>
|
||||
<div className='container flex justify-between'>
|
||||
<Link href='/'>
|
||||
<a>
|
||||
<div className='flex items-center justify-center'>
|
||||
<Image
|
||||
quality={100}
|
||||
width={60}
|
||||
height={60}
|
||||
src='/images/icons/Thream.png'
|
||||
alt='Thream'
|
||||
/>
|
||||
<span className='ml-1 hidden font-headline font-medium text-green-800 dark:text-green-400 xs:block'>
|
||||
Thream
|
||||
</span>
|
||||
</div>
|
||||
</a>
|
||||
<div className='flex items-center justify-center'>
|
||||
<Image
|
||||
quality={100}
|
||||
width={60}
|
||||
height={60}
|
||||
src='/images/icons/Thream.png'
|
||||
alt='Thream'
|
||||
/>
|
||||
<span className='ml-1 hidden font-headline font-medium text-green-800 dark:text-green-400 xs:block'>
|
||||
Thream
|
||||
</span>
|
||||
</div>
|
||||
</Link>
|
||||
<div className='flex justify-between'>
|
||||
<Language />
|
||||
|
||||
@ -14,24 +14,26 @@ export const IconLink: React.FC<React.PropsWithChildren<IconLinkProps>> = (
|
||||
const { children, selected, href, title, className } = props
|
||||
|
||||
return (
|
||||
<Link href={href}>
|
||||
<a className='group relative flex w-full justify-center' title={title}>
|
||||
<div
|
||||
className={classNames('group flex w-full justify-center', className)}
|
||||
>
|
||||
{children}
|
||||
<div className='absolute left-0 flex h-12 w-3 items-center'>
|
||||
<span
|
||||
className={classNames(
|
||||
'absolute w-4/12 rounded-r-lg bg-green-700 group-hover:h-5',
|
||||
{
|
||||
'h-full': selected
|
||||
}
|
||||
)}
|
||||
></span>
|
||||
</div>
|
||||
<Link
|
||||
href={href}
|
||||
className='group relative flex w-full justify-center'
|
||||
title={title}
|
||||
>
|
||||
<div
|
||||
className={classNames('group flex w-full justify-center', className)}
|
||||
>
|
||||
{children}
|
||||
<div className='absolute left-0 flex h-12 w-3 items-center'>
|
||||
<span
|
||||
className={classNames(
|
||||
'absolute w-4/12 rounded-r-lg bg-green-700 group-hover:h-5',
|
||||
{
|
||||
'h-full': selected
|
||||
}
|
||||
)}
|
||||
></span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</Link>
|
||||
)
|
||||
}
|
||||
|
||||
@ -44,13 +44,12 @@ export const Input: React.FC<InputProps> = (props) => {
|
||||
{label}
|
||||
</label>
|
||||
{type === 'password' && showForgotPassword ? (
|
||||
<Link href='/authentication/forgot-password'>
|
||||
<a
|
||||
className='text-center font-headline text-xs text-green-800 hover:underline dark:text-green-400 sm:text-sm'
|
||||
data-cy='forgot-password-link'
|
||||
>
|
||||
{t('authentication:forgot-password')}
|
||||
</a>
|
||||
<Link
|
||||
href='/authentication/forgot-password'
|
||||
className='text-center font-headline text-xs text-green-800 hover:underline dark:text-green-400 sm:text-sm'
|
||||
data-cy='forgot-password-link'
|
||||
>
|
||||
{t('authentication:forgot-password')}
|
||||
</Link>
|
||||
) : null}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user