Stopped accounts you're already following showing in suggestions

close https://linear.app/ghost/issue/AP-741/dont-suggest-accounts-user-is-already-following

- We were suggesting you follow accounts the user is already following. Now we first filter out those, and only then choose random accounts to show to the user.
- Updated suggested accounts list with more private beta participants and accounts Building ActivityPub is following
- Removed accounts that are no longer working
- Updated `FollowButton` to use the `Button` component from our new Shade design system
- Bumped the package

apps/admin-x-activitypub/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tryghost/admin-x-activitypub",
-  "version": "0.3.63",
+  "version": "0.3.64",
   "license": "MIT",
   "repository": {
     "type": "git",

apps/admin-x-activitypub/src/components/global/FollowButton.tsx

@@ -1,5 +1,5 @@
 import clsx from 'clsx';
-import {Button} from '@tryghost/admin-x-design-system';
+import {Button} from '@tryghost/shade';
 import {useEffect, useState} from 'react';
 import {useFollowMutationForUser, useUnfollowMutationForUser} from '../../hooks/useActivityPubQueries';
 
@@ -57,9 +57,9 @@ const FollowButton: React.FC<FollowButtonProps> = ({
         setIsFollowing(following);
     }, [following]);
 
-    const color = (type === 'primary') ? 'black' : 'grey';
-    const size = (type === 'primary') ? 'md' : 'sm';
-    const minWidth = (type === 'primary') ? 'min-w-[96px]' : 'min-w-[88px]';
+    const variant = (isFollowing ? 'outline' : (type === 'primary') ? 'default' : 'secondary');
+    const size = (type === 'primary') ? 'default' : 'sm';
+    const minWidth = (type === 'primary') ? 'min-w-[83.67px]' : 'min-w-[81.15px]';
 
     return (
         <Button
@@ -67,9 +67,8 @@ const FollowButton: React.FC<FollowButtonProps> = ({
                 className,
                 isFollowing && minWidth
             )}
-            color={isFollowing ? 'outline' : color}
-            label={isFollowing ? (isHovered ? 'Unfollow' : 'Following') : 'Follow'}
             size={size}
+            variant={variant}
             onClick={(event) => {
                 event?.preventDefault();
                 event?.stopPropagation();
@@ -77,7 +76,9 @@ const FollowButton: React.FC<FollowButtonProps> = ({
             }}
             onMouseEnter={() => setIsHovered(true)}
             onMouseLeave={() => setIsHovered(false)}
-        />
+        >
+            {isFollowing ? (isHovered ? 'Unfollow' : 'Following') : 'Follow'}
+        </Button>
     );
 };
 

apps/admin-x-activitypub/src/hooks/useActivityPubQueries.ts

@@ -529,7 +529,19 @@ export function useSuggestedProfilesForUser(handle: string, limit = 3) {
         '@index@ghost.codenamejimmy.com',
         '@index@www.syphoncontinuity.com',
         '@index@www.cosmico.org',
-        '@index@silverhuang.com'
+        '@index@www.nightwater.email',
+        '@index@www.russbrown.design',
+        '@index@www.jeremyajorgensen.com',
+        '@index@www.savingsasaservice.com.au',
+        '@index@blogpocket-week.ghost.io',
+        '@index@www.bramadams.dev',
+        '@index@danielverastiqui.com',
+        '@mike@flipboard.social',
+        '@_elena@mastodon.social',
+        '@Gargron@mastodon.social',
+        '@quillmatiq@mastodon.social',
+        '@chrismessina@mastodon.xyz',
+        '@miaq@flipboard.social'
     ];
 
     const suggestedProfilesQuery = useQuery({
@@ -538,15 +550,20 @@ export function useSuggestedProfilesForUser(handle: string, limit = 3) {
             const siteUrl = await getSiteUrl();
             const api = createActivityPubAPI(handle, siteUrl);
 
+            // Get all profiles and filter out the ones we're following
             return Promise.allSettled(
                 suggestedHandles
                     .sort(() => Math.random() - 0.5)
-                    .slice(0, limit)
                     .map(suggestedHandle => api.getProfile(suggestedHandle))
             ).then((results) => {
-                return results
+                const profiles = results
                     .filter((result): result is PromiseFulfilledResult<Profile> => result.status === 'fulfilled')
-                    .map(result => result.value);
+                    .map(result => result.value)
+                    // Filter out profiles we're already following
+                    .filter(profile => !profile.isFollowing);
+
+                // Return only the requested number of profiles
+                return profiles.slice(0, limit);
             });
         }
     });