diff --git a/plugins/stackstorm/package.json b/plugins/stackstorm/package.json index 03e65d21c5..c5b266782e 100644 --- a/plugins/stackstorm/package.json +++ b/plugins/stackstorm/package.json @@ -36,6 +36,7 @@ "dependencies": { "@backstage/core-components": "workspace:^", "@backstage/core-plugin-api": "workspace:^", + "@backstage/errors": "workspace:^", "@backstage/theme": "workspace:^", "@material-ui/core": "^4.12.2", "@material-ui/icons": "^4.9.1", diff --git a/plugins/stackstorm/src/api/StackStormClient.ts b/plugins/stackstorm/src/api/StackStormClient.ts index 692bfbe4a6..1eb81c63e9 100644 --- a/plugins/stackstorm/src/api/StackStormClient.ts +++ b/plugins/stackstorm/src/api/StackStormClient.ts @@ -15,6 +15,7 @@ */ import { Action, Execution, Pack, StackstormApi } from './types'; import { ConfigApi, DiscoveryApi, FetchApi } from '@backstage/core-plugin-api'; +import { ResponseError } from '@backstage/errors'; export class StackstormClient implements StackstormApi { private readonly discoveryApi: DiscoveryApi; @@ -57,28 +58,13 @@ export class StackstormClient implements StackstormApi { }, }); - if (!response.ok) throw new Error(`Unable to get data: ${response.status}`); + if (!response.ok) throw await ResponseError.fromResponse(response); return (await response.json()) as T; } - async addProject(bazaarProject: any): Promise { - const baseUrl = await this.discoveryApi.getBaseUrl('bazaar'); - - return await this.fetchApi - .fetch(`${baseUrl}/projects`, { - method: 'POST', - headers: { - Accept: 'application/json', - 'Content-Type': 'application/json', - }, - body: JSON.stringify(bazaarProject), - }) - .then(resp => resp.json()); - } - async getExecutions(limit?: number, offset?: number): Promise { const params = { - limit: limit?.toString() || '25', + limit: limit?.toString() || '10', offset: offset?.toString() || '0', include_attributes: 'id,status,start_timestamp,action.ref,action.name,rule.ref', diff --git a/plugins/stackstorm/src/components/ActionsList/ActionsList.tsx b/plugins/stackstorm/src/components/ActionsList/ActionsList.tsx index 96262d7e6b..35006baef0 100644 --- a/plugins/stackstorm/src/components/ActionsList/ActionsList.tsx +++ b/plugins/stackstorm/src/components/ActionsList/ActionsList.tsx @@ -15,7 +15,7 @@ */ import React, { useState } from 'react'; import useAsync from 'react-use/lib/useAsync'; -import { Progress } from '@backstage/core-components'; +import { Progress, ResponseErrorPanel } from '@backstage/core-components'; import { useApi } from '@backstage/core-plugin-api'; import { List, @@ -28,7 +28,6 @@ import { import { makeStyles } from '@material-ui/core/styles'; import ExpandMore from '@material-ui/icons/ExpandMore'; import ExpandLess from '@material-ui/icons/ExpandLess'; -import { Alert } from '@material-ui/lab'; import { Action, Pack, stackstormApiRef } from '../../api'; const useStyles = makeStyles(theme => ({ @@ -64,7 +63,7 @@ export const ActionItems = ({ pack }: ActionItemsProps) => { if (loading) { return ; } else if (error) { - return {error.message}; + return ; } return ( @@ -133,7 +132,7 @@ export const ActionsList = () => { if (loading) { return ; } else if (error) { - return {error.message}; + return ; } return ( diff --git a/plugins/stackstorm/src/components/ExecutionsTable/ExecutionPanel.tsx b/plugins/stackstorm/src/components/ExecutionsTable/ExecutionPanel.tsx index 47f301e910..8a55c31246 100644 --- a/plugins/stackstorm/src/components/ExecutionsTable/ExecutionPanel.tsx +++ b/plugins/stackstorm/src/components/ExecutionsTable/ExecutionPanel.tsx @@ -14,11 +14,14 @@ * limitations under the License. */ import React from 'react'; -import { CodeSnippet, Progress } from '@backstage/core-components'; +import { + CodeSnippet, + Progress, + ResponseErrorPanel, +} from '@backstage/core-components'; import { useApi } from '@backstage/core-plugin-api'; import { Execution, stackstormApiRef } from '../../api'; import useAsync from 'react-use/lib/useAsync'; -import { Alert } from '@material-ui/lab'; import { Button, Card, @@ -160,7 +163,7 @@ export const ExecutionPanel = ({ id }: { id: string }) => { if (loading) { return ; } else if (error) { - return {error.message}; + return ; } return ; diff --git a/plugins/stackstorm/src/components/ExecutionsTable/ExecutionsTable.tsx b/plugins/stackstorm/src/components/ExecutionsTable/ExecutionsTable.tsx index 1816f1db1f..f034cb64e8 100644 --- a/plugins/stackstorm/src/components/ExecutionsTable/ExecutionsTable.tsx +++ b/plugins/stackstorm/src/components/ExecutionsTable/ExecutionsTable.tsx @@ -13,12 +13,18 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import React, { useEffect, useState } from 'react'; -import { Link, Table, TableColumn } from '@backstage/core-components'; -import { useApi, errorApiRef } from '@backstage/core-plugin-api'; +import React, { useState } from 'react'; +import { + Link, + ResponseErrorPanel, + Table, + TableColumn, +} from '@backstage/core-components'; +import { useApi } from '@backstage/core-plugin-api'; import { Execution, stackstormApiRef } from '../../api'; import { Status } from './Status'; import { ExecutionPanel } from './ExecutionPanel'; +import useAsync from 'react-use/lib/useAsync'; type DenseTableProps = { executions: Execution[]; @@ -89,34 +95,24 @@ export const DenseTable = ({ export const ExecutionsTable = () => { const st2 = useApi(stackstormApiRef); - const errorApi = useApi(errorApiRef); const [page, setPage] = useState(0); const [rowsPerPage, setRowsPerPage] = useState(10); - const [data, setData] = useState([]); - const [loading, setLoading] = useState(false); - useEffect(() => { - const getData = async () => { - setLoading(true); - await st2 - .getExecutions(rowsPerPage, page * rowsPerPage) - .then(d => { - setData(d); - }) - .catch(err => { - errorApi.post(err); - }); - setLoading(false); - }; - getData(); - }, [errorApi, page, rowsPerPage, st2]); + const { value, loading, error } = useAsync(async (): Promise => { + const data = await st2.getExecutions(rowsPerPage, page * rowsPerPage); + return data; + }, [page, rowsPerPage, st2]); + + if (error) { + return ; + } return ( diff --git a/plugins/stackstorm/src/components/PacksTable/PacksTable.tsx b/plugins/stackstorm/src/components/PacksTable/PacksTable.tsx index ebb5e8a14e..2167200e8e 100644 --- a/plugins/stackstorm/src/components/PacksTable/PacksTable.tsx +++ b/plugins/stackstorm/src/components/PacksTable/PacksTable.tsx @@ -14,8 +14,12 @@ * limitations under the License. */ import React from 'react'; -import { Progress, Table, TableColumn } from '@backstage/core-components'; -import { Alert } from '@material-ui/lab'; +import { + Progress, + ResponseErrorPanel, + Table, + TableColumn, +} from '@backstage/core-components'; import useAsync from 'react-use/lib/useAsync'; import { useApi } from '@backstage/core-plugin-api'; import { Pack, stackstormApiRef } from '../../api'; @@ -52,7 +56,7 @@ export const PacksTable = () => { if (loading) { return ; } else if (error) { - return {error.message}; + return ; } return ; diff --git a/yarn.lock b/yarn.lock index 5c8cdcad98..71eb638d93 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7964,6 +7964,7 @@ __metadata: "@backstage/core-components": "workspace:^" "@backstage/core-plugin-api": "workspace:^" "@backstage/dev-utils": "workspace:^" + "@backstage/errors": "workspace:^" "@backstage/test-utils": "workspace:^" "@backstage/theme": "workspace:^" "@material-ui/core": ^4.12.2