diff options
author | 2023-10-27 02:19:31 +0200 | |
---|---|---|
committer | 2023-10-27 01:19:31 +0100 | |
commit | 78cb67c641e5723af59e0cf8a172a443aafa6f33 (patch) | |
tree | ec121e8efecf027717ce4e58b29c72fa93ed3315 /src/features/workspaces | |
parent | 6.5.3-nightly.4 [skip ci] (diff) | |
download | ferdium-app-78cb67c641e5723af59e0cf8a172a443aafa6f33.tar.gz ferdium-app-78cb67c641e5723af59e0cf8a172a443aafa6f33.tar.zst ferdium-app-78cb67c641e5723af59e0cf8a172a443aafa6f33.zip |
feat: change loader component (#1410)
* CHANGED react-loater to react-loader-spinner
* CHANGED brandColor to primary
* feat: change loader component
- remove redundant /index path from Loader imports in multiple files
- remove commented out braces in RecipesDashboard
- remove redundant color which is default from Loader in InfoBar
- update size of Loader in InfoBar to be the same as InfoBox
- change passed size prop from string to number in Button component
- add slight gap for FullscreenLoader to styles.ts
- fix Loader to check for color primary which is passed rather than brandColor
- remove hardcoded width and height from WorkspaceSwitchingIndicator which lead to elements not being vertically centered
- remove color prop from Loader in WorkspaceSwitchingIndicator since white is already the default
- remove switchingIndicator.spinnerColor from default theme since white is already the default
* implement PR feedback
* re-add color to WorkspaceSwitchingIndicator
---------
Co-authored-by: MCMXC <16797721+mcmxcdev@users.noreply.github.com>
Diffstat (limited to 'src/features/workspaces')
-rw-r--r-- | src/features/workspaces/components/WorkspaceSwitchingIndicator.tsx | 18 | ||||
-rw-r--r-- | src/features/workspaces/components/WorkspacesDashboard.tsx | 2 |
2 files changed, 7 insertions, 13 deletions
diff --git a/src/features/workspaces/components/WorkspaceSwitchingIndicator.tsx b/src/features/workspaces/components/WorkspaceSwitchingIndicator.tsx index e1cc0f785..0fce811e5 100644 --- a/src/features/workspaces/components/WorkspaceSwitchingIndicator.tsx +++ b/src/features/workspaces/components/WorkspaceSwitchingIndicator.tsx | |||
@@ -3,9 +3,8 @@ import { observer } from 'mobx-react'; | |||
3 | import withStyles, { WithStylesProps } from 'react-jss'; | 3 | import withStyles, { WithStylesProps } from 'react-jss'; |
4 | import classnames from 'classnames'; | 4 | import classnames from 'classnames'; |
5 | import { defineMessages, injectIntl, WrappedComponentProps } from 'react-intl'; | 5 | import { defineMessages, injectIntl, WrappedComponentProps } from 'react-intl'; |
6 | import Loader from '../../../components/ui/loader/index'; | 6 | import Loader from '../../../components/ui/loader'; |
7 | import { workspaceStore } from '../index'; | 7 | import { workspaceStore } from '../index'; |
8 | import { Theme } from '../../../themes'; | ||
9 | 8 | ||
10 | const messages = defineMessages({ | 9 | const messages = defineMessages({ |
11 | switchingTo: { | 10 | switchingTo: { |
@@ -41,8 +40,6 @@ const styles = theme => ({ | |||
41 | zIndex: 200, | 40 | zIndex: 200, |
42 | }, | 41 | }, |
43 | spinner: { | 42 | spinner: { |
44 | width: 40, | ||
45 | height: 40, | ||
46 | marginRight: 10, | 43 | marginRight: 10, |
47 | }, | 44 | }, |
48 | message: { | 45 | message: { |
@@ -52,14 +49,14 @@ const styles = theme => ({ | |||
52 | }, | 49 | }, |
53 | }); | 50 | }); |
54 | 51 | ||
55 | interface IProps extends WithStylesProps<typeof styles>, WrappedComponentProps { | 52 | interface IProps |
56 | theme?: Theme; | 53 | extends WithStylesProps<typeof styles>, |
57 | } | 54 | WrappedComponentProps {} |
58 | 55 | ||
59 | @observer | 56 | @observer |
60 | class WorkspaceSwitchingIndicator extends Component<IProps> { | 57 | class WorkspaceSwitchingIndicator extends Component<IProps> { |
61 | render(): ReactElement | null { | 58 | render(): ReactElement | null { |
62 | const { classes, intl, theme } = this.props; | 59 | const { classes, intl } = this.props; |
63 | const { isSwitchingWorkspace, nextWorkspace } = workspaceStore; | 60 | const { isSwitchingWorkspace, nextWorkspace } = workspaceStore; |
64 | 61 | ||
65 | if (!isSwitchingWorkspace) { | 62 | if (!isSwitchingWorkspace) { |
@@ -73,10 +70,7 @@ class WorkspaceSwitchingIndicator extends Component<IProps> { | |||
73 | return ( | 70 | return ( |
74 | <div className={classnames([classes.wrapper])}> | 71 | <div className={classnames([classes.wrapper])}> |
75 | <div className={classes.component}> | 72 | <div className={classes.component}> |
76 | <Loader | 73 | <Loader className={classes.spinner} color="#FFFFFF" /> |
77 | className={classes.spinner} | ||
78 | color={theme?.workspaces.switchingIndicator.spinnerColor} | ||
79 | /> | ||
80 | <p className={classes.message}> | 74 | <p className={classes.message}> |
81 | {`${intl.formatMessage(messages.switchingTo)} ${nextWorkspaceName}`} | 75 | {`${intl.formatMessage(messages.switchingTo)} ${nextWorkspaceName}`} |
82 | </p> | 76 | </p> |
diff --git a/src/features/workspaces/components/WorkspacesDashboard.tsx b/src/features/workspaces/components/WorkspacesDashboard.tsx index ba06730a0..0a417bffd 100644 --- a/src/features/workspaces/components/WorkspacesDashboard.tsx +++ b/src/features/workspaces/components/WorkspacesDashboard.tsx | |||
@@ -3,7 +3,7 @@ import { observer } from 'mobx-react'; | |||
3 | import { defineMessages, injectIntl, WrappedComponentProps } from 'react-intl'; | 3 | import { defineMessages, injectIntl, WrappedComponentProps } from 'react-intl'; |
4 | import withStyles, { WithStylesProps } from 'react-jss'; | 4 | import withStyles, { WithStylesProps } from 'react-jss'; |
5 | import Infobox from '../../../components/ui/infobox/index'; | 5 | import Infobox from '../../../components/ui/infobox/index'; |
6 | import Loader from '../../../components/ui/Loader'; | 6 | import Loader from '../../../components/ui/loader'; |
7 | import WorkspaceItem from './WorkspaceItem'; | 7 | import WorkspaceItem from './WorkspaceItem'; |
8 | import CreateWorkspaceForm from './CreateWorkspaceForm'; | 8 | import CreateWorkspaceForm from './CreateWorkspaceForm'; |
9 | import Request from '../../../stores/lib/Request'; | 9 | import Request from '../../../stores/lib/Request'; |