All files / src/components ExternalLink.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
14x
 
 
 
 
2x
2x
 
 
 
 
 
 
 
 
 
import {
  AnchorHTMLAttributes,
  DetailedHTMLProps,
  PropsWithChildren,
} from 'react'
 
import { useTranslation } from 'next-i18next'
 
export interface ExternalLinkProps
  extends DetailedHTMLProps<
      AnchorHTMLAttributes<HTMLAnchorElement>,
      HTMLAnchorElement
    >,
    PropsWithChildren {
  href: string
}
 
export const ExternalLink = ({
  children,
  href,
  ...rest
}: ExternalLinkProps) => {
  const { t } = useTranslation(['common'])
  return (
    <a {...rest} href={href} target="_blank" rel="noopener noreferrer">
      {children}
      <span className="sr-only">{t('opens-in-new-tab')}</span>
    </a>
  )
}
 
export default ExternalLink