a bit of refactor, use context for overall broacast status; move files around for routing

web/pages/_app.tsx

@@ -1,15 +1,21 @@
-// import 'antd/dist/antd.css';
-// import '../styles/globals.scss'
-
 import 'antd/dist/antd.dark.css';
 import 'antd/dist/antd.compact.css';
-
 import "../styles/globals.scss";
 
-import { AppProps } from 'next/app'
+import { AppProps } from 'next/app';
+import BroadcastStatusProvider from './utils/broadcast-status-context';
+import MainLayout from './components/main-layout';
+
 
 function App({ Component, pageProps }: AppProps) {
-  return <Component {...pageProps} />
+  return (
+    <BroadcastStatusProvider>
+      <MainLayout>
+        <Component {...pageProps} />
+      </MainLayout>
+    </BroadcastStatusProvider>
+    
+  )
 }
 
-export default App
+export default App;