Add is loading state

projkov · Jul 14, 2024 · c8d670b · c8d670b
1 parent f7bab61
commit c8d670b
Showing 1 changed file with 20 additions and 16 deletions.
diff --git a/src/components/ResourceContent/index.tsx b/src/components/ResourceContent/index.tsx
@@ -3,31 +3,35 @@ import { FhirResource, Bundle } from "fhir/r4";
 import { useResourceInfo } from "../../hooks";
 import { ResourceTable } from "../ResourceTable";
 import { ResourceContentProps } from "./interfaces";
-import { Result } from "antd";
+import { Result, Spin } from "antd";
+import { LoadingOutlined } from "@ant-design/icons";
 
 export function ResourceContent(props: ResourceContentProps) {
     const { resourceType, resourceConfig, serverUrl } = props;
     const { response } = useResourceInfo(resourceType, serverUrl)
 
     return (
-        <RenderRemoteData remoteData={response} renderFailure={() => {
-            if (serverUrl === '') {
+        <RenderRemoteData
+            remoteData={response}
+            renderFailure={() => {
+                if (serverUrl === '') {
+                    return <Result
+                        style={{ marginTop: '150px' }}
+                        title="Please enter the FHIR server URL to establish a connection."
+                        extra={[
+                            'Make sure the URL is correct and accessible to ensure successful integration.'
+                        ]}
+                    />
+                }
+
                 return <Result
                     style={{ marginTop: '150px' }}
-                    title="Please enter the FHIR server URL to establish a connection."
-                    extra={[
-                        'Make sure the URL is correct and accessible to ensure successful integration.'
-                    ]}
+                    status="error"
+                    title="Something went wrong"
+                    extra={["The FHIR server URL you provided is incorrect or there was an issue connecting to the server. Please check the URL and try again."]}
                 />
-            }
-
-            return <Result
-                style={{ marginTop: '150px' }}
-                status="error"
-                title="Something went wrong"
-                extra={["The FHIR server URL you provided is incorrect or there was an issue connecting to the server. Please check the URL and try again."]}
-            />
-        }}>
+            }}
+            renderLoading={() => <Spin indicator={<LoadingOutlined spin />} size="large" style={{ marginTop: '250px' }} />}>
             {(bundle) => (
                 <ResourceTable
                     bundle={bundle as Bundle<FhirResource>}