Added Loading state in Customise store page

newfold-labs · Aug 12, 2022 · 260d018 · 260d018
1 parent 52bcb1d
commit 260d018
Showing 1 changed file with 18 additions and 2 deletions.
diff --git a/src/components/CustomizeStore.js b/src/components/CustomizeStore.js
@@ -24,12 +24,28 @@ const CustomizeList = [
 ];
 
 export function CustomizeStore({ plugins }) {
-  let { data: status } = useSWR(Endpoints.PAGE_STATUS);
+  let { data: status, error } = useSWR(Endpoints.PAGE_STATUS);
   let { pages, theme } = status ?? {};
   let pagesByName = Object.fromEntries(
     pages?.map((_) => [_["meta_value"], _["ID"]]) ?? []
   );
-  // TODO: Add Loading state
+
+  if (status === undefined) {
+    return (
+      <div style={{ height: "100%", display: "grid", placeContent: "center" }}>
+        {error ? (
+          <h2>
+            {__(
+              "There was an error while loading this information",
+              "wp-module-ecommerce"
+            )}
+          </h2>
+        ) : (
+          <div className="bwa-loader" />
+        )}
+      </div>
+    );
+  }
   return (
     <DashboardContent
       title={__("Customize Your Store", "wp-module-ecommerce")}