Mirror of https://github.com/roostorg/osprey
github.com/roostorg/osprey
1import * as React from 'react';
2import { SelectOutlined } from '@ant-design/icons';
3import { Button } from 'antd';
4import classNames from 'classnames';
5
6import useApplicationConfigStore from '../../stores/ApplicationConfigStore';
7import OspreyButton from '../../uikit/OspreyButton';
8
9import styles from './ExternalLinkButton.module.css';
10
11interface ExternalLinkButtonProps {
12 entityType: string;
13 entityId: string;
14 className?: string;
15 icon?: boolean;
16}
17
18const ExternalLinkButton = ({ entityType, entityId, className, icon = false }: ExternalLinkButtonProps) => {
19 const externalLinks = useApplicationConfigStore((state) => state.externalLinks);
20 const externalLink = externalLinks.get(entityType);
21 if (externalLink == null) return null;
22 const externalLinkFormatted = externalLink.replace('{entity_id}', encodeURIComponent(entityId));
23
24 if (icon) {
25 return (
26 <Button
27 className={classNames(styles.iconWrapper, className)}
28 icon={<SelectOutlined className={styles.icon} />}
29 style={{ height: 14, width: 14 }}
30 type="link"
31 target="_blank"
32 href={externalLinkFormatted}
33 />
34 );
35 }
36
37 return (
38 <OspreyButton style={{ paddingTop: 6 }} className={className} target="_blank" href={externalLinkFormatted}>
39 More Info
40 </OspreyButton>
41 );
42};
43
44export default ExternalLinkButton;