Migrating Vue components to React and stores refactoring (#585)

Signed-off-by: Roman <ixrock@gmail.com>

Co-authored-by: Sebastian Malton <sebastian@malton.name>
Co-authored-by: Sebastian Malton <smalton@mirantis.com>
Co-authored-by: Lauri Nevala <lauri.nevala@gmail.com>
Co-authored-by: Alex Andreev <alex.andreev.email@gmail.com>

src/renderer/components/dialog/dialog.tsx

@@ -8,6 +8,8 @@ import { Animate } from "../animate";
 import { cssNames, noop, stopPropagation } from "../../utils";
 import { navigation } from "../../navigation";
 
+// todo: refactor + handle animation-end in props.onClose()?
+
 export interface DialogProps {
   className?: string;
   isOpen?: boolean;
@@ -24,7 +26,6 @@ interface DialogState {
   isOpen: boolean;
 }
 
-// fixme: handle animation end props.onClose() (await props.close()?)
 @observer
 export class Dialog extends React.PureComponent<DialogProps, DialogState> {
   private contentElem: HTMLElement;

src/renderer/components/dialog/logs-dialog.tsx

@@ -10,6 +10,8 @@ import { Button } from "../button";
 import { Icon } from "../icon";
 import { _i18n } from "../../i18n";
 
+// todo: make as external BrowserWindow (?)
+
 interface Props extends DialogProps {
   title: string;
   logs: string;
@@ -41,7 +43,7 @@ export class LogsDialog extends React.Component<Props> {
       <Dialog {...dialogProps} className="LogsDialog">
         <Wizard header={header} done={dialogProps.close}>
           <WizardStep scrollable={false} customButtons={customButtons}>
-            <code ref={e => this.logsElem = e}>
+            <code className="block" ref={e => this.logsElem = e}>
               {logs || <Trans>There are no logs available.</Trans>}
             </code>
           </WizardStep>