From de08ab6736400b74cf2d1aa68a5ceb55f4853d46 Mon Sep 17 00:00:00 2001
From: Pig Fang <g-plane@hotmail.com>
Date: Thu, 6 Feb 2020 09:01:21 +0800
Subject: [PATCH] allow custom fallback

---
 resources/assets/src/index.tsx                       | 2 +-
 resources/assets/src/scripts/{route.ts => route.tsx} | 9 +++++++++
 2 files changed, 10 insertions(+), 1 deletion(-)
 rename resources/assets/src/scripts/{route.ts => route.tsx} (91%)

diff --git a/resources/assets/src/index.tsx b/resources/assets/src/index.tsx
index 57b589a3..8d52162b 100644
--- a/resources/assets/src/index.tsx
+++ b/resources/assets/src/index.tsx
@@ -22,7 +22,7 @@ function loadModules() {
         route.react as (() => Promise<{ default: React.ComponentType }>)
       )
       const Root = () => (
-        <React.Suspense fallback={''}>
+        <React.Suspense fallback={route.frame ?? ''}>
           <Component />
         </React.Suspense>
       )
diff --git a/resources/assets/src/scripts/route.ts b/resources/assets/src/scripts/route.tsx
similarity index 91%
rename from resources/assets/src/scripts/route.ts
rename to resources/assets/src/scripts/route.tsx
index 1022eaea..43829200 100644
--- a/resources/assets/src/scripts/route.ts
+++ b/resources/assets/src/scripts/route.tsx
@@ -1,3 +1,5 @@
+import React from 'react'
+
 const virtual = document.createElement('div')
 
 export default [
@@ -12,6 +14,13 @@ export default [
     path: 'user',
     react: () => import('../views/user/Dashboard'),
     el: '#usage-box',
+    frame: (
+      <div className="card card-primary card-outline">
+        <div className="card-header">&nbsp;</div>
+        <div className="card-body"></div>
+        <div className="card-footer">&nbsp;</div>
+      </div>
+    )
   },
   {
     path: 'user/closet',