From 043a7214292a5f84a5aad4fd69c9095c5f73ceb2 Mon Sep 17 00:00:00 2001
From: Adrien <me@adrien.run>
Date: Sat, 9 Mar 2024 13:04:01 +0100
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20Make=20Spinner=20animation=20suspen?=
 =?UTF-8?q?dable?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/spinner.rs   | 11 +++++++++--
 src/components/spinner.scss |  5 +++++
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/components/spinner.rs b/src/components/spinner.rs
index cb4a773..234a779 100644
--- a/src/components/spinner.rs
+++ b/src/components/spinner.rs
@@ -23,14 +23,21 @@ impl IconShape for _Spinner {
     }
 }
 
-#[component]
-pub fn Spinner(cx: Scope) -> Element {
+#[derive(PartialEq, Props)]
+pub struct SpinnerProps {
+    #[props(default = true)]
+    animate: bool,
+}
+
+pub fn Spinner(cx: Scope<SpinnerProps>) -> Element {
     cx.render(rsx! {
         style { STYLE_SHEET },
 
         div {
             class: ClassName::ROOT,
+
             Icon {
+                class: if cx.props.animate { "" } else { ClassName::PAUSED },
                 icon: _Spinner,
             }
         }
diff --git a/src/components/spinner.scss b/src/components/spinner.scss
index e5e979b..d26b066 100644
--- a/src/components/spinner.scss
+++ b/src/components/spinner.scss
@@ -35,5 +35,10 @@ $logo-aspect-ratio: calc($logo-width / $logo-height);
                 fill: $color-ternary-100;
             }
         }
+
+        &.paused {
+            animation-play-state: paused;
+        }
+
     }
 }