Fix: file-manager and swarm-desktop bugs (#714)

- drive capacity display with stamp polling
- download/upload progress handling
- overlay and tooltip issues
- FileMaganger readme
- ultra-light mode handling
- account feed view page
- download media files
- remove not found syncing link
- fix ultra light node wallet page
- tooltip issues
---------
Co-authored-by: Andrei Mitrea <andrei.mitrea.hq@gmail.com>
Co-authored-by: nidishk <nidishkrishnan45@gmail.com>
Co-authored-by: Ferenc Sárai <sarai.ferenc@gmail.com>
Co-authored-by: Nándor Komlódi <nandor.komlodi@gmail.com>
Co-authored-by: rolandlor <33499567+rolandlor@users.noreply.github.com>

src/modules/filemanager/components/NotificationBar/NotificationBar.tsx

@@ -7,10 +7,18 @@ import { Context as SettingsContext } from '../../../../providers/Settings'
 import { PostageBatch } from '@ethersphere/bee-js'
 import { Context as FMContext } from '../../../../providers/FileManager'
 import { DriveInfo } from '@solarpunkltd/file-manager-lib'
+import { FILE_MANAGER_EVENTS } from '../../constants/common'
 
 const NUMBER_OF_DAYS_WARNING = 7
 const DAYS_TO_MILLISECONDS_MULTIPLIER = 24 * 60 * 60 * 1000
 
+const isExpiring = (s: PostageBatch): boolean => {
+  return (
+    s.duration &&
+    s.duration.toEndDate().getTime() <= Date.now() + NUMBER_OF_DAYS_WARNING * DAYS_TO_MILLISECONDS_MULTIPLIER
+  )
+}
+
 interface NotificationBarProps {
   setErrorMessage?: (error: string) => void
 }
@@ -20,7 +28,7 @@ export function NotificationBar({ setErrorMessage }: NotificationBarProps): Reac
   const [stampsToExpire, setStampsToExpire] = useState<PostageBatch[]>([])
   const [drivesToExpire, setDrivesToExpire] = useState<DriveInfo[]>([])
   const { beeApi } = useContext(SettingsContext)
-  const { drives, adminDrive } = useContext(FMContext)
+  const { drives, files, adminDrive } = useContext(FMContext)
 
   const showExpiration = stampsToExpire.length > 0
 
@@ -38,12 +46,7 @@ export function NotificationBar({ setErrorMessage }: NotificationBarProps): Reac
           (adminDrive?.batchId.toString() === stamp.batchID.toString() ? adminDrive : null)
 
         if (matchingDrive) {
-          const isExpiring =
-            stamp.duration &&
-            stamp.duration.toEndDate().getTime() <=
-              Date.now() + NUMBER_OF_DAYS_WARNING * DAYS_TO_MILLISECONDS_MULTIPLIER
-
-          if (isExpiring) {
+          if (isExpiring(stamp)) {
             expiringStamps.push(stamp)
             expiringDrives.push(matchingDrive)
           }
@@ -61,7 +64,37 @@ export function NotificationBar({ setErrorMessage }: NotificationBarProps): Reac
     return () => {
       isMounted = false
     }
-  }, [beeApi, drives, adminDrive])
+  }, [beeApi, drives, adminDrive, setErrorMessage])
+
+  useEffect(() => {
+    const onDriveUpgradeEnd = (e: Event) => {
+      const { driveId, success, updatedStamp } = (e as CustomEvent).detail || {}
+
+      if (success && updatedStamp && driveId) {
+        if (!isExpiring(updatedStamp)) {
+          setTimeout(() => {
+            setStampsToExpire(prev => {
+              const stampIx = prev.findIndex(s => s.batchID.toString() === updatedStamp.batchID.toString())
+
+              return stampIx !== -1 ? prev.filter((_, i) => i !== stampIx) : prev
+            })
+
+            setDrivesToExpire(prev => {
+              const driveIx = prev.findIndex(d => d.id.toString() === driveId)
+
+              return driveIx !== -1 ? prev.filter((_, i) => i !== driveIx) : prev
+            })
+          }, 150)
+        }
+      }
+    }
+
+    window.addEventListener(FILE_MANAGER_EVENTS.DRIVE_UPGRADE_END, onDriveUpgradeEnd as EventListener)
+
+    return () => {
+      window.removeEventListener(FILE_MANAGER_EVENTS.DRIVE_UPGRADE_END, onDriveUpgradeEnd as EventListener)
+    }
+  }, [])
 
   if (!showExpiration) return null
 
@@ -74,6 +107,7 @@ export function NotificationBar({ setErrorMessage }: NotificationBarProps): Reac
         <ExpiringNotificationModal
           stamps={stampsToExpire}
           drives={drivesToExpire}
+          files={files}
           onCancelClick={() => {
             setShowExpiringModal(false)
           }}