fix: keep the follow suggestions in place when syncing your profile from GitHub

package.json

@@ -8,7 +8,7 @@
         "lint": "NODE_OPTIONS='--experimental-strip-types' vp fmt resources/ && NODE_OPTIONS='--experimental-strip-types' vp lint --fix",
         "test:lint": "NODE_OPTIONS='--experimental-strip-types' vp fmt --check resources/ && NODE_OPTIONS='--experimental-strip-types' vp lint",
         "test:types": "tsc --noEmit && tsc --noEmit --project tests/tsconfig.json",
-        "test:unit": "php artisan wayfinder:generate --with-form && node --experimental-strip-types --test tests/Unit/*.test.ts"
+        "test:unit": "php artisan wayfinder:generate --with-form && node --experimental-strip-types --test tests/Unit/*.test.ts && vp test run tests/Unit/*.test.tsx"
     },
     "dependencies": {
         "@daypicker/react": "^10.0.2",

resources/js/components/edit-profile-menu.tsx

@@ -17,10 +17,17 @@ export function EditProfileMenu() {
 
     const sync = () =>
         router.visit(UserProfileController.update(), {
+            except: ['suggestedUsers', 'commits'],
             preserveScroll: true,
             onStart: () => setIsSyncing(true),
             onFinish: () => setIsSyncing(false),
-            onSuccess: () => router.flushAll(),
+            onSuccess: (page) => {
+                router.flushAll();
+
+                if (page.props.suggestedUsers === undefined) {
+                    router.reload({ only: ['suggestedUsers'] });
+                }
+            },
         });
 
     return (

resources/js/pages/user-profile/edit.tsx

@@ -67,8 +67,17 @@ export default function Edit({
                     </Button>
                     <Form
                         {...UserProfileController.update.form()}
-                        options={{ preserveScroll: true }}
-                        onSuccess={() => router.flushAll()}
+                        options={{
+                            except: ['suggestedUsers'],
+                            preserveScroll: true,
+                        }}
+                        onSuccess={(page) => {
+                            router.flushAll();
+
+                            if (page.props.suggestedUsers === undefined) {
+                                router.reload({ only: ['suggestedUsers'] });
+                            }
+                        }}
                     >
                         {({ processing }) => (
                             <Button

tests/Unit/ProfileSync.test.tsx

@@ -0,0 +1,132 @@
+/// <reference types="node" />
+import assert from 'node:assert/strict';
+import * as React from 'react';
+import type { ReactElement, ReactNode } from 'react';
+import { test, vi } from 'vite-plus/test';
+
+type Props = Record<string, unknown> & { children?: ReactNode };
+const visits: {
+    except?: string[];
+    preserveScroll?: boolean;
+    onSuccess?: (page: { props: { suggestedUsers?: unknown[] } }) => void;
+}[] = [];
+const reload = vi.fn();
+const flushAll = vi.fn();
+const suggestionStates = [
+    { state: 'missing', suggestedUsers: undefined },
+    { state: 'empty', suggestedUsers: [] },
+    { state: 'loaded', suggestedUsers: [{ id: 'suggested-user' }] },
+];
+
+vi.doMock('react', () => ({
+    ...React,
+    useState: (initial: unknown) => [initial, () => {}],
+}));
+vi.doMock('@inertiajs/react', async () => ({
+    ...(await vi.importActual('@inertiajs/react')),
+    router: {
+        reload,
+        flushAll,
+        visit: (_url: unknown, options: (typeof visits)[number]) =>
+            visits.push(options),
+    },
+}));
+vi.doMock('@/hooks/use-user', () => ({
+    useUser: () => ({ user: { id: 'viewer', handle: 'viewer' } }),
+}));
+vi.doMock('@/hooks/use-now', () => ({ useNow: () => 0 }));
+
+const { EditProfileMenu } =
+    await import('../../resources/js/components/edit-profile-menu');
+const { default: Edit } =
+    await import('../../resources/js/pages/user-profile/edit');
+
+function find(
+    node: ReactNode,
+    matches: (props: Props) => boolean,
+): ReactElement<Props> | null {
+    if (Array.isArray(node)) {
+        for (const child of node) {
+            const found = find(child, matches);
+
+            if (found) {
+                return found;
+            }
+        }
+
+        return null;
+    }
+
+    if (!React.isValidElement<Props>(node)) {
+        return null;
+    }
+
+    return matches(node.props) ? node : find(node.props.children, matches);
+}
+
+test.each(suggestionStates)(
+    'syncing from the profile menu preserves the feed and only reloads missing suggestions ($state)',
+    ({ suggestedUsers }) => {
+        reload.mockClear();
+        flushAll.mockClear();
+        const sync = find(
+            EditProfileMenu(),
+            (props) => props['data-test'] === 'sync-profile',
+        );
+        assert.ok(sync);
+
+        (sync.props.onSelect as () => void)();
+
+        assert.deepEqual(visits.at(-1)?.except, ['suggestedUsers', 'commits']);
+        assert.equal(visits.at(-1)?.preserveScroll, true);
+
+        visits.at(-1)?.onSuccess?.({ props: { suggestedUsers } });
+
+        assert.equal(flushAll.mock.calls.length, 1);
+        assert.deepEqual(
+            reload.mock.calls,
+            suggestedUsers === undefined
+                ? [[{ only: ['suggestedUsers'] }]]
+                : [],
+        );
+    },
+);
+
+test.each(suggestionStates)(
+    'syncing from settings only reloads missing suggestions ($state)',
+    ({ suggestedUsers }) => {
+        reload.mockClear();
+        flushAll.mockClear();
+        const form = find(
+            Edit({
+                translationLanguage: null,
+                translationLanguages: [],
+                preferredLane: null,
+                automaticLane: 1,
+                githubSyncedAt: null,
+                activityGraphUrl: '/activity',
+                profileUrl: '/@viewer',
+            }),
+            (props) => 'options' in props && 'onSuccess' in props,
+        );
+        assert.ok(form);
+
+        const options = form.props.options as (typeof visits)[number];
+        assert.deepEqual(options.except, ['suggestedUsers']);
+        assert.equal(options.preserveScroll, true);
+
+        (
+            form.props.onSuccess as NonNullable<
+                (typeof visits)[number]['onSuccess']
+            >
+        )({ props: { suggestedUsers } });
+
+        assert.equal(flushAll.mock.calls.length, 1);
+        assert.deepEqual(
+            reload.mock.calls,
+            suggestedUsers === undefined
+                ? [[{ only: ['suggestedUsers'] }]]
+                : [],
+        );
+    },
+);