import React, { useContext } from 'react'; import styled from '@emotion/styled'; import Favorite from '@material-ui/icons/Favorite'; import { Trans } from 'react-i18next'; import Button from '../../muiComponents/Button'; import Link from '../Link'; import { isURL } from '../../utils/url'; import { Theme } from '../../design-tokens/theme'; import { DetailContext } from '../../pages/Version'; const StyledLink = styled(Link)<{ theme?: Theme }>(({ theme }) => ({ marginTop: theme && theme.spacing(1), marginBottom: theme && theme.spacing(1), textDecoration: 'none', display: 'block', })); const StyledFavoriteIcon = styled(Favorite)<{ theme?: Theme }>(({ theme }) => ({ color: theme && theme.palette.orange, })); const StyledFundStrong = styled('strong')({ marginRight: 3, }); /* eslint-disable react/jsx-no-bind */ const DetailSidebarFundButton: React.FC = () => { const detailContext = useContext(DetailContext); const { packageMeta } = detailContext; const fundingUrl = packageMeta?.latest?.funding?.url as string; if (!isURL(fundingUrl)) { return null; } return ( ); }; export default DetailSidebarFundButton;