Fixes bank sync notification overlap with uncategorized transactions

actualbudget · Oct 5, 2024 · 3e32b93 · 3e32b93
1 parent a28fb93
commit 3e32b93
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 11 deletions.
diff --git a/packages/desktop-client/src/components/BankSyncStatus.tsx b/packages/desktop-client/src/components/BankSyncStatus.tsx
@@ -21,23 +21,20 @@ export function BankSyncStatus() {
   const transitions = useTransition(
     accountsSyncingCount > 0 ? 'syncing' : null,
     {
-      from: { opacity: 0, transform: 'translateY(-100px)' },
-      enter: { opacity: 1, transform: 'translateY(0)' },
-      leave: { opacity: 0, transform: 'translateY(-100px)' },
+      from: { opacity: 0 },
+      enter: { opacity: 1 },
+      leave: { opacity: 0 },
       unique: true,
     },
   );
 
   return (
     <View
       style={{
-        position: 'absolute',
-        top: 0,
-        left: 0,
-        right: 0,
-        marginTop: 5,
-        alignItems: 'center',
         zIndex: 501,
+        flexDirection: 'row',
+        overflow: 'hidden',
+        textWrap: 'nowrap',
       }}
     >
       {transitions(

diff --git a/packages/desktop-client/src/components/FinancesApp.tsx b/packages/desktop-client/src/components/FinancesApp.tsx
@@ -22,7 +22,6 @@ import { useResponsive } from '../ResponsiveProvider';
 import { theme } from '../style';
 import { getIsOutdated, getLatestVersion } from '../util/versions';
 
-import { BankSyncStatus } from './BankSyncStatus';
 import { View } from './common/View';
 import { GlobalKeys } from './GlobalKeys';
 import { ManageRulesPage } from './ManageRulesPage';
@@ -174,7 +173,6 @@ export function FinancesApp() {
               }}
             />
             <Notifications />
-            <BankSyncStatus />
 
             <Routes>
               <Route

diff --git a/packages/desktop-client/src/components/Titlebar.tsx b/packages/desktop-client/src/components/Titlebar.tsx
@@ -26,6 +26,7 @@ import { theme, type CSSProperties, styles } from '../style';
 
 import { AccountSyncCheck } from './accounts/AccountSyncCheck';
 import { AnimatedRefresh } from './AnimatedRefresh';
+import { BankSyncStatus } from './BankSyncStatus';
 import { MonthCountSelector } from './budget/MonthCountSelector';
 import { Button } from './common/Button2';
 import { Link } from './common/Link';
@@ -332,6 +333,7 @@ export function Titlebar({ style }: TitlebarProps) {
         <Route path="*" element={null} />
       </Routes>
       <View style={{ flex: 1 }} />
+      <BankSyncStatus />
       <UncategorizedButton />
       {isDevelopmentEnvironment() && !Platform.isPlaywright && (
         <ThemeSelector style={{ marginLeft: 10 }} />

diff --git a/upcoming-release-notes/3577.md b/upcoming-release-notes/3577.md
@@ -0,0 +1,6 @@
+---
+category: Bugfix
+authors: [The-Firexx]
+---
+
+Fixes bank sync notification overlap with uncategorized transactions