fix: Remove a tag childs from NextJS link components

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2022-11-06 16:15:57 +01:00 committed by David Mehren
parent cb74cb21ed
commit 7f7f020d91
7 changed files with 39 additions and 54 deletions

View file

@ -32,10 +32,7 @@ export const Redirect: React.FC<RedirectProps> = ({ to }) => {
return ( return (
<span {...testId('redirect')}> <span {...testId('redirect')}>
Redirecting to{' '} Redirecting to <Link href={to}>{to}</Link>
<Link href={to}>
<a>{to}</a>
</Link>
</span> </span>
) )
} }

View file

@ -23,14 +23,12 @@ export const NavbarBranding: React.FC = () => {
return ( return (
<Navbar.Brand> <Navbar.Brand>
<Link href='/intro'> <Link href='/intro' className='text-secondary text-decoration-none d-flex align-items-center'>
<a className='text-secondary text-decoration-none d-flex align-items-center'> <HedgeDocLogoWithText
<HedgeDocLogoWithText logoType={darkModeActivated ? HedgeDocLogoType.WB_HORIZONTAL : HedgeDocLogoType.BW_HORIZONTAL}
logoType={darkModeActivated ? HedgeDocLogoType.WB_HORIZONTAL : HedgeDocLogoType.BW_HORIZONTAL} size={HedgeDocLogoSize.SMALL}
size={HedgeDocLogoSize.SMALL} />
/> <Branding inline={true} />
<Branding inline={true} />
</a>
</Link> </Link>
</Navbar.Brand> </Navbar.Brand>
) )

View file

@ -19,16 +19,14 @@ export const ReadOnlyModeButton: React.FC = () => {
const noteIdentifier = useApplicationState((state) => state.noteDetails.primaryAddress) const noteIdentifier = useApplicationState((state) => state.noteDetails.primaryAddress)
return ( return (
<Link href={`/s/${noteIdentifier}`}> <Link href={`/s/${noteIdentifier}`} target='_blank'>
<a target='_blank'> <Button
<Button title={t('editor.documentBar.readOnlyMode')}
title={t('editor.documentBar.readOnlyMode')} className='ms-2 text-secondary'
className='ms-2 text-secondary' size='sm'
size='sm' variant='outline-light'>
variant='outline-light'> <ForkAwesomeIcon icon='file-text-o' />
<ForkAwesomeIcon icon='file-text-o' /> </Button>
</Button>
</a>
</Link> </Link>
) )
} }

View file

@ -19,16 +19,14 @@ export const SlideModeButton: React.FC = () => {
const noteIdentifier = useApplicationState((state) => state.noteDetails.primaryAddress) const noteIdentifier = useApplicationState((state) => state.noteDetails.primaryAddress)
return ( return (
<Link href={`/p/${noteIdentifier}`}> <Link href={`/p/${noteIdentifier}`} target='_blank'>
<a target='_blank'> <Button
<Button title={t('editor.documentBar.slideMode')}
title={t('editor.documentBar.slideMode')} className='ms-2 text-secondary'
className='ms-2 text-secondary' size='sm'
size='sm' variant='outline-light'>
variant='outline-light'> <ForkAwesomeIcon icon='television' />
<ForkAwesomeIcon icon='television' /> </Button>
</Button>
</a>
</Link> </Link>
) )
} }

View file

@ -64,22 +64,20 @@ export const HistoryCard: React.FC<HistoryEntryProps & HistoryEventHandlers> = (
<div className={'d-flex flex-column'}> <div className={'d-flex flex-column'}>
<PinButton isDark={false} isPinned={entry.pinStatus} onPinClick={onPinEntry} /> <PinButton isDark={false} isPinned={entry.pinStatus} onPinClick={onPinEntry} />
</div> </div>
<Link href={`/n/${entry.identifier}`}> <Link href={`/n/${entry.identifier}`} className='text-decoration-none flex-fill text-dark'>
<a className='text-decoration-none flex-fill text-dark'> <div className={'d-flex flex-column justify-content-between'}>
<div className={'d-flex flex-column justify-content-between'}> <Card.Title className='m-0 mt-1dot5' {...cypressId('history-entry-title')}>
<Card.Title className='m-0 mt-1dot5' {...cypressId('history-entry-title')}> {entryTitle}
{entryTitle} </Card.Title>
</Card.Title> <div>
<div> <div className='text-black-50 mt-2'>
<div className='text-black-50 mt-2'> <ForkAwesomeIcon icon='clock-o' /> {DateTime.fromISO(entry.lastVisitedAt).toRelative()}
<ForkAwesomeIcon icon='clock-o' /> {DateTime.fromISO(entry.lastVisitedAt).toRelative()} <br />
<br /> {lastVisited}
{lastVisited}
</div>
<div className={`${styles['card-footer-min-height']} p-0`}>{tags}</div>
</div> </div>
<div className={`${styles['card-footer-min-height']} p-0`}>{tags}</div>
</div> </div>
</a> </div>
</Link> </Link>
<div className={'d-flex flex-column'}> <div className={'d-flex flex-column'}>
<EntryMenu <EntryMenu

View file

@ -45,10 +45,8 @@ export const HistoryTableRow: React.FC<HistoryEntryProps & HistoryEventHandlers>
return ( return (
<tr> <tr>
<td> <td>
<Link href={`/n/${entry.identifier}`}> <Link href={`/n/${entry.identifier}`} className='text-light' {...cypressId('history-entry-title')}>
<a className='text-light' {...cypressId('history-entry-title')}> {entryTitle}
{entryTitle}
</a>
</Link> </Link>
</td> </td>
<td>{formatHistoryDate(entry.lastVisitedAt)}</td> <td>{formatHistoryDate(entry.lastVisitedAt)}</td>

View file

@ -33,10 +33,8 @@ export const HeaderNavLink: React.FC<PropsWithChildren<HeaderNavLinkProps>> = ({
return ( return (
<Nav.Item> <Nav.Item>
<Link href={to} passHref={true}> <Link href={to} className={`nav-link text-light ${activeClass} ${styles['nav-link']}`} {...cypressId(props)}>
<a className={`nav-link text-light ${activeClass} ${styles['nav-link']}`} href={to} {...cypressId(props)}> {children}
{children}
</a>
</Link> </Link>
</Nav.Item> </Nav.Item>
) )