web: Fix error modal contents

We seem to be putting the actual error message as the header and the
title (the project + error file) as the body.  Swap them around.

The error is preformatted text with embedded newlines.  Wrap it in a
<pre> with pre-wrap so it displays correctly.

Change-Id: I9fafafe38a2b24ac8558f97000225f7b53fab9bf

web/src/App.jsx

@@ -260,9 +260,13 @@ class App extends React.Component {
             this.setState({showErrors: false})
           }}
           >
-          <NotificationDrawerListItemHeader title={error} variant="danger" />
+          <NotificationDrawerListItemHeader
+            title={item.source_context.project + ' | ' + ctxPath}
+            variant="danger" />
           <NotificationDrawerListItemBody>
-              {item.source_context.project} | {ctxPath}
+            <pre style={{whiteSpace: 'pre-wrap'}}>
+              {error}
+            </pre>
           </NotificationDrawerListItemBody>
         </NotificationDrawerListItem>
       )