diff --git a/src/components/issues/BountyCard.tsx b/src/components/issues/BountyCard.tsx index e188129e..382dbde2 100644 --- a/src/components/issues/BountyCard.tsx +++ b/src/components/issues/BountyCard.tsx @@ -14,6 +14,46 @@ import OpenInNewIcon from '@mui/icons-material/OpenInNew'; import GitHubIcon from '@mui/icons-material/GitHub'; import { IssueBounty } from '../../api/models/Issues'; import { linkResetSx, useLinkBehavior } from '../common/linkBehavior'; + +const TruncatedTooltipTypography: React.FC<{ + text: string; + sx?: any; + placement?: 'bottom' | 'top'; +}> = ({ text, sx, placement = 'bottom' }) => { + const [isTruncated, setIsTruncated] = React.useState(false); + const textRef = React.useRef(null); + + React.useEffect(() => { + const el = textRef.current; + if (el) { + setIsTruncated( + el.scrollHeight > el.clientHeight || el.scrollWidth > el.clientWidth, + ); + } + }, [text]); + + const typography = ( + + {text} + + ); + + return isTruncated ? ( + + {typography} + + ) : ( + typography + ); +}; + import { WatchlistButton } from '../common'; import BountyProgress from './BountyProgress'; import { getIssueStatusMeta } from '../../utils/issueStatus'; @@ -48,6 +88,7 @@ export const BountyCard: React.FC = ({ compact = false, }) => { const owner = issue.repositoryFullName.split('/')[0] || ''; + const [copied, setCopied] = React.useState(false); const statusMeta = getIssueStatusMeta(issue.status); const usdDisplay = formatAlphaToUsd( issue.targetBounty, @@ -118,22 +159,20 @@ export const BountyCard: React.FC = ({ borderColor: theme.palette.border.medium, })} /> - - - {issue.repositoryFullName} - - + = ({ }} > {issue.solverHotkey ? ( - + { + e.preventDefault(); + e.stopPropagation(); + if (issue.solverHotkey) + navigator.clipboard.writeText(issue.solverHotkey); + setCopied(true); + setTimeout(() => setCopied(false), 2000); + }} sx={{ fontSize: '0.75rem', color: STATUS_COLORS.info, - cursor: 'default', + cursor: 'pointer', + '&:hover': { textDecoration: 'underline' }, }} > {`${issue.solverHotkey.slice(0, 6)}…${issue.solverHotkey.slice(-4)}`} diff --git a/src/pages/IssuesPage.tsx b/src/pages/IssuesPage.tsx index b58de9de..712c7779 100644 --- a/src/pages/IssuesPage.tsx +++ b/src/pages/IssuesPage.tsx @@ -122,7 +122,9 @@ const IssuesPage: React.FC = () => { ({ minHeight: 52, '& .MuiTab-root': {