message: Update dialog format
diff: @@ -22,6 +22,7 @@ import {
  useApi,
  } from '@backstage/core';
  import {
  + Box,
  Button,
  Dialog,
  DialogActions,
  @@ -55,7 +56,6 @@ export const EntityBadgesDialog = ({ open, onClose, entity }: Props) => {
  const theme = useTheme();
  const fullScreen = useMediaQuery(theme.breakpoints.down('sm'));
  const badgesApi = useApi(badgesApiRef);
  - const classes = useStyles();
  const { value: badges, loading, error } = useAsync(async () => {
  if (open) {
  @@ -67,18 +67,11 @@ export const EntityBadgesDialog = ({ open, onClose, entity }: Props) => {
  const content = (badges || []).map(
  ({ badge: { description }, id, url, markdown }) => (
  - <div key={id}>
  <DialogContentText>
  - {description || `${id} badge`}
  - <br />
  + <Box m={4} />
  <img alt={description || id} src={url} />
  - </DialogContentText>
  - <Typography component="div" className={classes.codeBlock}>
  - Copy the following snippet of markdown code for the badge:
  <CodeSnippet language="markdown" text={markdown} showCopyCodeButton />
  - </Typography>
  - <hr />
  - </div>
  + </DialogContentText>
  ),
  );
  @@ -87,6 +80,10 @@ export const EntityBadgesDialog = ({ open, onClose, entity }: Props) => {
  <DialogTitle>Entity Badges</DialogTitle>
  <DialogContent>
  + <Typography>
  + Embed badges in other web sites that link back to this entity. Copy
  + the relevant snippet of Markdown code to use the badge.
  + </Typography>
  {loading && <Progress />}
  {error && <ResponseErrorPanel error={error} />}
  {content}
  