From 944196899ab47f0900881bad1a6f8b084b010d7e Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Thu, 26 Dec 2024 08:18:40 +0100
Subject: [PATCH 1/5] feat: animate account refresh button

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 src/renderer/routes/Accounts.tsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/renderer/routes/Accounts.tsx b/src/renderer/routes/Accounts.tsx
index e906ce1a9..c66cf7894 100644
--- a/src/renderer/routes/Accounts.tsx
+++ b/src/renderer/routes/Accounts.tsx
@@ -153,9 +153,17 @@ export const AccountsRoute: FC = () => {
                   type="button"
                   className={cn(BUTTON_CLASS_NAME, 'px-0')}
                   title={`Refresh ${account.user.login}`}
-                  onClick={async () => {
+                  onClick={async (e) => {
+                    const button = e.currentTarget;
+                    button.classList.add('animate-spin');
+
                     await refreshAccount(account);
                     navigate('/accounts', { replace: true });
+
+                    // typically the above completes very quickly, so add an artificial delay to allow the spinner to do a few loops
+                    setTimeout(() => {
+                      button.classList.remove('animate-spin');
+                    }, 500);
                   }}
                 >
                   <SyncIcon

From d211bd6379c35147c637c5f6d280d25d281609b4 Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Thu, 26 Dec 2024 08:20:21 +0100
Subject: [PATCH 2/5] feat: animate account refresh button

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 src/renderer/routes/Accounts.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/renderer/routes/Accounts.tsx b/src/renderer/routes/Accounts.tsx
index c66cf7894..58d471844 100644
--- a/src/renderer/routes/Accounts.tsx
+++ b/src/renderer/routes/Accounts.tsx
@@ -160,7 +160,10 @@ export const AccountsRoute: FC = () => {
                     await refreshAccount(account);
                     navigate('/accounts', { replace: true });
 
-                    // typically the above completes very quickly, so add an artificial delay to allow the spinner to do a few loops
+                    /**
+                     * 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');
                     }, 500);

From f957752e8c0cc04d6a1a373e28f8f9627fd44578 Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Thu, 26 Dec 2024 17:46:29 +0100
Subject: [PATCH 3/5] feat: animate account refresh button

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 src/renderer/routes/Accounts.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/renderer/routes/Accounts.tsx b/src/renderer/routes/Accounts.tsx
index 58d471844..01f8a0f91 100644
--- a/src/renderer/routes/Accounts.tsx
+++ b/src/renderer/routes/Accounts.tsx
@@ -166,7 +166,7 @@ export const AccountsRoute: FC = () => {
                      */
                     setTimeout(() => {
                       button.classList.remove('animate-spin');
-                    }, 500);
+                    }, 250);
                   }}
                 >
                   <SyncIcon

From 9a80937815bdacbe3ea7b40c7519a40e7836650f Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Thu, 26 Dec 2024 17:48:32 +0100
Subject: [PATCH 4/5] feat: animate account refresh button

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 .../__snapshots__/Accounts.test.tsx.snap      | 126 +++++-------------
 1 file changed, 37 insertions(+), 89 deletions(-)

diff --git a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
index a58979d0a..2ba0493f3 100644
--- a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
+++ b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
@@ -15,14 +15,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
     >
       <svg
         aria-label="Go Back"
-        class="octicon octicon-arrow-left hover:text-gray-400"
-        display="inline-block"
+        class="hover:text-gray-400"
         fill="currentColor"
         focusable="false"
         height="20"
-        overflow="visible"
         role="img"
-        style="vertical-align: text-bottom;"
+        style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
         viewBox="0 0 16 16"
         width="20"
       >
@@ -40,13 +38,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
       >
         <svg
           aria-hidden="true"
-          class="octicon octicon-person mr-2"
-          display="inline-block"
+          class="mr-2"
           fill="currentColor"
           focusable="false"
           height="16"
-          overflow="visible"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="16"
         >
@@ -105,12 +101,10 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-mark-github"
-                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -135,12 +129,10 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-key"
-                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -161,14 +153,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Primary account"
-              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
-              display="inline-block"
+              class="text-yellow-500 dark:text-yellow-300"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -185,14 +175,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Set as primary account"
-              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
-              display="inline-block"
+              class="text-yellow-500 dark:text-yellow-300"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -209,13 +197,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Refresh octocat"
               class="octicon octicon-sync"
-              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -232,13 +218,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Logout octocat"
               class="octicon octicon-sign-out"
-              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -290,12 +274,10 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-server"
-                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -320,12 +302,10 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-person"
-                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -347,14 +327,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Primary account"
-              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
-              display="inline-block"
+              class="text-yellow-500 dark:text-yellow-300"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -370,14 +348,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Set as primary account"
-              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
-              display="inline-block"
+              class="text-yellow-500 dark:text-yellow-300"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -394,13 +370,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Refresh octocat"
               class="octicon octicon-sync"
-              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -417,13 +391,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Logout octocat"
               class="octicon octicon-sign-out"
-              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -475,12 +447,10 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-mark-github"
-                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -505,12 +475,10 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-apps"
-                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -532,14 +500,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Primary account"
-              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
-              display="inline-block"
+              class="text-yellow-500 dark:text-yellow-300"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -555,14 +521,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Set as primary account"
-              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
-              display="inline-block"
+              class="text-yellow-500 dark:text-yellow-300"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -579,13 +543,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Refresh octocat"
               class="octicon octicon-sync"
-              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -602,13 +564,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Logout octocat"
               class="octicon octicon-sign-out"
-              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -638,13 +598,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         <svg
           aria-label="Login with GitHub App"
           class="octicon octicon-mark-github"
-          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="18"
-          overflow="visible"
           role="img"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="18"
         >
@@ -654,13 +612,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
         <svg
           aria-hidden="true"
-          class="octicon octicon-plus mb-2 ml-1"
-          display="inline-block"
+          class="mb-2 ml-1"
           fill="currentColor"
           focusable="false"
           height="14"
-          overflow="visible"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="14"
         >
@@ -677,13 +633,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         <svg
           aria-label="Login with Personal Access Token"
           class="octicon octicon-key"
-          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="18"
-          overflow="visible"
           role="img"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="18"
         >
@@ -693,13 +647,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
         <svg
           aria-hidden="true"
-          class="octicon octicon-plus mb-2 ml-1"
-          display="inline-block"
+          class="mb-2 ml-1"
           fill="currentColor"
           focusable="false"
           height="14"
-          overflow="visible"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="14"
         >
@@ -716,13 +668,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         <svg
           aria-label="Login with OAuth App"
           class="octicon octicon-person"
-          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="20"
-          overflow="visible"
           role="img"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="20"
         >
@@ -732,13 +682,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
         <svg
           aria-hidden="true"
-          class="octicon octicon-plus mb-2"
-          display="inline-block"
+          class="mb-2"
           fill="currentColor"
           focusable="false"
           height="14"
-          overflow="visible"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="14"
         >

From 5f3e82fa26f8d1ed12357d5bf94d6d85f9775af2 Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Fri, 27 Dec 2024 07:27:38 +0100
Subject: [PATCH 5/5] feat: animate account refresh button

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 src/renderer/routes/Accounts.tsx              |   2 +-
 .../__snapshots__/Accounts.test.tsx.snap      | 126 +++++++++++++-----
 2 files changed, 90 insertions(+), 38 deletions(-)

diff --git a/src/renderer/routes/Accounts.tsx b/src/renderer/routes/Accounts.tsx
index 01f8a0f91..58d471844 100644
--- a/src/renderer/routes/Accounts.tsx
+++ b/src/renderer/routes/Accounts.tsx
@@ -166,7 +166,7 @@ export const AccountsRoute: FC = () => {
                      */
                     setTimeout(() => {
                       button.classList.remove('animate-spin');
-                    }, 250);
+                    }, 500);
                   }}
                 >
                   <SyncIcon
diff --git a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
index 2ba0493f3..a58979d0a 100644
--- a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
+++ b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
@@ -15,12 +15,14 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
     >
       <svg
         aria-label="Go Back"
-        class="hover:text-gray-400"
+        class="octicon octicon-arrow-left hover:text-gray-400"
+        display="inline-block"
         fill="currentColor"
         focusable="false"
         height="20"
+        overflow="visible"
         role="img"
-        style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+        style="vertical-align: text-bottom;"
         viewBox="0 0 16 16"
         width="20"
       >
@@ -38,11 +40,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
       >
         <svg
           aria-hidden="true"
-          class="mr-2"
+          class="octicon octicon-person mr-2"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="16"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          overflow="visible"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="16"
         >
@@ -101,10 +105,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-mark-github"
+                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -129,10 +135,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-key"
+                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -153,12 +161,14 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Primary account"
-              class="text-yellow-500 dark:text-yellow-300"
+              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -175,12 +185,14 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Set as primary account"
-              class="text-yellow-500 dark:text-yellow-300"
+              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -197,11 +209,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Refresh octocat"
               class="octicon octicon-sync"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -218,11 +232,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Logout octocat"
               class="octicon octicon-sign-out"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -274,10 +290,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-server"
+                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -302,10 +320,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-person"
+                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -327,12 +347,14 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Primary account"
-              class="text-yellow-500 dark:text-yellow-300"
+              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -348,12 +370,14 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Set as primary account"
-              class="text-yellow-500 dark:text-yellow-300"
+              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -370,11 +394,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Refresh octocat"
               class="octicon octicon-sync"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -391,11 +417,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Logout octocat"
               class="octicon octicon-sign-out"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -447,10 +475,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-mark-github"
+                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -475,10 +505,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-apps"
+                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -500,12 +532,14 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Primary account"
-              class="text-yellow-500 dark:text-yellow-300"
+              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -521,12 +555,14 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Set as primary account"
-              class="text-yellow-500 dark:text-yellow-300"
+              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -543,11 +579,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Refresh octocat"
               class="octicon octicon-sync"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -564,11 +602,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Logout octocat"
               class="octicon octicon-sign-out"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -598,11 +638,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         <svg
           aria-label="Login with GitHub App"
           class="octicon octicon-mark-github"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="18"
+          overflow="visible"
           role="img"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="18"
         >
@@ -612,11 +654,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
         <svg
           aria-hidden="true"
-          class="mb-2 ml-1"
+          class="octicon octicon-plus mb-2 ml-1"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="14"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          overflow="visible"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="14"
         >
@@ -633,11 +677,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         <svg
           aria-label="Login with Personal Access Token"
           class="octicon octicon-key"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="18"
+          overflow="visible"
           role="img"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="18"
         >
@@ -647,11 +693,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
         <svg
           aria-hidden="true"
-          class="mb-2 ml-1"
+          class="octicon octicon-plus mb-2 ml-1"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="14"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          overflow="visible"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="14"
         >
@@ -668,11 +716,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         <svg
           aria-label="Login with OAuth App"
           class="octicon octicon-person"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="20"
+          overflow="visible"
           role="img"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="20"
         >
@@ -682,11 +732,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
         <svg
           aria-hidden="true"
-          class="mb-2"
+          class="octicon octicon-plus mb-2"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="14"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          overflow="visible"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="14"
         >