From 0a592af4dedbb8a9660960a7080aa7c77daf0fe2 Mon Sep 17 00:00:00 2001 From: Ivan Shmidt Date: Mon, 18 May 2020 17:59:12 +0200 Subject: [PATCH] feat: settings -> dialog --- packages/cli/src/commands/plugin/serve.ts | 6 ++ plugins/circleci/dev/index.tsx | 28 ++++++ plugins/circleci/package.json | 42 +++++--- .../src/components/Settings/Settings.tsx | 97 ++++++++++--------- plugins/circleci/src/state/AppState.tsx | 1 - plugins/circleci/src/state/index.ts | 3 + .../circleci/src/state/useBuildWithSteps.ts | 8 +- plugins/circleci/src/state/useBuilds.tsx | 5 - 8 files changed, 118 insertions(+), 72 deletions(-) create mode 100644 plugins/circleci/dev/index.tsx diff --git a/packages/cli/src/commands/plugin/serve.ts b/packages/cli/src/commands/plugin/serve.ts index 5700992644..f9768ec497 100644 --- a/packages/cli/src/commands/plugin/serve.ts +++ b/packages/cli/src/commands/plugin/serve.ts @@ -14,13 +14,19 @@ * limitations under the License. */ +import fs from 'fs-extra'; import { serveBundle } from '../../lib/bundler'; import { Command } from 'commander'; +import { paths } from '../../lib/paths'; export default async (cmd: Command) => { + const pkgPath = paths.resolveTarget('package.json'); + const pkg = await fs.readJson(pkgPath); + const waitForExit = await serveBundle({ entry: 'dev/index', checksEnabled: cmd.check, + proxy: pkg.proxy, }); await waitForExit(); diff --git a/plugins/circleci/dev/index.tsx b/plugins/circleci/dev/index.tsx new file mode 100644 index 0000000000..ed7dd5de9c --- /dev/null +++ b/plugins/circleci/dev/index.tsx @@ -0,0 +1,28 @@ +/* + * Copyright 2020 Spotify AB + * + * 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 { createDevApp } from '@backstage/dev-utils'; +import { plugin } from '../src/plugin'; +import { circleCIApiRef, CircleCIApi } from '../src/api'; + +createDevApp() + .registerPlugin(plugin) + .registerApiFactory({ + deps: {}, + factory: () => new CircleCIApi(), + implements: circleCIApiRef, + }) + .render(); diff --git a/plugins/circleci/package.json b/plugins/circleci/package.json index cd00135004..e3e0372d88 100644 --- a/plugins/circleci/package.json +++ b/plugins/circleci/package.json @@ -3,18 +3,31 @@ "version": "0.1.1-alpha.4", "main": "dist/index.esm.js", "module": "dist/index.esm.js", - "types": "dist/index.d.ts", + "types": "src/index.ts", "license": "Apache-2.0", "private": true, + "proxy": { + "/circleci/api": { + "target": "https://circleci.com/api/v1.1", + "changeOrigin": true, + "pathRewrite": { + "^/circleci/api/": "/" + } + } + }, "scripts": { "build": "backstage-cli plugin:build", "lint": "backstage-cli lint", "test": "backstage-cli test", - "clean": "backstage-cli clean" + "clean": "backstage-cli clean", + "diff": "backstage-cli plugin:diff", + "start": "backstage-cli plugin:serve", + "prepack": "backstage-cli prepack", + "postpack": "backstage-cli postpack" }, "dependencies": { - "@backstage/core": "^0.1.1-alpha.4", - "@backstage/theme": "^0.1.1-alpha.4", + "@backstage/core": "^0.1.1-alpha.5", + "@backstage/theme": "^0.1.1-alpha.5", "@material-ui/core": "^4.9.1", "@material-ui/icons": "^4.9.1", "@material-ui/lab": "4.0.0-alpha.45", @@ -22,24 +35,25 @@ "circleci-api": "^4.0.0", "fast-deep-equal": "^3.1.1", "moment": "^2.25.3", - "react": "16.13.1", - "react-dom": "16.13.1", + "react": "^16.13.1", + "react-dom": "^16.13.1", "react-lazylog": "^4.5.2", "react-router": "^5.1.2", "react-router-dom": "^5.1.2", - "react-use": "^13.0.0" + "react-use": "^14.2.0" }, "devDependencies": { - "@backstage/cli": "^0.1.1-alpha.4", - "@testing-library/jest-dom": "^4.2.4", + "@backstage/cli": "^0.1.1-alpha.5", + "@testing-library/jest-dom": "^5.7.0", "@testing-library/react": "^9.3.2", - "@testing-library/user-event": "^7.1.2", - "@types/jest": "^24.0.0", + "@testing-library/user-event": "^10.2.4", + "@types/jest": "^25.2.1", "@types/node": "^12.0.0", - "@types/testing-library__jest-dom": "5.0.2", - "jest-fetch-mock": "^3.0.3" + "@types/testing-library__jest-dom": "^5.0.4", + "jest-fetch-mock": "^3.0.3", + "@backstage/dev-utils": "^0.1.1-alpha.5" }, "files": [ - "dist" + "dist/**/*.{js,d.ts}" ] } diff --git a/plugins/circleci/src/components/Settings/Settings.tsx b/plugins/circleci/src/components/Settings/Settings.tsx index b33bf59dd8..510af583d2 100644 --- a/plugins/circleci/src/components/Settings/Settings.tsx +++ b/plugins/circleci/src/components/Settings/Settings.tsx @@ -23,6 +23,7 @@ import { Box, Dialog, DialogTitle, + DialogContent, } from '@material-ui/core'; import { Alert } from '@material-ui/lab'; import { useSettings } from '../../state'; @@ -71,54 +72,56 @@ const Settings = () => { Project Credentials {/* {authed ? : } */} - - - setToken(e.target.value)} - /> - - - setOwner(e.target.value)} - /> - - - setRepo(e.target.value)} - /> - - - - - - - + onChange={(e) => setToken(e.target.value)} + /> + + + setOwner(e.target.value)} + /> + + + setRepo(e.target.value)} + /> + + + + + + + + ); diff --git a/plugins/circleci/src/state/AppState.tsx b/plugins/circleci/src/state/AppState.tsx index 2e98f86661..720b660ccd 100644 --- a/plugins/circleci/src/state/AppState.tsx +++ b/plugins/circleci/src/state/AppState.tsx @@ -48,7 +48,6 @@ const reducer: Reducer = (state, action) => { export const AppStateProvider: FC = ({ children }) => { const [state, dispatch] = useReducer(reducer, initialState); - return ( <>{children} diff --git a/plugins/circleci/src/state/index.ts b/plugins/circleci/src/state/index.ts index 4ef67f62ea..2321103eb4 100644 --- a/plugins/circleci/src/state/index.ts +++ b/plugins/circleci/src/state/index.ts @@ -14,3 +14,6 @@ * limitations under the License. */ export * from './AppState'; +export * from './useSettings'; +export * from './useBuilds'; +export * from './useBuildWithSteps'; diff --git a/plugins/circleci/src/state/useBuildWithSteps.ts b/plugins/circleci/src/state/useBuildWithSteps.ts index 4c9f6a0c42..8abc08f580 100644 --- a/plugins/circleci/src/state/useBuildWithSteps.ts +++ b/plugins/circleci/src/state/useBuildWithSteps.ts @@ -27,6 +27,9 @@ export function useBuildWithSteps(buildId: number) { const errorApi = useApi(errorApiRef); const getBuildWithSteps = useCallback(async () => { + if (owner === '' || repo === '' || token === '') { + return; + } try { const options = { token: token, @@ -44,11 +47,6 @@ export function useBuildWithSteps(buildId: number) { } }, [token, owner, repo, buildId]); - const { startPolling, stopPolling } = useAsyncPolling( - getBuildWithSteps, - INTERVAL_AMOUNT, - ); - const restartBuild = async () => { try { await api.retry(buildId, { diff --git a/plugins/circleci/src/state/useBuilds.tsx b/plugins/circleci/src/state/useBuilds.tsx index c29b05890c..4435c2b8bd 100644 --- a/plugins/circleci/src/state/useBuilds.tsx +++ b/plugins/circleci/src/state/useBuilds.tsx @@ -103,11 +103,6 @@ export function useBuilds() { [repo, token, owner], ); - const { startPolling, stopPolling } = useAsyncPolling( - getBuilds, - INTERVAL_AMOUNT, - ); - const restartBuild = async (buildId: number) => { try { await api.retry(buildId, {