From e782b5cd48772fbd8bac044f686748cd5d17a77c Mon Sep 17 00:00:00 2001 From: Nikita Nek Dudnik Date: Thu, 16 Jul 2020 16:24:09 +0200 Subject: [PATCH] fix: use gitgub token from UI --- packages/app/src/apis.ts | 4 +-- .../src/api/GithubActionsApi.ts | 8 +++++ .../src/api/GithubActionsClient.ts | 22 +++++++++----- .../BuildDetailsPage/BuildDetailsPage.tsx | 29 ++++++++++--------- .../BuildInfoCard/BuildInfoCard.tsx | 6 ++-- .../components/BuildListTable/useBuilds.ts | 18 +++++++----- 6 files changed, 53 insertions(+), 34 deletions(-) diff --git a/packages/app/src/apis.ts b/packages/app/src/apis.ts index ca0e2298cf..cac3d6e171 100644 --- a/packages/app/src/apis.ts +++ b/packages/app/src/apis.ts @@ -58,7 +58,6 @@ import { import { scaffolderApiRef, ScaffolderApi } from '@backstage/plugin-scaffolder'; import { rollbarApiRef, RollbarClient } from '@backstage/plugin-rollbar'; -import { Octokit } from '@octokit/rest'; import { GithubActionsClient, githubActionsApiRef, @@ -84,8 +83,7 @@ export const apis = (config: ConfigApi) => { new CircleCIApi(`${backendUrl}/proxy/circleci/api`), ); - const octokit = new Octokit({ auth: process.env.GITHUB_ACCESS_TOKEN }); - builder.add(githubActionsApiRef, new GithubActionsClient({ api: octokit })); + builder.add(githubActionsApiRef, new GithubActionsClient()); builder.add(featureFlagsApiRef, new FeatureFlags()); diff --git a/plugins/github-actions/src/api/GithubActionsApi.ts b/plugins/github-actions/src/api/GithubActionsApi.ts index e6d5ff9ea6..eedf9686f3 100644 --- a/plugins/github-actions/src/api/GithubActionsApi.ts +++ b/plugins/github-actions/src/api/GithubActionsApi.ts @@ -28,39 +28,47 @@ export const githubActionsApiRef = createApiRef({ export type GithubActionsApi = { listWorkflowRuns: ({ + token, owner, repo, pageSize, page, }: { + token: string; owner: string; repo: string; pageSize?: number; page?: number; }) => Promise; getWorkflow: ({ + token, owner, repo, id, }: { + token: string; owner: string; repo: string; id: number; }) => Promise; getWorkflowRun: ({ + token, owner, repo, id, }: { + token: string; owner: string; repo: string; id: number; }) => Promise; reRunWorkflow: ({ + token, owner, repo, runId, }: { + token: string; owner: string; repo: string; runId: number; diff --git a/plugins/github-actions/src/api/GithubActionsClient.ts b/plugins/github-actions/src/api/GithubActionsClient.ts index c2efa44539..1606c268f4 100644 --- a/plugins/github-actions/src/api/GithubActionsClient.ts +++ b/plugins/github-actions/src/api/GithubActionsClient.ts @@ -23,37 +23,39 @@ import { } from '@octokit/types'; export class GithubActionsClient implements GithubActionsApi { - private api: Octokit; - constructor({ api }: { api: Octokit }) { - this.api = api; - } reRunWorkflow({ + token, owner, repo, runId, }: { + token: string; owner: string; repo: string; runId: number; }) { - this.api.actions.reRunWorkflow({ + new Octokit({ auth: token }).actions.reRunWorkflow({ owner, repo, run_id: runId, }); } async listWorkflowRuns({ + token, owner, repo, pageSize = 100, page = 0, }: { + token: string; owner: string; repo: string; pageSize?: number; page?: number; }): Promise { - const workflowRuns = await this.api.actions.listWorkflowRunsForRepo({ + const workflowRuns = await new Octokit({ + auth: token, + }).actions.listWorkflowRunsForRepo({ owner, repo, per_page: pageSize, @@ -62,15 +64,17 @@ export class GithubActionsClient implements GithubActionsApi { return workflowRuns.data; } async getWorkflow({ + token, owner, repo, id, }: { + token: string; owner: string; repo: string; id: number; }): Promise { - const workflow = await this.api.actions.getWorkflow({ + const workflow = await new Octokit({ auth: token }).actions.getWorkflow({ owner, repo, workflow_id: id, @@ -78,15 +82,17 @@ export class GithubActionsClient implements GithubActionsApi { return workflow.data; } async getWorkflowRun({ + token, owner, repo, id, }: { + token: string; owner: string; repo: string; id: number; }): Promise { - const run = await this.api.actions.getWorkflowRun({ + const run = await new Octokit({ auth: token }).actions.getWorkflowRun({ owner, repo, run_id: id, diff --git a/plugins/github-actions/src/components/BuildDetailsPage/BuildDetailsPage.tsx b/plugins/github-actions/src/components/BuildDetailsPage/BuildDetailsPage.tsx index fd77f93c86..55c568106c 100644 --- a/plugins/github-actions/src/components/BuildDetailsPage/BuildDetailsPage.tsx +++ b/plugins/github-actions/src/components/BuildDetailsPage/BuildDetailsPage.tsx @@ -30,7 +30,7 @@ import { import React from 'react'; import { useParams } from 'react-router-dom'; import { useAsync } from 'react-use'; -import { Link, useApi } from '@backstage/core'; +import { Link, useApi, githubAuthApiRef } from '@backstage/core'; import { githubActionsApiRef } from '../../api'; const useStyles = makeStyles(theme => ({ @@ -50,22 +50,23 @@ export const BuildDetailsPage = () => { const repo = 'try-ssr'; const owner = 'CircleCITest3'; const api = useApi(githubActionsApiRef); + const auth = useApi(githubAuthApiRef); const classes = useStyles(); const { id } = useParams(); - const status = useAsync( - () => - api - .getWorkflowRun({ - owner, - repo, - id: parseInt(id, 10), - }) - .then(data => { - return data; - }), - [location.search], - ); + const status = useAsync(async () => { + const token = await auth.getAccessToken(['repo', 'user']); + return api + .getWorkflowRun({ + token, + owner, + repo, + id: parseInt(id, 10), + }) + .then(data => { + return data; + }); + }, [location.search]); if (status.loading) { return ; diff --git a/plugins/github-actions/src/components/BuildInfoCard/BuildInfoCard.tsx b/plugins/github-actions/src/components/BuildInfoCard/BuildInfoCard.tsx index f26b153435..acc1b496ec 100644 --- a/plugins/github-actions/src/components/BuildInfoCard/BuildInfoCard.tsx +++ b/plugins/github-actions/src/components/BuildInfoCard/BuildInfoCard.tsx @@ -28,7 +28,7 @@ import React from 'react'; import { useAsync } from 'react-use'; import { BuildStatusIndicator } from '../BuildStatusIndicator'; import { githubActionsApiRef, BuildStatus } from '../../api'; -import { Link, useApi } from '@backstage/core'; +import { Link, useApi, githubAuthApiRef } from '@backstage/core'; const useStyles = makeStyles(theme => ({ root: { @@ -41,9 +41,11 @@ const useStyles = makeStyles(theme => ({ const BuildInfoCardContent = () => { const api = useApi(githubActionsApiRef); + const auth = useApi(githubAuthApiRef); const status = useAsync(async () => { - return api.listWorkflowRuns({ owner: 'spotify', repo: 'backstage' }); + const token = await auth.getAccessToken(['repo', 'user']); + return api.listWorkflowRuns({ token, owner: 'spotify', repo: 'backstage' }); }); if (status.loading) { diff --git a/plugins/github-actions/src/components/BuildListTable/useBuilds.ts b/plugins/github-actions/src/components/BuildListTable/useBuilds.ts index 6d21df2df9..7b93e178d6 100644 --- a/plugins/github-actions/src/components/BuildListTable/useBuilds.ts +++ b/plugins/github-actions/src/components/BuildListTable/useBuilds.ts @@ -17,11 +17,12 @@ import { useState } from 'react'; import { useAsyncRetry } from 'react-use'; import { Build } from './BuildListTable'; import { githubActionsApiRef } from '../../api/GithubActionsApi'; -import { useApi } from '@backstage/core'; +import { useApi, githubAuthApiRef } from '@backstage/core'; import { ActionsListWorkflowRunsForRepoResponseData } from '@octokit/types'; export function useBuilds({ repo, owner }: { repo: string; owner: string }) { const api = useApi(githubActionsApiRef); + const auth = useApi(githubAuthApiRef); const [total, setTotal] = useState(0); const [page, setPage] = useState(0); @@ -29,11 +30,13 @@ export function useBuilds({ repo, owner }: { repo: string; owner: string }) { const restartBuild = async () => {}; - const { loading, value: builds, retry } = useAsyncRetry( - () => + const { loading, value: builds, retry } = useAsyncRetry(async () => { + const token = await auth.getAccessToken(['repo', 'user']); + + return ( api // GitHub API pagination count starts from 1 - .listWorkflowRuns({ owner, repo, pageSize, page: page + 1 }) + .listWorkflowRuns({ token, owner, repo, pageSize, page: page + 1 }) .then( (allBuilds: ActionsListWorkflowRunsForRepoResponseData): Build[] => { setTotal(allBuilds.total_count); @@ -43,6 +46,7 @@ export function useBuilds({ repo, owner }: { repo: string; owner: string }) { id: `${run.id}`, onRestartClick: () => { api.reRunWorkflow({ + token, owner, repo, runId: run.id, @@ -62,9 +66,9 @@ export function useBuilds({ repo, owner }: { repo: string; owner: string }) { buildUrl: run.url, })); }, - ), - [page, pageSize], - ); + ) + ); + }, [page, pageSize]); const projectName = `${owner}/${repo}`; return [