feat: add FAB action button to update all proxy providers

2 files changed, 32 insertions, 0 deletions

diff --git a/src/components/shared/RotateIcon.module.css b/src/components/shared/RotateIcon.module.css
new file mode 100644
index 0000000..60748de
--- /dev/null
+++ b/src/components/shared/RotateIcon.module.css
@@ -0,0 +1,16 @@
+.rotate {
+  display: inline-flex;
+}
+.isRotating {
+  animation: rotating 3s infinite linear;
+  animation-fill-mode: forwards;
+}
+
+@keyframes rotating {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
diff --git a/src/components/shared/RotateIcon.tsx b/src/components/shared/RotateIcon.tsx
new file mode 100644
index 0000000..e2d4ad8
--- /dev/null
+++ b/src/components/shared/RotateIcon.tsx
@@ -0,0 +1,16 @@
+import cx from 'clsx';
+import * as React from 'react';
+import { RotateCw } from 'react-feather';
+
+import s from './RotateIcon.module.css';
+
+export function RotateIcon({ isRotating }: { isRotating: boolean }) {
+  const cls = cx(s.rotate, {
+    [s.isRotating]: isRotating,
+  });
+  return (
+    <span className={cls}>
+      <RotateCw width={16} />
+    </span>
+  );
+}