21221: Fetch count of group members in groups panel and store with resource.

[arvados.git] / services / workbench2 / src / components / loading / inline-pulser.tsx

diff --git a/services/workbench2/src/components/loading/inline-pulser.tsx b/services/workbench2/src/components/loading/inline-pulser.tsx
new file mode 100644 (file)
index 0000000..def6b5e
--- /dev/null
+++ b/services/workbench2/src/components/loading/inline-pulser.tsx
@@ -0,0 +1,30 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import React from 'react';
+import { ThreeDots } from 'react-loader-spinner'
+import { withTheme } from '@material-ui/core';
+import { ArvadosTheme } from 'common/custom-theme';
+
+type ThemeProps = {
+    theme: ArvadosTheme;
+};
+
+type Props = {
+    color?: string;
+    height?: number;
+    width?: number;
+    radius?: number;
+};
+
+export const InlinePulser = withTheme()((props: Props & ThemeProps) => (
+    <ThreeDots
+        visible={true}
+        height={props.height || "30"}
+        width={props.width || "30"}
+        color={props.color || props.theme.customs.colors.greyL}
+        radius={props.radius || "10"}
+        ariaLabel="three-dots-loading"
+    />
+));