From f37fcf2771fe7afe922754a412703ba461f6e9b7 Mon Sep 17 00:00:00 2001
From: MTG2000 <mtg0987654321@gmail.com>
Date: Wed, 30 Mar 2022 16:37:25 +0300
Subject: [PATCH] chore: refactor modals structure to support lazy loading when
 needed

---
 .../ProjectPage/ProjectDetailsCard/index.tsx  | 27 +++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 src/pages/ProjectPage/ProjectDetailsCard/index.tsx

diff --git a/src/pages/ProjectPage/ProjectDetailsCard/index.tsx b/src/pages/ProjectPage/ProjectDetailsCard/index.tsx
new file mode 100644
index 0000000..09be824
--- /dev/null
+++ b/src/pages/ProjectPage/ProjectDetailsCard/index.tsx
@@ -0,0 +1,27 @@
+import React, { ComponentProps, ComponentType, Suspense } from 'react'
+import ProjectDetailsCardSkeleton from './ProjectDetailsCard.Skeleton'
+
+
+
+function lazyFactory(Factory: () => Promise<{ default: ComponentType<any>; }>) {
+    const C = React.lazy(Factory)
+    const preload = Factory;
+    const LazyComponent = ({ direction, ...props }: ComponentProps<typeof C>) => <Suspense
+        fallback={
+            // <ProjectDetailsCardSkeleton direction={direction} {...props} />
+            <h2>Loading Modal</h2>
+        }>
+        <C {...props} />
+    </Suspense>
+
+    return { LazyComponent, preload };
+}
+
+export const {
+    LazyComponent: ProjectDetailsCard,
+    preload: projectDetailsCardPreload
+} = lazyFactory(() => import('./ProjectDetailsCard'))
+
+
+
+