From 2ed883610e50981b741fbe67ae8cbc25221357a4 Mon Sep 17 00:00:00 2001
From: Jakob <haruhunab1320@gmail.com>
Date: Fri, 14 Jun 2024 20:35:11 -0700
Subject: [PATCH] refactor: Optimize loading process in MagickIDE component

---
 packages/client/editor/src/main.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/client/editor/src/main.tsx b/packages/client/editor/src/main.tsx
index b9d60913f3..f9ac121de9 100644
--- a/packages/client/editor/src/main.tsx
+++ b/packages/client/editor/src/main.tsx
@@ -6,9 +6,7 @@
  */
 import React, { useEffect, useState } from 'react'
 import { Provider } from 'react-redux'
-
 import 'regenerator-runtime/runtime'
-
 import App from './App'
 import AppProviders from './contexts/AppProviders'
 import { AppConfig } from '@magickml/providers'
@@ -48,12 +46,12 @@ export const MagickIDE = ({
 }: MagickIDEProps): React.ReactElement | null => {
   const loading = useState(true)
   const loadingStatus = useState(LoadingStatus.INITIALIZING)
+
   useEffect(() => {
     ;(async () => {
       loadingStatus[1](LoadingStatus.CONNECTING)
       await feathersClient.initialize(config.token, config)
       loading && loading[1](false)
-      loading[1](false)
       loadingStatus[1](LoadingStatus.READY)
     })()
   }, [config, loading])
@@ -63,12 +61,14 @@ export const MagickIDE = ({
   return (
     <Provider store={createStore(config)}>
       <AppProviders config={config}>
-        <div className="flex flex-col h-screen w-full">
+        <div className="flex flex-col w-full h-full overflow-hidden">
           <TopBar
             rightTopBarItems={rightTopBarItems}
             leftTopBarItems={leftTopBarItems}
           />
-          <App />
+          <div className="flex-grow overflow-auto">
+            <App />
+          </div>
         </div>
       </AppProviders>
     </Provider>