fix: filemanager state handling (#232)

* fix: filemanager state handling
* refactor: fm provider and fm page
* fix: detect bee warmup and wait more for syncing
* refactor: optimize bee provider to avoid rerenders
---------

Co-authored-by: Roland Seres <roland.seres90@gmail.com>

src/modules/filemanager/components/ConfirmModal/ConfirmModal.tsx

@@ -1,4 +1,4 @@
-import React, { ReactElement } from 'react'
+import React, { ReactElement, useLayoutEffect, useState } from 'react'
 import { createPortal } from 'react-dom'
 
 import { Button } from '../Button/Button'
@@ -35,7 +35,11 @@ export function ConfirmModal({
   onMinimize,
   background = true,
 }: ConfirmModalProps): ReactElement {
-  const modalRoot = document.querySelector('.fm-main') || document.body
+  const [modalRoot, setModalRoot] = useState<Element>(() => document.querySelector('.fm-main') || document.body)
+
+  useLayoutEffect(() => {
+    setModalRoot(document.querySelector('.fm-main') || document.body)
+  }, [])
 
   return createPortal(
     <div className={`fm-modal-container fm-confirm-modal ${background ? '' : 'fm-modal-no-background'}`}>

src/modules/filemanager/components/InitialModal/InitialModal.tsx

@@ -20,7 +20,6 @@ import './InitialModal.scss'
 
 interface InitialModalProps {
   resetState: boolean
-  handleVisibility: (isVisible: boolean) => void
   handleShowError: (flag: boolean, errorMessage?: string) => void
   setIsCreationInProgress: (isCreating: boolean) => void
 }
@@ -65,7 +64,6 @@ const setSecurityLevel = (setter: (value: RedundancyLevel) => void) => {
 export function InitialModal({
   resetState,
   setIsCreationInProgress,
-  handleVisibility,
   handleShowError,
 }: InitialModalProps): ReactElement {
   const [isCreateEnabled, setIsCreateEnabled] = useState(false)
@@ -133,7 +131,6 @@ export function InitialModal({
 
   const createAdminDrive = useCallback(async () => {
     setIsCreationInProgress?.(true)
-    handleVisibility(false)
 
     await handleCreateDrive({
       beeApi,
@@ -148,7 +145,6 @@ export function InitialModal({
       resetState,
       existingBatch: selectedBatch,
       onSuccess: () => {
-        handleVisibility(false)
         setIsCreationInProgress(false)
       },
       onError: err => {
@@ -164,7 +160,6 @@ export function InitialModal({
     validityEndDate,
     erasureCodeLevel,
     selectedBatch,
-    handleVisibility,
     handleShowError,
     setIsCreationInProgress,
     resetState,