diff options
author | 2022-10-27 07:13:47 +0530 | |
---|---|---|
committer | 2022-10-27 01:43:47 +0000 | |
commit | 81c43ecc3d17e0dbf7ad1d949b6d977f2c65bd48 (patch) | |
tree | dfa7c08cb54fb81b7d2e788d350de52c2ebd05d2 /src/containers/settings | |
parent | 6.2.1-nightly.30 [skip ci] (diff) | |
download | ferdium-app-81c43ecc3d17e0dbf7ad1d949b6d977f2c65bd48.tar.gz ferdium-app-81c43ecc3d17e0dbf7ad1d949b6d977f2c65bd48.tar.zst ferdium-app-81c43ecc3d17e0dbf7ad1d949b6d977f2c65bd48.zip |
fix: 'failed prop' warning in QuickSwitchModal, SettingsNavigation, SettingsWindow and Recipe component tree (#713)
* chore: turn off eslint rule @typescript-eslint/no-useless-constructor to initialize dynamic props & state
Co-authored-by: Muhamed <>
Co-authored-by: Vijay A <vraravam@users.noreply.github.com>
Diffstat (limited to 'src/containers/settings')
-rw-r--r-- | src/containers/settings/RecipesScreen.tsx | 36 | ||||
-rw-r--r-- | src/containers/settings/SettingsWindow.tsx | 25 |
2 files changed, 33 insertions, 28 deletions
diff --git a/src/containers/settings/RecipesScreen.tsx b/src/containers/settings/RecipesScreen.tsx index fffdd39fa..abbb79b39 100644 --- a/src/containers/settings/RecipesScreen.tsx +++ b/src/containers/settings/RecipesScreen.tsx | |||
@@ -16,27 +16,30 @@ import RecipePreview from '../../models/RecipePreview'; | |||
16 | import { openPath } from '../../helpers/url-helpers'; | 16 | import { openPath } from '../../helpers/url-helpers'; |
17 | import withParams from '../../components/util/WithParams'; | 17 | import withParams from '../../components/util/WithParams'; |
18 | 18 | ||
19 | interface RecipesScreenProps extends StoresProps { | 19 | interface IProps extends Partial<StoresProps> { |
20 | params: Params; | 20 | params: Params; |
21 | } | 21 | } |
22 | 22 | ||
23 | class RecipesScreen extends Component<RecipesScreenProps> { | 23 | interface IState { |
24 | state: { | 24 | needle: string | null; |
25 | needle: string | null; | 25 | currentFilter: string; |
26 | currentFilter: string; | 26 | } |
27 | } = { | ||
28 | needle: null, | ||
29 | currentFilter: 'featured', | ||
30 | }; | ||
31 | 27 | ||
28 | @inject('stores', 'actions') | ||
29 | @observer | ||
30 | class RecipesScreen extends Component<IProps, IState> { | ||
32 | autorunDisposer: IReactionDisposer | null = null; | 31 | autorunDisposer: IReactionDisposer | null = null; |
33 | 32 | ||
34 | customRecipes: Recipe[] = []; | 33 | customRecipes: Recipe[] = []; |
35 | 34 | ||
36 | constructor(props: RecipesScreenProps) { | 35 | constructor(props: IProps) { |
37 | super(props); | 36 | super(props); |
38 | 37 | ||
39 | this.customRecipes = readJsonSync(asarRecipesPath('all.json')); | 38 | this.customRecipes = readJsonSync(asarRecipesPath('all.json')); |
39 | this.state = { | ||
40 | needle: null, | ||
41 | currentFilter: 'featured', | ||
42 | }; | ||
40 | } | 43 | } |
41 | 44 | ||
42 | componentDidMount(): void { | 45 | componentDidMount(): void { |
@@ -55,7 +58,7 @@ class RecipesScreen extends Component<RecipesScreenProps> { | |||
55 | } | 58 | } |
56 | 59 | ||
57 | componentWillUnmount(): void { | 60 | componentWillUnmount(): void { |
58 | this.props.stores.services.resetStatus(); | 61 | this.props.stores!.services.resetStatus(); |
59 | 62 | ||
60 | if (typeof this.autorunDisposer === 'function') { | 63 | if (typeof this.autorunDisposer === 'function') { |
61 | this.autorunDisposer(); | 64 | this.autorunDisposer(); |
@@ -66,7 +69,7 @@ class RecipesScreen extends Component<RecipesScreenProps> { | |||
66 | if (needle === '') { | 69 | if (needle === '') { |
67 | this.resetSearch(); | 70 | this.resetSearch(); |
68 | } else { | 71 | } else { |
69 | const { search } = this.props.actions.recipePreview; | 72 | const { search } = this.props.actions!.recipePreview; |
70 | this.setState({ needle }); | 73 | this.setState({ needle }); |
71 | search({ needle }); | 74 | search({ needle }); |
72 | } | 75 | } |
@@ -106,10 +109,8 @@ class RecipesScreen extends Component<RecipesScreenProps> { | |||
106 | } | 109 | } |
107 | 110 | ||
108 | render(): ReactElement { | 111 | render(): ReactElement { |
109 | const { recipePreviews, recipes, services } = this.props.stores; | 112 | const { recipePreviews, recipes, services } = this.props.stores!; |
110 | 113 | const { app: appActions, service: serviceActions } = this.props.actions!; | |
111 | const { app: appActions, service: serviceActions } = this.props.actions; | ||
112 | |||
113 | const filter = this.state.currentFilter; | 114 | const filter = this.state.currentFilter; |
114 | 115 | ||
115 | let recipeFilter; | 116 | let recipeFilter; |
@@ -163,7 +164,6 @@ class RecipesScreen extends Component<RecipesScreenProps> { | |||
163 | recipes={allRecipes} | 164 | recipes={allRecipes} |
164 | customWebsiteRecipe={customWebsiteRecipe} | 165 | customWebsiteRecipe={customWebsiteRecipe} |
165 | isLoading={isLoading} | 166 | isLoading={isLoading} |
166 | addedServiceCount={services.all.length} | ||
167 | hasLoadedRecipes={ | 167 | hasLoadedRecipes={ |
168 | recipePreviews.featuredRecipePreviewsRequest.wasExecuted | 168 | recipePreviews.featuredRecipePreviewsRequest.wasExecuted |
169 | } | 169 | } |
@@ -184,4 +184,4 @@ class RecipesScreen extends Component<RecipesScreenProps> { | |||
184 | } | 184 | } |
185 | } | 185 | } |
186 | 186 | ||
187 | export default withParams(inject('stores', 'actions')(observer(RecipesScreen))); | 187 | export default withParams(RecipesScreen); |
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; |