packages/app: move AlertDisplay to core

This commit is contained in:
Patrik Oldsberg
2020-05-25 18:10:34 +02:00
parent e1f31ed95a
commit 6d3f745b4b
6 changed files with 6 additions and 8 deletions
-1
View File
@@ -18,7 +18,6 @@
"@backstage/plugin-sentry": "^0.1.1-alpha.6",
"@material-ui/core": "^4.9.1",
"@material-ui/icons": "^4.9.1",
"@material-ui/lab": "4.0.0-alpha.45",
"prop-types": "^15.7.2",
"react": "^16.12.0",
"react-dom": "^16.12.0",
+1 -2
View File
@@ -14,11 +14,10 @@
* limitations under the License.
*/
import { createApp, OAuthRequestDialog } from '@backstage/core';
import { createApp, AlertDisplay, OAuthRequestDialog } from '@backstage/core';
import React, { FC } from 'react';
import { BrowserRouter as Router } from 'react-router-dom';
import Root from './components/Root';
import AlertDisplay from './components/AlertDisplay';
import * as plugins from './plugins';
import apis, { alertApiForwarder } from './apis';
@@ -1,77 +0,0 @@
/*
* 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, useEffect, useState } from 'react';
import PropTypes from 'prop-types';
import { Snackbar, IconButton } from '@material-ui/core';
import CloseIcon from '@material-ui/icons/Close';
import { Alert } from '@material-ui/lab';
import { AlertApiForwarder, AlertMessage } from '@backstage/core';
type Props = {
forwarder: AlertApiForwarder;
};
// TODO: improve on this and promote to a shared component for use by all apps.
const AlertDisplay: FC<Props> = ({ forwarder }) => {
const [messages, setMessages] = useState<Array<AlertMessage>>([]);
useEffect(() => {
return forwarder.subscribe((message: AlertMessage) =>
setMessages(msgs => msgs.concat(message)),
);
}, [forwarder]);
if (messages.length === 0) {
return null;
}
const [firstMessage] = messages;
const handleClose = () => {
setMessages(msgs => msgs.filter(msg => msg !== firstMessage));
};
return (
<Snackbar
open
message={firstMessage.message.toString()}
anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
>
<Alert
action={
<IconButton
color="inherit"
size="small"
onClick={handleClose}
data-testid="error-button-close"
>
<CloseIcon />
</IconButton>
}
severity={firstMessage.severity}
>
{firstMessage.message.toString()}
</Alert>
</Snackbar>
);
};
AlertDisplay.propTypes = {
forwarder: PropTypes.instanceOf(AlertApiForwarder).isRequired,
};
export default AlertDisplay;
@@ -1,17 +0,0 @@
/*
* 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.
*/
export { default } from './AlertDisplay';