paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 29 Packages Projects Releases Wiki Activity

fix: prettier formating

Browse Source 
Signed-off-by: Talita Gregory Nunes Freire <talita.freire@dazn.com>
This commit is contained in:
Talita Gregory Nunes Freire
2022-04-28 09:48:26 +02:00
parent b514d7f78b
commit 6d8267c3d0
17 changed files with 233 additions and 188 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plugins/github-pull-requests-board/src/api/useGetPullRequestDetails.ts
+58 -53
View File
@@ -21,66 +21,71 @@ import { useOctokitGraphQl } from './useOctokitGraphQl';
export const useGetPullRequestDetails = () => {
const graphql = useOctokitGraphQl<GraphQlPullRequest<PullRequest>>();
const fn = React.useRef(async (repo: string, number: number): Promise<PullRequest> => {
const [ organisation, repositoryName ] = repo.split('/');
const fn = React.useRef(
async (repo: string, number: number): Promise<PullRequest> => {
const [organisation, repositoryName] = repo.split('/');
const { repository } = await graphql(`
query($name: String!, $owner: String!, $pull_number: Int!) {
repository(name: $name, owner: $owner) {
pullRequest(number: $pull_number) {
id
repository {
name
}
title
url
createdAt
lastEditedAt
latestReviews(first: 10) {
nodes {
author {
login
avatarUrl
... on User {
id
email
const { repository } = await graphql(
`
query ($name: String!, $owner: String!, $pull_number: Int!) {
repository(name: $name, owner: $owner) {
pullRequest(number: $pull_number) {
id
repository {
name
login
}
title
url
createdAt
lastEditedAt
latestReviews(first: 10) {
nodes {
author {
login
avatarUrl
... on User {
id
email
name
login
}
}
state
}
}
mergeable
state
reviewDecision
isDraft
createdAt
author {
... on User {
id
email
avatarUrl
name
login
}
... on Bot {
id
avatarUrl
login
}
}
}
state
}
}
mergeable
state
reviewDecision
isDraft
createdAt
author {
... on User {
id
email
avatarUrl
name
login
}
... on Bot {
id
avatarUrl
login
}
}
}
}
}
`, {
'name': repositoryName,
'owner': organisation,
'pull_number': number
});
`,
{
name: repositoryName,
owner: organisation,
pull_number: number,
},
);
return repository.pullRequest
});
return repository.pullRequest;
},
);
return fn.current;
};
plugins/github-pull-requests-board/src/api/useGetPullRequestsFromRepository.ts
+25 -19
View File
@@ -19,30 +19,36 @@ import { GraphQlPullRequests, PullRequestsNumber } from '../utils/types';
import { useOctokitGraphQl } from './useOctokitGraphQl';
export const useGetPullRequestsFromRepository = () => {
const graphql = useOctokitGraphQl<GraphQlPullRequests<PullRequestsNumber[]>>();
const graphql =
useOctokitGraphQl<GraphQlPullRequests<PullRequestsNumber[]>>();
const fn = React.useRef(async (repo: string): Promise<PullRequestsNumber[]> => {
const [ organisation, repositoryName ] = repo.split('/');
const fn = React.useRef(
async (repo: string): Promise<PullRequestsNumber[]> => {
const [organisation, repositoryName] = repo.split('/');
const { repository } = await graphql(`
query($name: String!, $owner: String!) {
repository(name: $name, owner: $owner) {
pullRequests(states: OPEN, first: 10) {
edges {
node {
number
const { repository } = await graphql(
`
query ($name: String!, $owner: String!) {
repository(name: $name, owner: $owner) {
pullRequests(states: OPEN, first: 10) {
edges {
node {
number
}
}
}
}
}
}
}
}
`, {
'name': repositoryName,
'owner': organisation,
});
`,
{
name: repositoryName,
owner: organisation,
},
);
return repository.pullRequests.edges
});
return repository.pullRequests.edges;
},
);
return fn.current;
};
plugins/github-pull-requests-board/src/api/useOctokitGraphQl.ts
+1 -1
View File
@@ -28,7 +28,7 @@ export const useOctokitGraphQl = <T>() => {
const config = useApi(configApiRef);
const baseUrl = readGitHubIntegrationConfigs(
config.getOptionalConfigArray('providers.github') ?? [],
config.getOptionalConfigArray('integrations.github') ?? [],
)[0].apiBaseUrl;
return (path: string, options?: any): Promise<T> =>
plugins/github-pull-requests-board/src/components/Card/Card.tsx
+4 -4
View File
@@ -25,7 +25,7 @@ type Props = {
authorName: string;
authorAvatar?: string;
repositoryName: string;
}
};
const Card: FunctionComponent<Props> = (props: PropsWithChildren<Props>) => {
const {
@@ -36,13 +36,13 @@ const Card: FunctionComponent<Props> = (props: PropsWithChildren<Props>) => {
authorName,
authorAvatar,
repositoryName,
children
children,
} = props;
return (
<Box marginBottom={1}>
<Paper variant='outlined'>
<CardActionArea href={prUrl} target='_blank'>
<Paper variant="outlined">
<CardActionArea href={prUrl} target="_blank">
<Box padding={1}>
<CardHeader
title={title}
plugins/github-pull-requests-board/src/components/Card/CardHeader.tsx
+11 -14
View File
@@ -25,7 +25,7 @@ type Props = {
authorName: string;
authorAvatar?: string;
repositoryName: string;
}
};
const CardHeader = (props: Props) => {
const {
@@ -39,29 +39,26 @@ const CardHeader = (props: Props) => {
return (
<>
<Box display='flex' justifyContent='space-between'>
<Typography color='textSecondary' variant='body2' component='p'>
<Box display="flex" justifyContent="space-between">
<Typography color="textSecondary" variant="body2" component="p">
{repositoryName}
</Typography>
<UserHeader name={authorName} avatar={authorAvatar} />
</Box>
<Typography component='h3'>
<Typography component="h3">
<b>{title}</b>
</Typography>
<Box display='flex' justifyContent='space-between' marginY={1}>
<Typography variant='body2' component='p'>
<Box display="flex" justifyContent="space-between" marginY={1}>
<Typography variant="body2" component="p">
Created at: <strong>{getElapsedTime(createdAt)}</strong>
</Typography>
{
updatedAt && (
<Typography variant='body2' component='p'>
Last update: <strong>{getElapsedTime(updatedAt)}</strong>
</Typography>
)
}
{updatedAt && (
<Typography variant="body2" component="p">
Last update: <strong>{getElapsedTime(updatedAt)}</strong>
</Typography>
)}
</Box>
</>
);
};
plugins/github-pull-requests-board/src/components/InfoCardHeader/InfoCardHeader.tsx
+14 -14
View File
@@ -18,23 +18,23 @@ import { Typography, Box, IconButton } from '@material-ui/core';
import RefreshIcon from '@material-ui/icons/Refresh';
type Props = {
onRefresh: () => void;
}
onRefresh: () => void;
};
const InfoCardHeader = (props: PropsWithChildren<Props>) => {
const { children, onRefresh } = props;
const { children, onRefresh } = props;
return (
<Box display="flex" justifyContent="space-between" alignItems="center">
<Box display="flex" alignItems="center">
<Typography variant="h5">Open pull requests</Typography>
<IconButton color="secondary" onClick={onRefresh}>
<RefreshIcon />
</IconButton>
</Box>
{children}
</Box>
);
return (
<Box display="flex" justifyContent="space-between" alignItems="center">
<Box display="flex" alignItems="center">
<Typography variant="h5">Open pull requests</Typography>
<IconButton color="secondary" onClick={onRefresh}>
<RefreshIcon />
</IconButton>
</Box>
{children}
</Box>
);
};
export default InfoCardHeader;
plugins/github-pull-requests-board/src/components/PullRequestBoardOptions/PullRequestBoardOptions.tsx
+15 -14
View File
@@ -22,13 +22,13 @@ type Option = {
icon: ReactNode;
value: string;
ariaLabel: string;
}
};
type Props = {
value: string[];
onClickOption: (selectedOptions: PRCardFormating[]) => void;
options: Option[];
}
};
const PullRequestBoardOptions = (props: Props) => {
const { value, onClickOption, options } = props;
@@ -39,19 +39,20 @@ const PullRequestBoardOptions = (props: Props) => {
onChange={(_event, selectedOptions) => onClickOption(selectedOptions)}
aria-label="Pull Request board settings"
>
{
options.map(({ icon, value: toggleValue, ariaLabel }, index) => (
<ToggleButton value={toggleValue} aria-label={ariaLabel} key={`${ariaLabel}-${index}`}>
<Tooltip title={ariaLabel}>
<Box display='flex' justifyContent='center' alignItems='center'>
{icon}
</Box>
</Tooltip>
</ToggleButton>
))
}
{options.map(({ icon, value: toggleValue, ariaLabel }, index) => (
<ToggleButton
value={toggleValue}
aria-label={ariaLabel}
key={`${ariaLabel}-${index}`}
>
<Tooltip title={ariaLabel}>
<Box display="flex" justifyContent="center" alignItems="center">
{icon}
</Box>
</Tooltip>
</ToggleButton>
))}
</ToggleButtonGroup>
);
};
plugins/github-pull-requests-board/src/components/PullRequestCard/PullRequestCard.tsx
+20 -6
View File
@@ -14,7 +14,11 @@
* limitations under the License.
*/
import React, { FunctionComponent } from 'react';
import { getApprovedReviews, getChangeRequests, getCommentedReviews } from '../../utils/functions';
import {
getApprovedReviews,
getChangeRequests,
getCommentedReviews,
} from '../../utils/functions';
import { Reviews, Author } from '../../utils/types';
import { Card } from '../Card';
import { UserHeaderList } from '../UserHeaderList';
@@ -28,7 +32,7 @@ type Props = {
reviews: Reviews;
repositoryName: string;
isDraft: boolean;
}
};
const PullRequestCard: FunctionComponent<Props> = (props: Props) => {
const {
@@ -59,16 +63,26 @@ const PullRequestCard: FunctionComponent<Props> = (props: Props) => {
prUrl={url}
>
{!!approvedReviews.length && (
<UserHeaderList label='👍' users={approvedReviews.map(({ author: reviewAuthor }) => reviewAuthor)} />
<UserHeaderList
label="👍"
users={approvedReviews.map(
({ author: reviewAuthor }) => reviewAuthor,
)}
/>
)}
{!!commentsReviews.length && (
<UserHeaderList
label='💬'
users={commentsReviews.map(({ author: reviewAuthor }) => reviewAuthor)}
label="💬"
users={commentsReviews.map(
({ author: reviewAuthor }) => reviewAuthor,
)}
/>
)}
{!!changeRequests.length && (
<UserHeaderList label='🚧' users={changeRequests.map(({ author: reviewAuthor }) => reviewAuthor)} />
<UserHeaderList
label="🚧"
users={changeRequests.map(({ author: reviewAuthor }) => reviewAuthor)}
/>
)}
</Card>
);
plugins/github-pull-requests-board/src/components/TeamPullRequestsPage/index.ts
+15
View File
@@ -1 +1,16 @@
/*
* 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.
*/
export { default as TeamPullRequestsPage } from './TeamPullRequestsPage';
plugins/github-pull-requests-board/src/components/UserHeader/UserHeader.tsx
+7 -12
View File
@@ -14,24 +14,19 @@
* limitations under the License.
*/
import React from 'react';
import {
Typography,
Box,
Avatar,
makeStyles
} from '@material-ui/core';
import { Typography, Box, Avatar, makeStyles } from '@material-ui/core';
type Props = {
name: string;
avatar?: string;
}
};
const useStyles = makeStyles((theme) => ({
const useStyles = makeStyles(theme => ({
small: {
width: theme.spacing(4),
height: theme.spacing(4),
marginLeft: theme.spacing(1)
}
marginLeft: theme.spacing(1),
},
}));
const UserHeader = (props: Props) => {
@@ -39,8 +34,8 @@ const UserHeader = (props: Props) => {
const classes = useStyles();
return (
<Box display='flex' alignItems='center' marginX={1}>
<Typography color='textSecondary' variant='body2' component='p'>
<Box display="flex" alignItems="center" marginX={1}>
<Typography color="textSecondary" variant="body2" component="p">
{name}
</Typography>
<Avatar alt={name} src={avatar} className={classes.small} />
plugins/github-pull-requests-board/src/components/UserHeaderList/UserHeaderList.tsx
+12 -4
View File
@@ -23,15 +23,23 @@ import { Author } from '../../utils/types';
type Props = {
label?: string;
users: Author[];
}
};
const UserHeaderList = (props: Props) => {
const { users, label } = props;
return (
<Box display='flex' width='100%' alignItems='center' marginY={2} flexWrap='wrap'>
{label && <Typography variant='subtitle2'>{label}</Typography>}
{filterSameUser(users).map(({ login, avatarUrl }) => <UserHeader name={login} avatar={avatarUrl} key={login} />)}
<Box
display="flex"
width="100%"
alignItems="center"
marginY={2}
flexWrap="wrap"
>
{label && <Typography variant="subtitle2">{label}</Typography>}
{filterSameUser(users).map(({ login, avatarUrl }) => (
<UserHeader name={login} avatar={avatarUrl} key={login} />
))}
</Box>
);
};
plugins/github-pull-requests-board/src/components/Wrapper/Wrapper.tsx
+3 -3
View File
@@ -18,18 +18,18 @@ import { Grid, Box } from '@material-ui/core';
type Props = {
fullscreen: boolean;
}
};
const Wrapper = (props: PropsWithChildren<Props>) => {
const { children, fullscreen } = props;
return (
<Grid item xs>
<Box maxHeight={fullscreen ? '100vh' : '50vh'} overflow='auto'>
<Box maxHeight={fullscreen ? '100vh' : '50vh'} overflow="auto">
{children}
</Box>
</Grid>
)
);
};
export default Wrapper;
plugins/github-pull-requests-board/src/hooks/usePullRequestsByTeam.tsx
+23 -21
View File
@@ -25,39 +25,42 @@ export function usePullRequestsByTeam(repositories: string[]) {
const getPullRequests = useGetPullRequestsFromRepository();
const getPullRequestDetails = useGetPullRequestDetails();
const getPRsPerRepository = useCallback(async (repository: string): Promise<PullRequests> => {
const getPRsPerRepository = useCallback(
async (repository: string): Promise<PullRequests> => {
const pullRequestsNumbers = await getPullRequests(repository);
const pullRequestsNumbers = await getPullRequests(repository)
const pullRequestsWithDetails = await Promise.all(
pullRequestsNumbers.map(async ({ node }) => {
const pullRequest = await getPullRequestDetails(
repository,
node.number,
);
const pullRequestsWithDetails = await Promise.all(
pullRequestsNumbers.map(async ({ node }) => {
const pullRequest = await getPullRequestDetails(
repository,
node.number,
);
return pullRequest;
}),
);
return pullRequest;
}),
);
return pullRequestsWithDetails;
}, [getPullRequests, getPullRequestDetails]);
return pullRequestsWithDetails;
},
[getPullRequests, getPullRequestDetails],
);
const getPRsFromTeam = useCallback(
async (teamRepositories: string[]): Promise<PullRequests> => {
const teamRepositoriesPromises = teamRepositories.map(repository =>
getPRsPerRepository(repository),
);
const teamPullRequests = await Promise.allSettled(teamRepositoriesPromises)
.then(promises => promises.reduce((acc, curr) => {
const teamPullRequests = await Promise.allSettled(
teamRepositoriesPromises,
).then(promises =>
promises.reduce((acc, curr) => {
if (curr.status === 'fulfilled') {
return [...acc, ...curr.value];
}
return acc;
}, [] as PullRequests)
);
}, [] as PullRequests),
);
return teamPullRequests;
},
@@ -70,11 +73,10 @@ export function usePullRequestsByTeam(repositories: string[]) {
const teamPullRequests = await getPRsFromTeam(repositories);
setPullRequests(formatPRsByReviewDecision(teamPullRequests));
setLoading(false);
}, [getPRsFromTeam, repositories]);
useEffect(() => {
getAllPullRequests()
getAllPullRequests();
}, [getAllPullRequests]);
return {
plugins/github-pull-requests-board/src/hooks/useUserRepositories.tsx
+2 -2
View File
@@ -33,14 +33,14 @@ export function useUserRepositories() {
});
const entitiesNames: string[] = entitiesList.items.map(componentEntity =>
getProjectNameFromEntity(componentEntity)
getProjectNameFromEntity(componentEntity),
);
setRepositories([...new Set(entitiesNames)]);
}, [catalogApi, teamEntity?.metadata?.name]);
useEffect(() => {
getRepositoriesNames()
getRepositoriesNames();
}, [getRepositoriesNames]);
return {
plugins/github-pull-requests-board/src/plugin.ts
+3 -1
View File
@@ -43,7 +43,9 @@ export const TeamPullRequestsPage = githubPullRequestsBoardPlugin.provide(
createRoutableExtension({
name: 'PullRequestPage',
component: () =>
import('./components/TeamPullRequestsPage').then(m => m.TeamPullRequestsPage),
import('./components/TeamPullRequestsPage').then(
m => m.TeamPullRequestsPage,
),
mountPoint: rootRouteRef,
}),
);
plugins/github-pull-requests-board/src/utils/constants.ts
+4 -4
View File
@@ -14,7 +14,7 @@
* limitations under the License.
*/
export const COLUMNS = Object.freeze({
REVIEW_REQUIRED: '🔍 Review required',
REVIEW_IN_PROGRESS: '📝 Review in progress',
APPROVED: '👍 Approved'
})
REVIEW_REQUIRED: '🔍 Review required',
REVIEW_IN_PROGRESS: '📝 Review in progress',
APPROVED: '👍 Approved',
});
plugins/github-pull-requests-board/src/utils/types.tsx
+16 -16
View File
@@ -15,31 +15,31 @@
*/
export type GraphQlPullRequest<T> = {
repository: {
pullRequest: T
}
}
pullRequest: T;
};
};
export type GraphQlPullRequests<T> = {
repository: {
pullRequests: {
edges: T
}
}
}
edges: T;
};
};
};
export type PullRequestsNumber = {
node: {
number: number;
}
}
};
};
export type Review = {
state:
| 'PENDING'
| 'COMMENTED'
| 'APPROVED'
| 'CHANGES_REQUESTED'
| 'DISMISSED';
| 'PENDING'
| 'COMMENTED'
| 'APPROVED'
| 'CHANGES_REQUESTED'
| 'DISMISSED';
author: Author;
};
@@ -69,7 +69,7 @@ export type PullRequest = {
reviewDecision: ReviewDecision | null;
isDraft: boolean;
createdAt: string;
author: Author
author: Author;
};
export type PullRequests = PullRequest[];
@@ -81,4 +81,4 @@ export type PullRequestsColumn = {
export type PRCardFormating = 'compacted' | 'fullscreen' | 'draft';
export type ReviewDecision = 'IN_PROGRESS' | 'APPROVED' | 'REVIEW_REQUIRED'
export type ReviewDecision = 'IN_PROGRESS' | 'APPROVED' | 'REVIEW_REQUIRED';