diff --git a/plugins/circleci/src/components/App.tsx b/plugins/circleci/src/components/App.tsx index 46b70cb500..1649c01b70 100644 --- a/plugins/circleci/src/components/App.tsx +++ b/plugins/circleci/src/components/App.tsx @@ -14,9 +14,9 @@ * limitations under the License. */ import React from 'react'; -import { Switch, Route } from 'react-router'; -import { BuildsPage } from '../pages/BuildsPage'; -import { DetailedViewPage } from '../pages/BuildWithStepsPage'; +import { Switch, Route, MemoryRouter } from 'react-router'; +import { BuildsPage, Builds } from '../pages/BuildsPage'; +import { DetailedViewPage, BuildWithSteps } from '../pages/BuildWithStepsPage'; import { AppStateProvider } from '../state'; import { Settings } from './Settings'; @@ -37,3 +37,24 @@ export const App = () => { ); }; + +// TODO: allow pass in settings as props +// When some shared settings workflow +// will be established +export const CircleCIWidget = () => ( + + + <> + + + + + + + + +); diff --git a/plugins/circleci/src/index.ts b/plugins/circleci/src/index.ts index 9a0a37f415..fd0360b71c 100644 --- a/plugins/circleci/src/index.ts +++ b/plugins/circleci/src/index.ts @@ -18,3 +18,4 @@ export { plugin } from './plugin'; export * from './api'; export * from './proxy'; export * from './navTargets'; +export { CircleCIWidget } from './components/App'; diff --git a/plugins/circleci/src/navTargets.tsx b/plugins/circleci/src/navTargets.tsx new file mode 100644 index 0000000000..14284a1d93 --- /dev/null +++ b/plugins/circleci/src/navTargets.tsx @@ -0,0 +1,42 @@ +/* + * 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 React, { FC } from 'react'; +import { createNavTarget } from '@backstage/core'; +import { SvgIcon, SvgIconProps } from '@material-ui/core'; + +const CircleCIIcon: FC = (props) => ( + + + + + +); + +export const navTargetCircleCI = createNavTarget({ + icon: CircleCIIcon, + path: '/circleci', + title: 'CircleCI', +}); diff --git a/plugins/circleci/src/pages/BuildWithStepsPage/BuildWithStepsPage.tsx b/plugins/circleci/src/pages/BuildWithStepsPage/BuildWithStepsPage.tsx index 041c495c90..8493913576 100644 --- a/plugins/circleci/src/pages/BuildWithStepsPage/BuildWithStepsPage.tsx +++ b/plugins/circleci/src/pages/BuildWithStepsPage/BuildWithStepsPage.tsx @@ -92,7 +92,15 @@ const pickClassName = ( return classes.neutral; }; -const BuildWithStepsPage: FC<{}> = () => { +const Page = () => ( + + + + + +); + +const BuildWithStepsView: FC<{}> = () => { const { buildId = '' } = useParams(); const classes = useStyles(); const [settings] = useSettings(); @@ -106,23 +114,21 @@ const BuildWithStepsPage: FC<{}> = () => { }, [buildId, settings]); return ( - - - + <> + - - - } - cardClassName={classes.cardContent} - > - {loading ? : } - - + + + } + cardClassName={classes.cardContent} + > + {loading ? : } + - - + + ); }; @@ -156,4 +162,5 @@ const ActionsList: FC<{ actions: BuildStepAction[]; name: string }> = ({ ); }; -export default BuildWithStepsPage; +export default Page; +export { BuildWithStepsView as BuildWithSteps }; diff --git a/plugins/circleci/src/pages/BuildWithStepsPage/index.ts b/plugins/circleci/src/pages/BuildWithStepsPage/index.ts index 2fb1f48e12..fddff7088c 100644 --- a/plugins/circleci/src/pages/BuildWithStepsPage/index.ts +++ b/plugins/circleci/src/pages/BuildWithStepsPage/index.ts @@ -13,4 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -export { default as DetailedViewPage } from './BuildWithStepsPage'; +export { + default as DetailedViewPage, + BuildWithSteps, +} from './BuildWithStepsPage'; diff --git a/plugins/circleci/src/pages/BuildsPage/BuildsPage.tsx b/plugins/circleci/src/pages/BuildsPage/BuildsPage.tsx index 01593ebf4d..7b124c03c1 100644 --- a/plugins/circleci/src/pages/BuildsPage/BuildsPage.tsx +++ b/plugins/circleci/src/pages/BuildsPage/BuildsPage.tsx @@ -16,21 +16,28 @@ import React, { FC } from 'react'; import { Content } from '@backstage/core'; import { Grid } from '@material-ui/core'; -import { Builds } from './lib/Builds'; +import { Builds as BuildsComp } from './lib/Builds'; import { Layout } from '../../components/Layout'; import { PluginHeader } from '../../components/PluginHeader'; const BuildsPage: FC<{}> = () => ( - - - - - - + ); +const Builds = () => ( + <> + + + + + + + +); + export default BuildsPage; +export { Builds }; diff --git a/plugins/circleci/src/pages/BuildsPage/index.ts b/plugins/circleci/src/pages/BuildsPage/index.ts index 9b555f0f12..72b46d6bc9 100644 --- a/plugins/circleci/src/pages/BuildsPage/index.ts +++ b/plugins/circleci/src/pages/BuildsPage/index.ts @@ -13,4 +13,4 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -export { default as BuildsPage } from './BuildsPage'; +export { default as BuildsPage, Builds } from './BuildsPage'; diff --git a/plugins/circleci/src/state/AppState.tsx b/plugins/circleci/src/state/AppState.tsx index f229175111..49d55b602e 100644 --- a/plugins/circleci/src/state/AppState.tsx +++ b/plugins/circleci/src/state/AppState.tsx @@ -16,7 +16,7 @@ import React, { FC, useReducer, Dispatch, Reducer } from 'react'; import { circleCIApiRef } from '../api'; import type { State, Action, SettingsState } from './types'; -export { SettingsState }; +export type { SettingsState }; export const AppContext = React.createContext<[State, Dispatch]>( [] as any,