feat: animate account refresh (#471)

Signed-off-by: Adam Setch <adam.setch@outlook.com>
setchy · Dec 28, 2024 · 916b922 · 916b922
1 parent baebbcf
commit 916b922
Show file tree

Hide file tree

Showing 2 changed files with 43,596 additions and 14,617 deletions.
diff --git a/src/renderer/routes/Accounts.tsx b/src/renderer/routes/Accounts.tsx
@@ -86,9 +86,22 @@ export const AccountsRoute: FC = () => {
                         icon={RefreshIcon}
                         shape="circle"
                         appearance="subtle"
-                        onClick={async () => {
+                        onClick={async (e) => {
+                          const button = e.currentTarget;
+                          button.classList.add('animate-spin');
+
                           await refreshAccount(account);
-                          navigate('/accounts', { replace: true });
+                          navigate('/accounts', {
+                            replace: true,
+                          });
+
+                          /**
+                           * Typically the above refresh API call completes very quickly,
+                           * so we add an brief artificial delay to allow the icon to spin a few times
+                           */
+                          setTimeout(() => {
+                            button.classList.remove('animate-spin');
+                          }, 250);
                         }}
                         testId="account-refresh"
                       />