fix: Migrate code to next 13 breaking changes

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>

frontend/cypress/e2e/signInButton.spec.ts

@@ -36,7 +36,7 @@ describe('When logged-out ', () => {
           type: AuthProviderType.LOCAL
         }
       ])
-      cy.getByCypressId('sign-in-button').should('be.visible').should('have.attr', 'href', '/login')
+      cy.getByCypressId('sign-in-button').should('be.visible').parent().should('have.attr', 'href', '/login')
     })
 
     it('sign-in button points to login route: ldap', () => {
@@ -47,7 +47,7 @@ describe('When logged-out ', () => {
           providerName: 'cy LDAP'
         }
       ])
-      cy.getByCypressId('sign-in-button').should('be.visible').should('have.attr', 'href', '/login')
+      cy.getByCypressId('sign-in-button').should('be.visible').parent().should('have.attr', 'href', '/login')
     })
   })
 
@@ -60,6 +60,7 @@ describe('When logged-out ', () => {
       ])
       cy.getByCypressId('sign-in-button')
         .should('be.visible')
+        .parent()
         // The absolute URL is used because it is defined as API base URL absolute.
         .should('have.attr', 'href', '/auth/github')
     })
@@ -75,7 +76,7 @@ describe('When logged-out ', () => {
           type: AuthProviderType.GOOGLE
         }
       ])
-      cy.getByCypressId('sign-in-button').should('be.visible').should('have.attr', 'href', '/login')
+      cy.getByCypressId('sign-in-button').should('be.visible').parent().should('have.attr', 'href', '/login')
     })
   })
 
@@ -89,7 +90,7 @@ describe('When logged-out ', () => {
           type: AuthProviderType.LOCAL
         }
       ])
-      cy.getByCypressId('sign-in-button').should('be.visible').should('have.attr', 'href', '/login')
+      cy.getByCypressId('sign-in-button').should('be.visible').parent().should('have.attr', 'href', '/login')
     })
   })
 })

frontend/next.config.js

@@ -86,6 +86,7 @@ const rawNextConfig = {
     ])
   },
   output: 'standalone',
+  swcMinify: false, //Otherwise emoji picker is minified incorrectly
   experimental: {
     outputFileTracingRoot: path.join(__dirname, '../')
   }

frontend/src/components/common/links/internal-link.tsx

@@ -30,14 +30,12 @@ export const InternalLink: React.FC<LinkWithTextProps> = ({
   title
 }) => {
   return (
-    <Link href={href}>
-      <a className={className} id={id} title={title}>
+    <Link href={href} className={className} id={id} title={title}>
       <ShowIf condition={!!icon}>
         <ForkAwesomeIcon icon={icon as IconName} fixedWidth={true} />
         &nbsp;
       </ShowIf>
       {text}
-      </a>
     </Link>
   )
 }

frontend/src/components/common/redirect.tsx

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

frontend/src/components/editor-page/app-bar/navbar-branding.tsx

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

frontend/src/components/editor-page/app-bar/read-only-mode-button.tsx

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

frontend/src/components/editor-page/app-bar/slide-mode-button.tsx

@@ -18,8 +18,7 @@ export const SlideModeButton: React.FC = () => {
   const noteIdentifier = useApplicationState((state) => state.noteDetails.primaryAddress)
 
   return (
-    <Link href={`/p/${noteIdentifier}`}>
-      <a target='_blank'>
+    <Link href={`/p/${noteIdentifier}`} target='_blank'>
       <Button
         title={t('editor.documentBar.slideMode') ?? undefined}
         className='ms-2 text-secondary'
@@ -27,7 +26,6 @@ export const SlideModeButton: React.FC = () => {
         variant='outline-light'>
         <ForkAwesomeIcon icon='television' />
       </Button>
-      </a>
     </Link>
   )
 }

frontend/src/components/history-page/history-card/history-card.tsx

@@ -63,8 +63,7 @@ export const HistoryCard: React.FC<HistoryEntryProps & HistoryEventHandlers> = (
           <div className={'d-flex flex-column'}>
             <PinButton isDark={false} isPinned={entry.pinStatus} onPinClick={onPinEntry} />
           </div>
-          <Link href={`/n/${entry.identifier}`}>
-            <a className='text-decoration-none flex-fill text-dark'>
+          <Link href={`/n/${entry.identifier}`} className='text-decoration-none flex-fill text-dark'>
             <div className={'d-flex flex-column justify-content-between'}>
               <Card.Title className='m-0 mt-1dot5' {...cypressId('history-entry-title')}>
                 {entryTitle}
@@ -78,7 +77,6 @@ export const HistoryCard: React.FC<HistoryEntryProps & HistoryEventHandlers> = (
                 <div className={`${styles['card-footer-min-height']} p-0`}>{tags}</div>
               </div>
             </div>
-            </a>
           </Link>
           <div className={'d-flex flex-column'}>
             <EntryMenu

frontend/src/components/history-page/history-table/history-table-row.tsx

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

frontend/src/components/landing-layout/navigation/header-bar/header-nav-link.tsx

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