From dfda3b7206c907e8fcc7802120ebd0bbbcba717a Mon Sep 17 00:00:00 2001
From: Vijay A <vraravam@users.noreply.github.com>
Date: Sun, 11 Feb 2024 09:44:29 +0530
Subject: remove unused '@types/react-loader' pkg

---
 src/components/ui/loader/index.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src/components/ui')

diff --git a/src/components/ui/loader/index.tsx b/src/components/ui/loader/index.tsx
index 2cee00d96..2c6e2bff4 100644
--- a/src/components/ui/loader/index.tsx
+++ b/src/components/ui/loader/index.tsx
@@ -29,11 +29,11 @@ class LoaderComponent extends Component<IProps> {
     const {
       classes,
       className,
-      size = 36,
+      size = 100,
       color = this.props.stores?.settings.app.accentColor,
       loaded = false,
     } = this.props;
-    const loaderColor = color || '#FFFFFF';
+    const loaderColor = color ?? '#FFFFFF';
 
     return (
       <div
-- 
cgit v1.2.3-54-g00ecf


From beb1f1c28adc9872b179a2169e4f8d34adf125c7 Mon Sep 17 00:00:00 2001
From: Vijay A <vraravam@users.noreply.github.com>
Date: Sun, 11 Feb 2024 09:50:32 +0530
Subject: minor refactoring to remove duplication with a constant

---
 src/components/settings/account/AccountDashboard.tsx              | 8 ++++++--
 src/components/settings/team/TeamDashboard.tsx                    | 4 ++--
 src/components/ui/InfoBar.tsx                                     | 7 ++++++-
 src/components/ui/Infobox.tsx                                     | 7 ++++++-
 src/components/ui/button/index.tsx                                | 3 ++-
 src/components/ui/loader/index.tsx                                | 3 ++-
 src/config.ts                                                     | 2 ++
 .../workspaces/components/WorkspaceSwitchingIndicator.tsx         | 3 ++-
 src/themes/default/index.ts                                       | 3 ++-
 9 files changed, 30 insertions(+), 10 deletions(-)

(limited to 'src/components/ui')

diff --git a/src/components/settings/account/AccountDashboard.tsx b/src/components/settings/account/AccountDashboard.tsx
index ffa684458..eab019084 100644
--- a/src/components/settings/account/AccountDashboard.tsx
+++ b/src/components/settings/account/AccountDashboard.tsx
@@ -7,7 +7,11 @@ import { H1, H2 } from '../../ui/headline';
 import Loader from '../../ui/loader';
 import Button from '../../ui/button';
 import Infobox from '../../ui/infobox/index';
-import { LOCAL_SERVER, LIVE_FRANZ_API } from '../../../config';
+import {
+  DEFAULT_LOADER_COLOR,
+  LOCAL_SERVER,
+  LIVE_FRANZ_API,
+} from '../../../config';
 import User from '../../../models/User';
 
 const messages = defineMessages({
@@ -123,7 +127,7 @@ class AccountDashboard extends Component<IProp> {
           )}
           {!isUsingWithoutAccount && (
             <>
-              {isLoading && <Loader color="#FFFFFF" />}
+              {isLoading && <Loader color={DEFAULT_LOADER_COLOR} />}
 
               {!isLoading && userInfoRequestFailed && (
                 <Infobox
diff --git a/src/components/settings/team/TeamDashboard.tsx b/src/components/settings/team/TeamDashboard.tsx
index 406656160..96613373e 100644
--- a/src/components/settings/team/TeamDashboard.tsx
+++ b/src/components/settings/team/TeamDashboard.tsx
@@ -10,7 +10,7 @@ import Loader from '../../ui/loader';
 import Button from '../../ui/button';
 import Infobox from '../../ui/Infobox';
 import { H1 } from '../../ui/headline';
-import { LIVE_FRANZ_API } from '../../../config';
+import { DEFAULT_LOADER_COLOR, LIVE_FRANZ_API } from '../../../config';
 
 const messages = defineMessages({
   headline: {
@@ -128,7 +128,7 @@ class TeamDashboard extends Component<IProps> {
           </span>
         </div>
         <div className="settings__body">
-          {isLoading && <Loader color="#FFFFFF" />}
+          {isLoading && <Loader color={DEFAULT_LOADER_COLOR} />}
 
           {!isLoading && userInfoRequestFailed && (
             <Infobox
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';
 import Loader from './loader/index';
 import Appear from './effects/Appear';
 import Icon from './icon';
+import { DEFAULT_LOADER_COLOR } from '../../config';
 
 const messages = defineMessages({
   hide: {
@@ -71,7 +72,11 @@ class InfoBar extends Component<IProps> {
                 className="contentWrapper"
                 style={{ display: 'flex', gap: '8px' }}
               >
-                <Loader size={18} loaded={!ctaLoading} color="#FFFFFF" />
+                <Loader
+                  size={18}
+                  loaded={!ctaLoading}
+                  color={DEFAULT_LOADER_COLOR}
+                />
                 {ctaLabel}
               </div>
             </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';
 import { observer } from 'mobx-react';
 import Loader from './loader/index';
 import Icon from './icon';
+import { DEFAULT_LOADER_COLOR } from '../../config';
 
 const icons = {
   'checkbox-marked-circle-outline': mdiCheckboxMarkedCircleOutline,
@@ -84,7 +85,11 @@ class Infobox extends Component<IProps, IState> {
               className="contentWrapper"
               style={{ display: 'flex', gap: '8px' }}
             >
-              <Loader size={18} loaded={!ctaLoading} color="#FFFFFF" />
+              <Loader
+                size={18}
+                loaded={!ctaLoading}
+                color={DEFAULT_LOADER_COLOR}
+              />
               {ctaLabel}
             </div>
           </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';
 import Loader from '../loader/index';
 import { Theme } from '../../../themes';
 import { IFormField } from '../typings/generic';
+import { DEFAULT_LOADER_COLOR } from '../../../config';
 
 type ButtonType =
   | 'primary'
@@ -194,7 +195,7 @@ class ButtonComponent extends Component<IProps, IState> {
       <>
         {showLoader && (
           <div className={classes.loaderContainer}>
-            <Loader size={18} color="#FFFFFF" />
+            <Loader size={18} color={DEFAULT_LOADER_COLOR} />
           </div>
         )}
         <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';
 import { Oval } from 'react-loader-spinner';
 import { inject } from 'mobx-react';
 import { FerdiumStores } from '../../../@types/stores.types';
+import { DEFAULT_LOADER_COLOR } from '../../../config';
 
 const styles = () => ({
   container: {
@@ -33,7 +34,7 @@ class LoaderComponent extends Component<IProps> {
       color = this.props.stores?.settings.app.accentColor,
       loaded = false,
     } = this.props;
-    const loaderColor = color ?? '#FFFFFF';
+    const loaderColor = color ?? DEFAULT_LOADER_COLOR;
 
     return (
       <div
diff --git a/src/config.ts b/src/config.ts
index 73ea25343..6e89cb9d1 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -343,6 +343,8 @@ export const DEFAULT_SERVICE_ORDER = 99; // something high enough that it gets a
 export const SPLIT_COLUMNS_MIN = 1;
 export const SPLIT_COLUMNS_MAX = 5;
 
+export const DEFAULT_LOADER_COLOR = '#FFFFFF';
+
 export const DEFAULT_APP_SETTINGS = {
   autoLaunchOnStart: false,
   autoLaunchInBackground: false,
diff --git a/src/features/workspaces/components/WorkspaceSwitchingIndicator.tsx b/src/features/workspaces/components/WorkspaceSwitchingIndicator.tsx
index 0fce811e5..19dd9037d 100644
--- a/src/features/workspaces/components/WorkspaceSwitchingIndicator.tsx
+++ b/src/features/workspaces/components/WorkspaceSwitchingIndicator.tsx
@@ -5,6 +5,7 @@ import classnames from 'classnames';
 import { defineMessages, injectIntl, WrappedComponentProps } from 'react-intl';
 import Loader from '../../../components/ui/loader';
 import { workspaceStore } from '../index';
+import { DEFAULT_LOADER_COLOR } from '../../../config';
 
 const messages = defineMessages({
   switchingTo: {
@@ -70,7 +71,7 @@ class WorkspaceSwitchingIndicator extends Component<IProps> {
     return (
       <div className={classnames([classes.wrapper])}>
         <div className={classes.component}>
-          <Loader className={classes.spinner} color="#FFFFFF" />
+          <Loader className={classes.spinner} color={DEFAULT_LOADER_COLOR} />
           <p className={classes.message}>
             {`${intl.formatMessage(messages.switchingTo)} ${nextWorkspaceName}`}
           </p>
diff --git a/src/themes/default/index.ts b/src/themes/default/index.ts
index cc886f299..ac04a6e3b 100644
--- a/src/themes/default/index.ts
+++ b/src/themes/default/index.ts
@@ -3,6 +3,7 @@ import { cloneDeep } from 'lodash';
 
 import * as legacyStyles from '../legacy';
 import type IStyleTypes from '../IStyleTypes';
+import { DEFAULT_LOADER_COLOR } from '../../config';
 
 export default (brandPrimary: string) => {
   if (!brandPrimary) {
@@ -14,7 +15,7 @@ export default (brandPrimary: string) => {
   const brandDanger = '#d9534f';
   const uiFontSize = 14;
   const colorBackground = legacyStyles.themeGrayLighter;
-  const colorContentBackground = '#FFFFFF';
+  const colorContentBackground = DEFAULT_LOADER_COLOR;
   const colorText = legacyStyles.themeGrayDark;
   const inputColor = legacyStyles.themeGray;
   const inputBackground = legacyStyles.themeGrayLightest;
-- 
cgit v1.2.3-54-g00ecf