Skip to content

A utility to detect whether given link is internal link or internal link

License

Notifications You must be signed in to change notification settings

franciscop-invast/is-internal-link

 
 

Repository files navigation

is-internal-link

npm-badge GitHub issues GitHub license npm type definitions Twitter

Installation

npm install --save is-internal-link

Usage

import { isInternalLink } from "is-internal-link"
isInternalLink('https://www.google.com') // false
isInternalLink('/page1') // true

Test

npm run test

Why ?

I found my self doing this everytime I started new project. That's why I decided to make this logic to abstract the logic and share it with the world

How does it fit in my App?

This is one example, if you're using React. And just want to have a single component. Instead of sometimes using <Link> and sometimes using <a>. Just create new Link component and use it everywhere.

Another pattern I usually use. Usually I add target="_blank" for external link. So every external link will be opened in new tab

import React from 'react'

import { Link as ReactRouterLink} from 'react-router-dom'
import { isInternalLink } from 'is-internal-link'

const Link = ({ children, to, activeClassName, ...other }) => {
  if (isInternalLink(to)) {
    return (
      <ReactRouterLink to={to} activeClassName={activeClassName} {...other}>
        {children}
      </ReactRouterLink>
    )
  }
  return (
    <a href={to} target="_blank" {...other}>
      {children}
    </a>
  )
}

export default Link

Contributing

Please do not hesitate to submit an issue or pull request.

Question?

Submit an issue || ping me @muhajirframe on twitter

License

MIT

Enjoy

About

A utility to detect whether given link is internal link or internal link

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 58.9%
  • JavaScript 41.1%