Add loading component

1 files changed, 21 insertions, 0 deletions

diff --git a/packages/website/ts/components/portal/loading.tsx b/packages/website/ts/components/portal/loading.tsx
new file mode 100644
index 000000000..d804dd1b8
--- /dev/null
+++ b/packages/website/ts/components/portal/loading.tsx
@@ -0,0 +1,21 @@
+import CircularProgress from 'material-ui/CircularProgress';
+import * as React from 'react';
+
+const CIRCULAR_PROGRESS_SIZE = 40;
+const CIRCULAR_PROGRESS_THICKNESS = 5;
+
+export interface LoadingProps {
+    isLoading: boolean;
+    content: React.ReactNode;
+}
+export const Loading = (props: LoadingProps) => {
+    if (props.isLoading) {
+        return (
+            <div className="center">
+                <CircularProgress size={CIRCULAR_PROGRESS_SIZE} thickness={CIRCULAR_PROGRESS_THICKNESS} />
+            </div>
+        );
+    } else {
+        return <div>{props.content}</div>;
+    }
+};