/* * Copyright 2021 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 { Avatar, Link } from '@backstage/core-components'; import Card from '@material-ui/core/Card'; import CardContent from '@material-ui/core/CardContent'; import CardHeader from '@material-ui/core/CardHeader'; import Typography from '@material-ui/core/Typography'; import { AutoCompleteIcon } from '../AutoCompleteIcon'; import { DashboardPullRequest } from '@backstage-community/plugin-azure-devops-common'; import { DateTime } from 'luxon'; import { PullRequestCardPolicies } from './PullRequestCardPolicies'; import { PullRequestCardReviewers } from './PullRequestCardReviewers'; import { makeStyles } from '@material-ui/core/styles'; const useStyles = makeStyles( theme => ({ card: { backgroundColor: theme.palette.type === 'dark' ? theme.palette.grey[700] : theme.palette.common.white, }, cardHeaderSimplified: { paddingBottom: theme.spacing(2), }, cardHeaderAction: { display: 'flex', alignSelf: 'center', margin: 0, }, content: { display: 'flex', flexDirection: 'row', }, policies: { flex: 1, }, avatar: { width: '2.5rem', height: '2.5rem' }, avatarText: { fontSize: '1rem' }, }), { name: 'PullRequestCard' }, ); type PullRequestCardProps = { pullRequest: DashboardPullRequest; simplified?: boolean; }; export const PullRequestCard = ({ pullRequest, simplified, }: PullRequestCardProps) => { const classes = useStyles(); const title = ( {pullRequest.title} ); const repoLink = ( {pullRequest.repository?.name} ); const creationDate = pullRequest.creationDate ? DateTime.fromISO(pullRequest.creationDate).toRelative() : undefined; const subheader = ( {repoLink} · {creationDate} ); const avatar = ( ); return ( } classes={{ ...(simplified && { root: classes.cardHeaderSimplified }), action: classes.cardHeaderAction, }} /> {!simplified && ( {pullRequest.policies && ( )} {pullRequest.reviewers && ( )} )} ); };