From 31eed5d7793db4d349313bed6ede0a9ef499e804 Mon Sep 17 00:00:00 2001
From: GitHub Action <github-action@users.noreply.github.com>
Date: Sat, 16 Sep 2023 15:39:36 +0000
Subject: [PATCH] Update content of files

---
 .../SandClockAnimation.module.scss73e0        |  2 ++
 .../SandClockAnimation/SandClockAnimation.tsx | 32 +++++++++++++++++++
 2 files changed, 34 insertions(+)
 create mode 100644 data/mini_app/wallet/src/components/animations/SandClockAnimation/SandClockAnimation.module.scss73e0
 create mode 100644 data/mini_app/wallet/src/components/animations/SandClockAnimation/SandClockAnimation.tsx

diff --git a/data/mini_app/wallet/src/components/animations/SandClockAnimation/SandClockAnimation.module.scss73e0 b/data/mini_app/wallet/src/components/animations/SandClockAnimation/SandClockAnimation.module.scss73e0
new file mode 100644
index 0000000000..0db94de753
--- /dev/null
+++ b/data/mini_app/wallet/src/components/animations/SandClockAnimation/SandClockAnimation.module.scss73e0
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"root":"j82N","clock":"sYj9"};
\ No newline at end of file
diff --git a/data/mini_app/wallet/src/components/animations/SandClockAnimation/SandClockAnimation.tsx b/data/mini_app/wallet/src/components/animations/SandClockAnimation/SandClockAnimation.tsx
new file mode 100644
index 0000000000..0d6cf1be61
--- /dev/null
+++ b/data/mini_app/wallet/src/components/animations/SandClockAnimation/SandClockAnimation.tsx
@@ -0,0 +1,32 @@
+import classNames from 'classnames';
+import Lottie, { LottieRefCurrentProps } from 'lottie-react';
+import { FC, useEffect, useRef } from 'react';
+
+import styles from './SandClockAnimation.module.scss';
+import animationData from './sand_clock.json';
+
+const SandClockAnimation: FC<{ className?: string }> = ({ className }) => {
+  const clockRef = useRef<LottieRefCurrentProps>(null);
+
+  const play = () => {
+    clockRef.current?.goToAndPlay(0);
+  };
+
+  useEffect(() => {
+    play();
+  }, []);
+
+  return (
+    <div className={classNames(styles.root, className)}>
+      <Lottie
+        lottieRef={clockRef}
+        className={styles.clock}
+        animationData={animationData}
+        autoplay={false}
+        loop={false}
+      />
+    </div>
+  );
+};
+
+export default SandClockAnimation;