/* * Copyright 2022 The Backstage Authors * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ import { Text, Flex, Link } from '@backstage/ui'; import { DateTime } from 'luxon'; import { Assignees } from './Assignees'; import { CommentsCount } from './CommentsCount'; type IssueCardProps = { title: string; createdAt: string; updatedAt?: string; url: string; authorName: string; assigneeName?: string; assigneeAvatar?: string; authorAvatar?: string; repositoryName: string; commentsCount: number; even: boolean; }; const getElapsedTime = (isoDate: string) => DateTime.fromISO(isoDate).toRelative(); export const IssueCard = (props: IssueCardProps) => { const { title, createdAt, updatedAt, url, assigneeName, assigneeAvatar, authorName, repositoryName, commentsCount, } = props; const handleCardClick = () => { window.open(url, '_blank', 'noopener,noreferrer'); }; const handleKeyDown = (event: React.KeyboardEvent) => { if (event.key === 'Enter' || event.key === ' ') { event.preventDefault(); handleCardClick(); } }; return (

e.stopPropagation()} > {repositoryName}

e.stopPropagation()} > {title}

Created at: {getElapsedTime(createdAt)} by{' '} {authorName} {updatedAt && ( Last update at: {getElapsedTime(updatedAt)} )}

{commentsCount > 0 && }

); };