diff options
Diffstat (limited to 'src/containers/settings/SettingsWindow.tsx')
-rw-r--r-- | src/containers/settings/SettingsWindow.tsx | 25 |
1 files changed, 15 insertions, 10 deletions
diff --git a/src/containers/settings/SettingsWindow.tsx b/src/containers/settings/SettingsWindow.tsx index 93bb08c7c..d2cdf3eb3 100644 --- a/src/containers/settings/SettingsWindow.tsx +++ b/src/containers/settings/SettingsWindow.tsx | |||
@@ -1,20 +1,23 @@ | |||
1 | import { inject, observer } from 'mobx-react'; | 1 | import { inject, observer } from 'mobx-react'; |
2 | import { Component, ReactPortal } from 'react'; | 2 | import { Component, ReactElement, ReactPortal } from 'react'; |
3 | import ReactDOM from 'react-dom'; | 3 | import ReactDOM from 'react-dom'; |
4 | import { Outlet } from 'react-router-dom'; | 4 | import { Outlet } from 'react-router-dom'; |
5 | |||
6 | import { StoresProps } from '../../@types/ferdium-components.types'; | 5 | import { StoresProps } from '../../@types/ferdium-components.types'; |
7 | import Navigation from '../../components/settings/navigation/SettingsNavigation'; | 6 | import Navigation from '../../components/settings/navigation/SettingsNavigation'; |
8 | import Layout from '../../components/settings/SettingsLayout'; | 7 | import Layout from '../../components/settings/SettingsLayout'; |
9 | import ErrorBoundary from '../../components/util/ErrorBoundary'; | 8 | import ErrorBoundary from '../../components/util/ErrorBoundary'; |
10 | import { workspaceStore } from '../../features/workspaces'; | 9 | import { workspaceStore } from '../../features/workspaces'; |
11 | 10 | ||
12 | class SettingsContainer extends Component<StoresProps> { | 11 | interface IProps extends Partial<StoresProps> {} |
13 | portalRoot: any; | 12 | |
13 | @inject('stores', 'actions') | ||
14 | @observer | ||
15 | class SettingsContainer extends Component<IProps> { | ||
16 | portalRoot: HTMLElement | null; | ||
14 | 17 | ||
15 | el: HTMLDivElement; | 18 | el: HTMLDivElement; |
16 | 19 | ||
17 | constructor(props: StoresProps) { | 20 | constructor(props: IProps) { |
18 | super(props); | 21 | super(props); |
19 | 22 | ||
20 | this.portalRoot = document.querySelector('#portalContainer'); | 23 | this.portalRoot = document.querySelector('#portalContainer'); |
@@ -22,7 +25,9 @@ class SettingsContainer extends Component<StoresProps> { | |||
22 | } | 25 | } |
23 | 26 | ||
24 | componentDidMount(): void { | 27 | componentDidMount(): void { |
25 | this.portalRoot.append(this.el); | 28 | if (this.portalRoot) { |
29 | this.portalRoot.append(this.el); | ||
30 | } | ||
26 | } | 31 | } |
27 | 32 | ||
28 | componentWillUnmount(): void { | 33 | componentWillUnmount(): void { |
@@ -31,11 +36,11 @@ class SettingsContainer extends Component<StoresProps> { | |||
31 | 36 | ||
32 | render(): ReactPortal { | 37 | render(): ReactPortal { |
33 | const { stores } = this.props; | 38 | const { stores } = this.props; |
34 | const { closeSettings } = this.props.actions.ui; | 39 | const { closeSettings } = this.props.actions!.ui; |
35 | 40 | ||
36 | const navigation = ( | 41 | const navigation: ReactElement = ( |
37 | <Navigation | 42 | <Navigation |
38 | serviceCount={stores.services.all.length} | 43 | serviceCount={stores!.services.all.length} |
39 | workspaceCount={workspaceStore.workspaces.length} | 44 | workspaceCount={workspaceStore.workspaces.length} |
40 | /> | 45 | /> |
41 | ); | 46 | ); |
@@ -51,4 +56,4 @@ class SettingsContainer extends Component<StoresProps> { | |||
51 | } | 56 | } |
52 | } | 57 | } |
53 | 58 | ||
54 | export default inject('stores', 'actions')(observer(SettingsContainer)); | 59 | export default SettingsContainer; |