diff options
author | Vijay A <vraravam@users.noreply.github.com> | 2024-02-11 09:50:32 +0530 |
---|---|---|
committer | Vijay Aravamudhan <vraravam@users.noreply.github.com> | 2024-02-11 04:39:55 +0000 |
commit | beb1f1c28adc9872b179a2169e4f8d34adf125c7 (patch) | |
tree | 86dbd13e3ef6365d0e28fe4d23de7c6b7828f692 /src/components/ui | |
parent | remove unused '@types/react-loader' pkg (diff) | |
download | ferdium-app-beb1f1c28adc9872b179a2169e4f8d34adf125c7.tar.gz ferdium-app-beb1f1c28adc9872b179a2169e4f8d34adf125c7.tar.zst ferdium-app-beb1f1c28adc9872b179a2169e4f8d34adf125c7.zip |
minor refactoring to remove duplication with a constant
Diffstat (limited to 'src/components/ui')
-rw-r--r-- | src/components/ui/InfoBar.tsx | 7 | ||||
-rw-r--r-- | src/components/ui/Infobox.tsx | 7 | ||||
-rw-r--r-- | src/components/ui/button/index.tsx | 3 | ||||
-rw-r--r-- | src/components/ui/loader/index.tsx | 3 |
4 files changed, 16 insertions, 4 deletions
diff --git a/src/components/ui/InfoBar.tsx b/src/components/ui/InfoBar.tsx index ae37546df..f3f1adbe7 100644 --- a/src/components/ui/InfoBar.tsx +++ b/src/components/ui/InfoBar.tsx | |||
@@ -8,6 +8,7 @@ import { noop } from 'lodash'; | |||
8 | import Loader from './loader/index'; | 8 | import Loader from './loader/index'; |
9 | import Appear from './effects/Appear'; | 9 | import Appear from './effects/Appear'; |
10 | import Icon from './icon'; | 10 | import Icon from './icon'; |
11 | import { DEFAULT_LOADER_COLOR } from '../../config'; | ||
11 | 12 | ||
12 | const messages = defineMessages({ | 13 | const messages = defineMessages({ |
13 | hide: { | 14 | hide: { |
@@ -71,7 +72,11 @@ class InfoBar extends Component<IProps> { | |||
71 | className="contentWrapper" | 72 | className="contentWrapper" |
72 | style={{ display: 'flex', gap: '8px' }} | 73 | style={{ display: 'flex', gap: '8px' }} |
73 | > | 74 | > |
74 | <Loader size={18} loaded={!ctaLoading} color="#FFFFFF" /> | 75 | <Loader |
76 | size={18} | ||
77 | loaded={!ctaLoading} | ||
78 | color={DEFAULT_LOADER_COLOR} | ||
79 | /> | ||
75 | {ctaLabel} | 80 | {ctaLabel} |
76 | </div> | 81 | </div> |
77 | </button> | 82 | </button> |
diff --git a/src/components/ui/Infobox.tsx b/src/components/ui/Infobox.tsx index 742717ed7..14e1a581c 100644 --- a/src/components/ui/Infobox.tsx +++ b/src/components/ui/Infobox.tsx | |||
@@ -6,6 +6,7 @@ import { noop } from 'lodash'; | |||
6 | import { observer } from 'mobx-react'; | 6 | import { observer } from 'mobx-react'; |
7 | import Loader from './loader/index'; | 7 | import Loader from './loader/index'; |
8 | import Icon from './icon'; | 8 | import Icon from './icon'; |
9 | import { DEFAULT_LOADER_COLOR } from '../../config'; | ||
9 | 10 | ||
10 | const icons = { | 11 | const icons = { |
11 | 'checkbox-marked-circle-outline': mdiCheckboxMarkedCircleOutline, | 12 | 'checkbox-marked-circle-outline': mdiCheckboxMarkedCircleOutline, |
@@ -84,7 +85,11 @@ class Infobox extends Component<IProps, IState> { | |||
84 | className="contentWrapper" | 85 | className="contentWrapper" |
85 | style={{ display: 'flex', gap: '8px' }} | 86 | style={{ display: 'flex', gap: '8px' }} |
86 | > | 87 | > |
87 | <Loader size={18} loaded={!ctaLoading} color="#FFFFFF" /> | 88 | <Loader |
89 | size={18} | ||
90 | loaded={!ctaLoading} | ||
91 | color={DEFAULT_LOADER_COLOR} | ||
92 | /> | ||
88 | {ctaLabel} | 93 | {ctaLabel} |
89 | </div> | 94 | </div> |
90 | </button> | 95 | </button> |
diff --git a/src/components/ui/button/index.tsx b/src/components/ui/button/index.tsx index a2194e34d..3247072a9 100644 --- a/src/components/ui/button/index.tsx +++ b/src/components/ui/button/index.tsx | |||
@@ -8,6 +8,7 @@ import withStyles, { WithStylesProps } from 'react-jss'; | |||
8 | import Loader from '../loader/index'; | 8 | import Loader from '../loader/index'; |
9 | import { Theme } from '../../../themes'; | 9 | import { Theme } from '../../../themes'; |
10 | import { IFormField } from '../typings/generic'; | 10 | import { IFormField } from '../typings/generic'; |
11 | import { DEFAULT_LOADER_COLOR } from '../../../config'; | ||
11 | 12 | ||
12 | type ButtonType = | 13 | type ButtonType = |
13 | | 'primary' | 14 | | 'primary' |
@@ -194,7 +195,7 @@ class ButtonComponent extends Component<IProps, IState> { | |||
194 | <> | 195 | <> |
195 | {showLoader && ( | 196 | {showLoader && ( |
196 | <div className={classes.loaderContainer}> | 197 | <div className={classes.loaderContainer}> |
197 | <Loader size={18} color="#FFFFFF" /> | 198 | <Loader size={18} color={DEFAULT_LOADER_COLOR} /> |
198 | </div> | 199 | </div> |
199 | )} | 200 | )} |
200 | <div className={classes.label}> | 201 | <div className={classes.label}> |
diff --git a/src/components/ui/loader/index.tsx b/src/components/ui/loader/index.tsx index 2c6e2bff4..c0ae15028 100644 --- a/src/components/ui/loader/index.tsx +++ b/src/components/ui/loader/index.tsx | |||
@@ -4,6 +4,7 @@ import injectStyle, { WithStylesProps } from 'react-jss'; | |||
4 | import { Oval } from 'react-loader-spinner'; | 4 | import { Oval } from 'react-loader-spinner'; |
5 | import { inject } from 'mobx-react'; | 5 | import { inject } from 'mobx-react'; |
6 | import { FerdiumStores } from '../../../@types/stores.types'; | 6 | import { FerdiumStores } from '../../../@types/stores.types'; |
7 | import { DEFAULT_LOADER_COLOR } from '../../../config'; | ||
7 | 8 | ||
8 | const styles = () => ({ | 9 | const styles = () => ({ |
9 | container: { | 10 | container: { |
@@ -33,7 +34,7 @@ class LoaderComponent extends Component<IProps> { | |||
33 | color = this.props.stores?.settings.app.accentColor, | 34 | color = this.props.stores?.settings.app.accentColor, |
34 | loaded = false, | 35 | loaded = false, |
35 | } = this.props; | 36 | } = this.props; |
36 | const loaderColor = color ?? '#FFFFFF'; | 37 | const loaderColor = color ?? DEFAULT_LOADER_COLOR; |
37 | 38 | ||
38 | return ( | 39 | return ( |
39 | <div | 40 | <div |