fix(github): complete user authorization flow

eshurakov · eshurakov · commit 4c663ac06c35 · 2026-06-01T22:07:50.000+02:00
Surface contextual identity setup guidance in Cloud Agent and identify revocation requests so disconnect succeeds against GitHub.
diff --git a/apps/web/src/components/cloud-agent-next/NewSessionPanel.tsx b/apps/web/src/components/cloud-agent-next/NewSessionPanel.tsx
@@ -2,6 +2,7 @@
 
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import Link from 'next/link';
 import { useRouter } from 'next/navigation';
 import { useAtom, useSetAtom } from 'jotai';
 import { toast } from 'sonner';
@@ -89,6 +90,12 @@ import {
   setLastUsedRepo,
   setLastUsedVariant,
 } from '@/components/cloud-agent-next/model-preferences';
+import {
+  GITHUB_IDENTITY_HINT_DISMISSED_STORAGE_KEY,
+  getGitHubIdentityHint,
+  getGitHubIdentityHintDismissed,
+  markGitHubIdentityHintDismissed,
+} from '@/components/cloud-agent-next/github-identity-hint';
 
 type Repository = {
   id: number;
@@ -102,6 +109,13 @@ type NewSessionPanelProps = {
   isDevcontainerAvailable: boolean;
 };
 
+type ContextualTipProps = {
+  body: string;
+  linkLabel: string;
+  href: string;
+  onDismiss: () => void;
+};
+
 export function NewSessionPanel({ organizationId, isDevcontainerAvailable }: NewSessionPanelProps) {
   const router = useRouter();
   const trpc = useTRPC();
@@ -111,6 +125,9 @@ export function NewSessionPanel({ organizationId, isDevcontainerAvailable }: New
   const fileInputRef = useRef<HTMLInputElement>(null);
   const commandListRef = useRef<HTMLDivElement>(null);
   const [devcontainer, setDevcontainer] = useState(false);
+  const [isGitHubIdentityHintDismissed, setIsGitHubIdentityHintDismissed] = useState<
+    boolean | null
+  >(null);
   const { mutateAsync: personalUploadUrl } = useMutation(
     trpc.cloudAgentNext.getAttachmentUploadUrl.mutationOptions()
   );
@@ -173,6 +190,21 @@ export function NewSessionPanel({ organizationId, isDevcontainerAvailable }: New
   const [isPreparing, setIsPreparing] = useState(false);
   const [attachmentMessageUuid, setAttachmentMessageUuid] = useState(() => crypto.randomUUID());
 
+  // ---------------------------------------------------------------------------
+  // GitHub identity awareness
+  // ---------------------------------------------------------------------------
+  const {
+    data: githubUserAuthorization,
+    isLoading: isGitHubUserAuthorizationLoading,
+    isError: isGitHubUserAuthorizationError,
+  } = useQuery({
+    ...trpc.githubApps.getUserAuthorization.queryOptions(),
+    enabled:
+      isGitHubIdentityHintDismissed === false &&
+      selectedRepo.length > 0 &&
+      selectedPlatform === 'github',
+  });
+
   const attachmentUpload = useCloudAgentAttachmentUpload({
     messageUuid: attachmentMessageUuid,
     organizationId,
@@ -197,6 +229,15 @@ export function NewSessionPanel({ organizationId, isDevcontainerAvailable }: New
 
   useEffect(() => {
     setDevcontainer(getDevcontainerEnabled());
+    setIsGitHubIdentityHintDismissed(getGitHubIdentityHintDismissed());
+
+    const handleGitHubIdentityHintStorage = (event: StorageEvent) => {
+      if (event.key === GITHUB_IDENTITY_HINT_DISMISSED_STORAGE_KEY && event.newValue === 'true') {
+        setIsGitHubIdentityHintDismissed(true);
+      }
+    };
+    window.addEventListener('storage', handleGitHubIdentityHintStorage);
+    return () => window.removeEventListener('storage', handleGitHubIdentityHintStorage);
   }, []);
 
   const handleDevcontainerChange = useCallback((enabled: boolean) => {
@@ -865,6 +906,20 @@ export function NewSessionPanel({ organizationId, isDevcontainerAvailable }: New
     [handleAutocompleteKeyDown, isFormValid, handleStartSession]
   );
 
+  const githubIdentityHint = getGitHubIdentityHint({
+    selectedRepo,
+    selectedPlatform,
+    authorization: githubUserAuthorization,
+    isLoading: isGitHubUserAuthorizationLoading,
+    isError: isGitHubUserAuthorizationError,
+    isDismissed: isGitHubIdentityHintDismissed !== false,
+  });
+
+  const handleDismissGitHubIdentityHint = useCallback(() => {
+    markGitHubIdentityHintDismissed();
+    setIsGitHubIdentityHintDismissed(true);
+  }, []);
+
   // ---------------------------------------------------------------------------
   // Integration missing view
   // ---------------------------------------------------------------------------
@@ -1326,6 +1381,42 @@ export function NewSessionPanel({ organizationId, isDevcontainerAvailable }: New
             />
           </div>
         </div>
+
+        {githubIdentityHint && (
+          <ContextualTip {...githubIdentityHint} onDismiss={handleDismissGitHubIdentityHint} />
+        )}
+      </div>
+    </div>
+  );
+}
+
+function ContextualTip({ body, linkLabel, href, onDismiss }: ContextualTipProps) {
+  return (
+    <div className="group/tip flex max-w-full justify-center text-center" role="status">
+      <div className="text-muted-foreground inline-flex max-w-full items-start justify-center gap-1 text-xs">
+        <span aria-hidden="true" className="invisible mr-1 shrink-0 px-1">
+          Dismiss
+        </span>
+        <span className="text-foreground font-medium">Tip:</span>
+        <span aria-hidden="true" className="text-border">
+          &middot;
+        </span>
+        <span className="min-w-0">
+          {body}{' '}
+          <Link
+            href={href}
+            className="text-blue-400 hover:text-blue-300 hover:underline focus-visible:underline"
+          >
+            {linkLabel}
+          </Link>
+        </span>
+        <button
+          type="button"
+          className="text-muted-foreground/70 hover:text-foreground focus-visible:text-foreground focus-visible:ring-ring pointer-events-none -my-4 ml-1 shrink-0 cursor-pointer rounded-sm px-1 py-4 underline decoration-border underline-offset-4 opacity-0 transition-opacity group-focus-within/tip:pointer-events-auto group-focus-within/tip:opacity-100 group-hover/tip:pointer-events-auto group-hover/tip:opacity-100 focus-visible:ring-1 focus-visible:outline-none [@media(any-pointer:coarse)]:pointer-events-auto [@media(any-pointer:coarse)]:opacity-100 [@media(hover:none)]:pointer-events-auto [@media(hover:none)]:opacity-100"
+          onClick={onDismiss}
+        >
+          Dismiss
+        </button>
       </div>
     </div>
   );
@@ -1334,7 +1425,6 @@ export function NewSessionPanel({ organizationId, isDevcontainerAvailable }: New
 // ---------------------------------------------------------------------------
 // Internal sub-component for repo items in the Command list
 // ---------------------------------------------------------------------------
-
 function RepoCommandItem({
   repo,
   isSelected,
diff --git a/apps/web/src/components/cloud-agent-next/github-identity-hint.test.ts b/apps/web/src/components/cloud-agent-next/github-identity-hint.test.ts
@@ -0,0 +1,102 @@
+import {
+  GITHUB_IDENTITY_HINT_DISMISSED_STORAGE_KEY,
+  getGitHubIdentityHint,
+  getGitHubIdentityHintDismissed,
+  markGitHubIdentityHintDismissed,
+  parseGitHubIdentityHintDismissed,
+} from './github-identity-hint';
+
+const visibleHintOptions = {
+  selectedRepo: 'kilo/example',
+  selectedPlatform: 'github',
+  authorization: { connected: false, githubLogin: null, revoked: false },
+  isLoading: false,
+  isError: false,
+  isDismissed: false,
+} satisfies Parameters<typeof getGitHubIdentityHint>[0];
+
+function createMemoryStorage() {
+  const values = new Map<string, string>();
+  return {
+    storage: {
+      getItem: (key: string) => values.get(key) ?? null,
+      setItem: (key: string, value: string) => values.set(key, value),
+    },
+    values,
+  };
+}
+
+describe('GitHub identity hint dismissal storage', () => {
+  it('uses one browser-local dismissal marker', () => {
+    expect(GITHUB_IDENTITY_HINT_DISMISSED_STORAGE_KEY).toBe(
+      'cloud-agent:github-identity-hint-dismissed'
+    );
+  });
+
+  it('treats only true as dismissed', () => {
+    expect(parseGitHubIdentityHintDismissed('true')).toBe(true);
+    expect(parseGitHubIdentityHintDismissed('false')).toBe(false);
+    expect(parseGitHubIdentityHintDismissed(null)).toBe(false);
+  });
+
+  it('persists and reloads browser-local dismissal', () => {
+    const { storage, values } = createMemoryStorage();
+
+    markGitHubIdentityHintDismissed(storage);
+
+    expect(values.get(GITHUB_IDENTITY_HINT_DISMISSED_STORAGE_KEY)).toBe('true');
+    expect(getGitHubIdentityHintDismissed(storage)).toBe(true);
+  });
+});
+
+describe('getGitHubIdentityHint', () => {
+  it('returns null when no repository is selected', () => {
+    expect(getGitHubIdentityHint({ ...visibleHintOptions, selectedRepo: '' })).toBeNull();
+  });
+
+  it('returns null for a GitLab repository', () => {
+    expect(getGitHubIdentityHint({ ...visibleHintOptions, selectedPlatform: 'gitlab' })).toBeNull();
+  });
+
+  it('returns null when authorization status is missing', () => {
+    expect(getGitHubIdentityHint({ ...visibleHintOptions, authorization: undefined })).toBeNull();
+  });
+
+  it('returns null while authorization status is loading', () => {
+    expect(getGitHubIdentityHint({ ...visibleHintOptions, isLoading: true })).toBeNull();
+  });
+
+  it('returns null when authorization status fails to load', () => {
+    expect(getGitHubIdentityHint({ ...visibleHintOptions, isError: true })).toBeNull();
+  });
+
+  it('returns null when a GitHub identity is connected', () => {
+    expect(
+      getGitHubIdentityHint({
+        ...visibleHintOptions,
+        authorization: { connected: true, githubLogin: 'octocat', revoked: false },
+      })
+    ).toBeNull();
+  });
+
+  it('returns null when a GitHub identity authorization was revoked', () => {
+    expect(
+      getGitHubIdentityHint({
+        ...visibleHintOptions,
+        authorization: { connected: false, githubLogin: 'octocat', revoked: true },
+      })
+    ).toBeNull();
+  });
+
+  it('returns null after the browser dismisses the awareness hint', () => {
+    expect(getGitHubIdentityHint({ ...visibleHintOptions, isDismissed: true })).toBeNull();
+  });
+
+  it('returns subtle setup copy until dismissed or connected', () => {
+    expect(getGitHubIdentityHint(visibleHintOptions)).toEqual({
+      body: 'Commit as yourself instead of the Kilo bot.',
+      linkLabel: 'Set up identity',
+      href: '/integrations/github#github-identity',
+    });
+  });
+});
diff --git a/apps/web/src/components/cloud-agent-next/github-identity-hint.ts b/apps/web/src/components/cloud-agent-next/github-identity-hint.ts
@@ -0,0 +1,75 @@
+import { safeLocalStorage } from '@/lib/localStorage';
+import type { RepositoryPlatform } from '@/components/shared/RepositoryCombobox';
+
+export const GITHUB_IDENTITY_HINT_DISMISSED_STORAGE_KEY =
+  'cloud-agent:github-identity-hint-dismissed';
+
+type GitHubUserAuthorization = {
+  connected: boolean;
+  githubLogin: string | null;
+  revoked: boolean;
+};
+
+type GitHubIdentityHintOptions = {
+  selectedRepo: string;
+  selectedPlatform: RepositoryPlatform;
+  authorization: GitHubUserAuthorization | undefined;
+  isLoading: boolean;
+  isError: boolean;
+  isDismissed: boolean;
+};
+
+export type GitHubIdentityHint = {
+  body: string;
+  linkLabel: string;
+  href: string;
+};
+
+type GitHubIdentityHintStorage = Pick<typeof safeLocalStorage, 'getItem' | 'setItem'>;
+
+const githubIdentityHint: GitHubIdentityHint = {
+  body: 'Commit as yourself instead of the Kilo bot.',
+  linkLabel: 'Set up identity',
+  href: '/integrations/github#github-identity',
+};
+
+export function parseGitHubIdentityHintDismissed(storedValue: string | null) {
+  return storedValue === 'true';
+}
+
+export function getGitHubIdentityHintDismissed(
+  storage: GitHubIdentityHintStorage = safeLocalStorage
+) {
+  return parseGitHubIdentityHintDismissed(
+    storage.getItem(GITHUB_IDENTITY_HINT_DISMISSED_STORAGE_KEY)
+  );
+}
+
+export function markGitHubIdentityHintDismissed(
+  storage: GitHubIdentityHintStorage = safeLocalStorage
+) {
+  storage.setItem(GITHUB_IDENTITY_HINT_DISMISSED_STORAGE_KEY, 'true');
+}
+
+export function getGitHubIdentityHint({
+  selectedRepo,
+  selectedPlatform,
+  authorization,
+  isLoading,
+  isError,
+  isDismissed,
+}: GitHubIdentityHintOptions): GitHubIdentityHint | null {
+  if (
+    !selectedRepo ||
+    selectedPlatform !== 'github' ||
+    !authorization ||
+    isLoading ||
+    isError ||
+    isDismissed ||
+    authorization.connected ||
+    authorization.revoked
+  ) {
+    return null;
+  }
+  return githubIdentityHint;
+}
diff --git a/services/git-token-service/src/github-user-authorization-service.test.ts b/services/git-token-service/src/github-user-authorization-service.test.ts
@@ -267,6 +267,20 @@ describe('GitHubUserAuthorizationService disconnect', () => {
     expect(database.deleted).toBe(true);
   });
 
+  it('identifies grant revocation requests with the GitHub user agent', async () => {
+    const request = vi.fn().mockResolvedValue(new Response(null, { status: 204 }));
+    vi.stubGlobal('fetch', request);
+
+    await makeService().disconnectUserAuthorization('user_1');
+
+    expect(request).toHaveBeenCalledWith(
+      'https://api.github.com/applications/client-id/grant',
+      expect.objectContaining({
+        headers: expect.objectContaining({ 'User-Agent': 'Kilo-Git-Token-Service' }),
+      })
+    );
+  });
+
   it('persists refreshed credentials before revoking an expired grant', async () => {
     database.rows = [
       { ...makeRow(), access_token_expires_at: new Date(Date.now() - 1000).toISOString() },
diff --git a/services/git-token-service/src/github-user-authorization-service.ts b/services/git-token-service/src/github-user-authorization-service.ts
@@ -426,6 +426,7 @@ export class GitHubUserAuthorizationService {
         Accept: 'application/vnd.github+json',
         Authorization: `Basic ${basicAuth}`,
         'Content-Type': 'application/json',
+        'User-Agent': 'Kilo-Git-Token-Service',
       },
       body: JSON.stringify({ access_token: accessToken }),
     });
