Next-link props

[gmonitoring]

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:        
      Platform: win32        
      Arch: x64
      Version: Windows 10 Pro
    Binaries:
      Node: 18.7.0
      npm: N/A
      Yarn: N/A
      pnpm: N/A
    Relevant packages:
      next: 13.4.7
      eslint-config-next: 13.4.8
      react: 18.2.0
      react-dom: 18.2.0
      typescript: 5.1.3

warn  - Latest canary version not detected, detected: "13.4.7", newest: "13.4.11-canary.0".
        Please try the latest canary version (`npm install next@canary`) to confirm the issue still exists before creating a new issue.
        Read more - https://nextjs.org/docs/messages/opening-an-issue

Which area(s) of Next.js are affected? (leave empty if unsure)

Routing (next/router, next/navigation, next/link)

Link to the code that reproduces this issue or a replay of the bug

https://codesandbox.io/p/sandbox/runtime-resonance-rvkftd?file=%2Fsrc%2Fcomponents%2FBaseLink.tsx%3A10%2C22

codesandbox failed to reproduce.

To Reproduce

import React, { FC } from 'react'
import { Box } from '@/shared/ui'
import { Typography } from '@mui/material'
import ArrowRight from 'public/icons/arrow_right.svg'
import Link, { LinkProps } from 'next/link'


export type BaseLinkProps = {
  text: string
} & LinkProps

const BaseLink: FC<BaseLinkProps> = ({ text, ...props }) => {
  return (
    <Link {...props}>
      <Box
        flexDirection="row"
        justifyContent="space-between"
        alignItems="center"
        width="100%"
        mb={2}
      >
        <Typography variant="subtitle1">{text}</Typography>
        <ArrowRight />
      </Box>
    </Link>
  )
}

export default BaseLink

Describe the Bug

This error occurs when running tsc --pretty

Ide does not highlight this error without running the tsc --pretty command

Expected Behavior

I expected everything to be fine, because LinkProps is not Generic

Which browser are you using? (if relevant)

Chrome

How are you deploying your application? (if relevant)

next-dev
localhost

[shuding]

If you have typedRoutes enabled, you can try the following:

It's unfortunate that I can't think of a way in TS to have generics in : FC<..>, only came with the workaround above.

[gmonitoring]

This is the tenth time I've edited the answer. In general, my typescript was buggy initially, but in the end your solution saved me. THANK YOU

[github-actions]

This closed issue has been automatically locked because it had no new activity for 2 weeks. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.