fix add account error

Signed-off-by: Adam Setch <[email protected]>

Author: setchy

src/renderer/components/settings/AppearanceSettings.tsx

@@ -260,8 +260,8 @@ export const AppearanceSettings: FC = () => {
         <Checkbox
           name="showAccountHeader"
           label="Show account header"
-          checked={settings.showAccountHeader || hasMultipleAccounts(auth)}
-          disabled={hasMultipleAccounts(auth)}
+          checked={settings.showAccountHeader}
+          visible={!hasMultipleAccounts(auth)}
           onChange={(evt) =>
             updateSetting('showAccountHeader', evt.target.checked)
           }

src/renderer/routes/Accounts.tsx

@@ -49,6 +49,10 @@ export const AccountsRoute: FC = () => {
     useContext(AppContext);
   const navigate = useNavigate();
 
+  const [loadingStates, setLoadingStates] = useState<Record<string, boolean>>(
+    {},
+  );
+
   const logoutAccount = useCallback(
     (account: Account) => {
       logoutFromAccount(account);
@@ -65,6 +69,29 @@ export const AccountsRoute: FC = () => {
     navigate('/accounts', { replace: true });
   }, []);
 
+  const handleRefresh = useCallback(async (account: Account) => {
+    const accountUUID = getAccountUUID(account);
+
+    setLoadingStates((prev) => ({
+      ...prev,
+      [accountUUID]: true,
+    }));
+
+    await refreshAccount(account);
+    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(() => {
+      setLoadingStates((prev) => ({
+        ...prev,
+        [accountUUID]: false,
+      }));
+    }, 500);
+  }, []);
+
   const loginWithGitHub = useCallback(async () => {
     try {
       await loginWithGitHubApp();
@@ -89,11 +116,11 @@ export const AccountsRoute: FC = () => {
         {auth.accounts.map((account, i) => {
           const AuthMethodIcon = getAuthMethodIcon(account.method);
           const PlatformIcon = getPlatformIcon(account.platform);
-          const [isRefreshingAccount, setIsRefreshingAccount] = useState(false);
+          const accountUUID = getAccountUUID(account);
 
           return (
             <Box
-              key={getAccountUUID(account)}
+              key={accountUUID}
               className="rounded-md p-2 mb-4 bg-gitify-accounts"
             >
               <Stack
@@ -191,22 +218,9 @@ export const AccountsRoute: FC = () => {
                   <IconButton
                     icon={SyncIcon}
                     aria-label={`Refresh ${account.user.login}`}
-                    onClick={async () => {
-                      setIsRefreshingAccount(true);
-
-                      await refreshAccount(account);
-                      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(() => {
-                        setIsRefreshingAccount(false);
-                      }, 500);
-                    }}
+                    onClick={() => handleRefresh(account)}
                     size="small"
-                    loading={isRefreshingAccount}
+                    loading={loadingStates[accountUUID] || false}
                     data-testid="account-refresh"
                   />
 

src/renderer/routes/__snapshots__/Settings.test.tsx.snap

@@ -108,6 +108,8 @@ export async function addAccount(
   token: Token,
   hostname: Hostname,
 ): Promise<AuthState> {
+  const accountList = auth.accounts;
+
   let newAccount = {
     hostname: hostname,
     method: method,
@@ -116,9 +118,23 @@ export async function addAccount(
   } as Account;
 
   newAccount = await refreshAccount(newAccount);
+  const newAccountUUID = getAccountUUID(newAccount);
+
+  const existingAccount = accountList.find(
+    (a) => getAccountUUID(a) === newAccountUUID,
+  );
+
+  if (existingAccount) {
+    logWarn(
+      'addAccount',
+      `account for user ${newAccount.user.login} already exists`,
+    );
+  } else {
+    accountList.push(newAccount);
+  }
 
   return {
-    accounts: [...auth.accounts, newAccount],
+    accounts: accountList,
   };
 }
 
@@ -136,6 +152,8 @@ export async function refreshAccount(account: Account): Promise<Account> {
   try {
     const res = await getAuthenticatedUser(account.hostname, account.token);
 
+    // console.log('ADAM RESPONSE', JSON.stringify(res, null, 2));
+
     // Refresh user data
     account.user = {
       id: res.data.id,