Initial push

packages/ui/src/ui-component/loading/Loadable.js

@@ -0,0 +1,17 @@
+import { Suspense } from 'react'
+
+// project imports
+import Loader from './Loader'
+
+// ==============================|| LOADABLE - LAZY LOADING ||============================== //
+
+const Loadable = (Component) =>
+    function WithLoader(props) {
+        return (
+            <Suspense fallback={<Loader />}>
+                <Component {...props} />
+            </Suspense>
+        )
+    }
+
+export default Loadable

packages/ui/src/ui-component/loading/Loader.js

@@ -0,0 +1,21 @@
+// material-ui
+import LinearProgress from '@mui/material/LinearProgress'
+import { styled } from '@mui/material/styles'
+
+// styles
+const LoaderWrapper = styled('div')({
+    position: 'fixed',
+    top: 0,
+    left: 0,
+    zIndex: 1301,
+    width: '100%'
+})
+
+// ==============================|| LOADER ||============================== //
+const Loader = () => (
+    <LoaderWrapper>
+        <LinearProgress color='primary' />
+    </LoaderWrapper>
+)
+
+export default Loader