refactor: convert AccountDashboard to typescript

2 files changed, 17 insertions, 14 deletions

diff --git a/src/components/ui/Loader.tsx b/src/components/ui/Loader.tsx
index 67c9db22e..ae51f8145 100644
--- a/src/components/ui/Loader.tsx
+++ b/src/components/ui/Loader.tsx
@@ -1,19 +1,20 @@
-import { Component, ReactChildren } from 'react';
+import {Component, PropsWithChildren} from 'react';
 import { observer, inject } from 'mobx-react';
 import Loader from 'react-loader';
 
 import { FerdiumStores } from '../../@types/stores.types';
 
-type Props = {
-  children: ReactChildren;
-  loaded: boolean;
-  className: string;
-  color: string;
-  stores: FerdiumStores;
-};
+interface IProps {
+  className?: string;
+  color?: string;
+  loaded?: boolean;
+  stores?: FerdiumStores;
+}
 
 // Can this file be merged into the './loader/index.tsx' file?
-class LoaderComponent extends Component<Props> {
+@inject("stores")
+@observer
+class LoaderComponent extends Component<PropsWithChildren<IProps>> {
   static defaultProps = {
     loaded: false,
     color: 'ACCENT',
@@ -25,7 +26,7 @@ class LoaderComponent extends Component<Props> {
     const color =
       this.props.color !== 'ACCENT'
         ? this.props.color
-        : this.props.stores.settings.app.accentColor;
+        : this.props.stores!.settings.app.accentColor;
 
     return (
       <Loader
@@ -42,4 +43,4 @@ class LoaderComponent extends Component<Props> {
   }
 }
 
-export default inject('stores')(observer(LoaderComponent));
+export default LoaderComponent;
diff --git a/src/components/ui/infobox/index.tsx b/src/components/ui/infobox/index.tsx
index d1d7ef6cd..ad59ea81e 100644
--- a/src/components/ui/infobox/index.tsx
+++ b/src/components/ui/infobox/index.tsx
@@ -7,15 +7,16 @@ import { Theme } from '../../../themes';
 import Icon from '../icon';
 
 interface IProps extends WithStylesProps<typeof styles> {
+  children: ReactNode;
   icon?: string;
   type?: string;
   dismissable?: boolean;
+  ctaLabel?: string;
+
+  className?: string;
   onDismiss?: () => void;
   onUnmount?: () => void;
   ctaOnClick?: () => void;
-  ctaLabel?: string;
-  children: ReactNode;
-  className: string;
 }
 
 interface IState {
@@ -114,6 +115,7 @@ class InfoboxComponent extends Component<IProps, IState> {
     ctaOnClick: () => {},
     onDismiss: () => {},
     ctaLabel: '',
+    className: '',
   };
 
   state = {