Merge pull request #699 from gre/export-on-crash-init

Add export on init crash + make error selectable

src/components/AppError.js

@@ -13,7 +13,7 @@ import RenderError from './RenderError'
 const App = ({ language, error }: { error: Error, language: string }) => (
   <I18nextProvider i18n={i18n} initialLanguage={language}>
     <ThemeProvider theme={theme}>
-      <RenderError disableExport error={error}>
+      <RenderError withoutAppData error={error}>
         <TriggerAppReady />
       </RenderError>
     </ThemeProvider>

src/components/ExportLogsBtn.js

@@ -19,15 +19,24 @@ const mapStateToProps = createStructuredSelector({
 
 class ExportLogsBtn extends Component<{
   t: *,
-  settings: *,
-  accounts: *,
+  settings: ?*,
+  accounts: ?*,
   hookToShortcut?: boolean,
 }> {
   handleExportLogs = () => {
     const { accounts, settings } = this.props
     const logs = logger.exportLogs()
     const resourceUsage = webFrame.getResourceUsage()
-    const report = { resourceUsage, logs, accounts, settings, date: new Date() }
+    const report = {
+      resourceUsage,
+      logs,
+      accounts,
+      settings,
+      date: new Date(),
+      release: __APP_VERSION__,
+      git_commit: __GIT_REVISION__,
+      environment: __DEV__ ? 'development' : 'production',
+    }
     console.log(report) // eslint-disable-line no-console
     const reportJSON = JSON.stringify(report)
     const path = remote.dialog.showSaveDialog({
@@ -69,4 +78,10 @@ class ExportLogsBtn extends Component<{
   }
 }
 
-export default translate()(connect(mapStateToProps)(ExportLogsBtn))
+const WithAppData = connect(mapStateToProps)(ExportLogsBtn)
+const WithoutAppData = ExportLogsBtn
+
+const ExportLogsBtnDispatcher = ({ withAppData, ...rest }: *) =>
+  withAppData ? <WithAppData {...rest} /> : <WithoutAppData {...rest} />
+
+export default translate()(ExportLogsBtnDispatcher)

src/components/RenderError.js

@@ -1,6 +1,7 @@
 // @flow
 
 import React, { PureComponent } from 'react'
+import styled from 'styled-components'
 import { shell, remote } from 'electron'
 import qs from 'querystring'
 import { translate } from 'react-i18next'
@@ -21,7 +22,7 @@ import { IconWrapperCircle } from './SettingsPage/sections/Profile'
 type Props = {
   error: Error,
   t: T,
-  disableExport?: boolean,
+  withoutAppData?: boolean,
   children?: *,
 }
 
@@ -75,7 +76,7 @@ ${error.stack}
   }
 
   render() {
-    const { error, t, disableExport, children } = this.props
+    const { error, t, withoutAppData, children } = this.props
     const { isHardResetting, isHardResetModalOpened } = this.state
     return (
       <Box align="center" grow>
@@ -100,7 +101,7 @@ ${error.stack}
           <Button primary onClick={this.handleRestart}>
             {t('app:crash.restart')}
           </Button>
-          {!disableExport ? <ExportLogsBtn /> : null}
+          <ExportLogsBtn withoutAppData={withoutAppData} />
           <Button primary onClick={this.handleCreateIssue}>
             {t('app:crash.createTicket')}
           </Button>
@@ -120,10 +121,8 @@ ${error.stack}
           renderIcon={this.hardResetIconRender}
         />
         <Box my={6}>
-          <ErrContainer>
-            <strong>{String(error)}</strong>
-            <div>{error.stack || 'no stacktrace'}</div>
-          </ErrContainer>
+          <ErrContainer>{`${String(error)}
+${error.stack || 'no stacktrace'}`}</ErrContainer>
         </Box>
         <pre
           style={{
@@ -142,21 +141,15 @@ ${error.stack}
   }
 }
 
-const ErrContainer = ({ children }: { children: any }) => (
-  <pre
-    style={{
-      margin: 'auto',
-      maxWidth: '80vw',
-      overflow: 'auto',
-      fontSize: 10,
-      fontFamily: 'monospace',
-      cursor: 'text',
-      userSelect: 'text',
-      opacity: 0.3,
-    }}
-  >
-    {children}
-  </pre>
-)
+const ErrContainer = styled.pre`
+  margin: auto;
+  max-width: 80vw;
+  overflow: auto;
+  font-size: 10px;
+  font-family: monospace;
+  cursor: text;
+  user-select: text;
+  opacity: 0.3;
+`
 
 export default translate()(RenderError)