explore/ui/marketplace/MarketplaceAppInfo/WebsiteLink.tsx

import React from 'react';

import { Link } from 'toolkit/next/link';
import { makePrettyLink } from 'toolkit/utils/url';
import IconSvg from 'ui/shared/IconSvg';

interface Props {
  url?: string | undefined;
}

const WebsiteLink = ({ url }: Props) => {
  if (!url) {
    return null;
  }

  return (
    <Link
      external
      noIcon
      href={ url }
      className="inline-flex items-center gap-x-1 mt-3"
    >
      <IconSvg name="link" className="w-5 h-5 text-[var(--color-icon-primary)]"/>
      <span>{ makePrettyLink(url)?.domain }</span>
    </Link>
  );
};

export default WebsiteLink;